broken: Anfänger sucht Rat: Viele Fragen.

Halli Hallo.
Ist mein erster Beitrag hier lese SelfHTML aber schon seitdem ich mich mehr für HTML interresiert hab (bzw. hat mich nen Kumpel damals auf die Seite gestoßen als ich 0-Plan von HTML hatte).

Ich würde dennoch sagen das ich nen blutiger Anfänger bin und hab leider keinerlei (bzw. kaum) Erfahrung mit PHP oder JAVA und wie gesagt selbst meine HTML und CSS Kentnisse sind auch eher rudimentär (so schätze ich das jedenfalls ein). Bisher konnte ich allerdings immer das "bauen" was ich mir vorgenommen hatte. Wenn auch sicher stellenweise "unschönem" oder unnötig kompliziertem Code aber es hat immer funktioniert.

Mit meinem neusten Projekt stoße ich derzeit aber auf ein paar kleine Probleme wo ich bisher keine "perfekte" Lösung gefunden hab. Einige dieser Fragen sind eher konzeptionelle Probleme und andere sind eher von „technischer“ Natur. Wäre cool wenn ihr mir hier helfen könnt.

Fangen wir mal an :)

1 Absolute Pfade vs. Relative Pfade:
Ich hab seit gestern endlich mal "gelernt" einige generelle Sachen über die LINK Marke des CSS Codes einzufügen was mir tatsächlich einige Arbeiten erleichtert.
Bei diesem Einbau viel mir aber etwas auf was dann ein noch größeres Problem zu folge hat.

Ich baue meine Seiten zum testen immer erst einmal lokal auf meinem Rechner bevor ich Teile hochstelle. Ich benutze in den Dateien relative Pfade zu Grafiken und anderen HTMLs und würde eigentlich gern absolute Pfade benutzen da ich sonst später ein anderes Problem bekomme. Allerdings hab ich mit absoluten Pfaden auch so kleine Probleme.
Das erste Problem ist, jedes Mal wenn ich dann etwas hochladen würde müsste ich ja meine absoluten Pfade in jeder Datei ändern da sich diese Pfade ja geändert haben.

Die einzige Möglichkeit die ich derzeit wüsste wäre alles an „Content“ hochzuladen damit ich auch lokal die absoluten Web-Pfade angeben kann. Was mit allerdings dann sauer aufstößt ist das jedes Mal wenn ich was ändere und es testen will ja alles auf dem Webspace ändern muss, was zu Folge hätte das die Homepage dann auch im Web möglicherweise nicht mehr richtig funktioniert. Eigentlich hatte ich vor nur funktionierende Sachen hochzuladen damit ich die Seite weiter ausbauen kann während andere den bisherigen Stand schon benutzen können.

Gibt es da keine Möglichkeit das zu umgehen?
Nen „lokalen“ Server (oder ne simulation/emulation what ever) der meine Webspace Adresse quasi lokal clont und so das ich die absoluten Pfade lokal und auch später auf dem Webspace gleich lassen kann?

2. Einfügen externe Daten:
Ich hoffe der Titel passt. Bin mir selber nicht so sicher.
Was ich meine ist folgendes:
Da auf den Seiten die ich bauen will eigentlich IMMER (bis auf eine Ausnahme) der obere Bereich der Pages gleich bleibt würde ich den gerne aus einer andern Datei reinladen (ähnlich der LINK Marke vom CSS).
SHTML hat ja diese #include file Funktion hat. Diese habe ich auch in einem ehemaligen Projekt dafür benutzt. Da allerdings ja nicht unbedingt jeder „Webserver“ SHMTML unterstützt (wurde mir jedenfalls so gesagt).frage ich mich ob man das nicht auch über CSS oder JavaScript machen kann und wenn ja wie?
Bzw. Bekommt man das ohne große Vorkenntnisse von CSS/Java/PHP auch hin?

3. Mouseover Bildwechsel mit <map>:
Ich habe in meinem derzeitigen Projekt vor das wenn man mit dem Mauscursor über eine Grafik geht diese ausgewechselt wird. So wollte ich mir Schaltfächen(Buttons) bauen die halt „leuchten“ wenn man sie berührt. Also simples onmouseover und onmouseout.
Zusätzlich soll der Button natürlich auch funktionieren und hab dann wie gewohnt mit dem <map> einen Shape gebaut der auf der Grafik liegt.
Leider funktioniert das nicht. Sobald ich mit der Maus auf die Map-Area komme ist der Button wieder auf der onmouseout Grafik.
Ich hab dann gestern ein wenig im Netz gestöbert und hab bei CSS etwas gefunden was funktioniert nämlich:

#Header_HP a {width:108px; height:42px; display:table-cell; background:url("../images/header/hp_idle.jpg") top left no-repeat;}  
#Header_HP a:hover {background:url("../images/header/hp_hover.jpg") top left no-repeat;}

Nur hab ich jetzt ein kleines Problem mit dem ganzen.
Die Grafikdatei ist aus grafischen Designgründen ein bisschen Größer als die „eigentliche“ Klickfläche der Grafiksein sollte.
Heisst also an manchen stellen hat man „optisch“ den Button nicht berührt aber dennoch wechselt die Grafik dann auf die hover Grafik.
Dieses Problem ist natürlich zu verschmerzen und würde mein Projekt nicht kippen dennoch finde ich es ein wenig unschön.

Also hier die direkt Frage. Kann ich die <map> Shape und diesem CSS Code kombinieren (dumme Frage… hätte ich ja auch testen können) oder muss ich dafür einen ganz anderen Ansatz wählen?

So das waren „erst einmal“ meine „kurzen“ Fragen und ich hoffe ihr versteht was ich meine.^^
Entschuldigt diesen Überfall und ich hoffe ihr könnt mir irgendwie helfen.

Seeya
broken

  1. Hallo!

    1 Absolute Pfade vs. Relative Pfade:

    Grundsätzlich sollte man absolute Pfade nur bei externen Ressourcen verwenden (wenn z.B. der Bildserver ein anderer ist als der Deiner Seite), ansonsten sind relative Pfade nicht nur kürzer, sondern auch weniger fehleranfällig.

    1. Einfügen externe Daten:

    Was Du meinst, entspricht einer serverseitigen Einbindung von Daten. Dazu gibt es verschiedene Systeme, PHP ist nur eines davon. Der große Nachteil besteht darin, dass zum Testen immer ein Server vorhanden sein muss.

    1. Mouseover Bildwechsel mit <map>:

    Shapes haben keine eigene Darstellung, so dass dieser CSS-Trick nicht funktionieren wird; man könnte aber per JavaScript die Bildquelle des darunter liegenden Bildes ändern.

    Dazu solltest Du herausfinden, wie man mittels document.getElementById() das Bild anhand seiner ID referenzieren kann, wie man dessen .src-Eigenschaft verändert und wie man per onmouseover/onmouseout eine JavaScript-Funktion aufruft.

    Gruß, LX

    --
    RFC 1925, Satz 2: Egal, wie fest man schiebt, ganz gleich, wie hoch die Priorität ist, man kann die Lichtgeschwindigkeit nicht erhöhen.
    1. Hallo!

      1 Absolute Pfade vs. Relative Pfade:

      Grundsätzlich sollte man absolute Pfade nur bei externen Ressourcen verwenden (wenn z.B. der Bildserver ein anderer ist als der Deiner Seite), ansonsten sind relative Pfade nicht nur kürzer, sondern auch weniger fehleranfällig.

      »»

      Dank schonmal, aber zur Antwort zum Punk1:

      Klar ich benutz derzeit ja auch relative Pfade.
      Nur wenn ich wie derzeit diese #include file Funktion von SHTML nutze stimmen in dem "includiertem" Bereich die Pfade ja nicht mehr wenn die entsprechende HMTL Datei zum Beispiel innem Unterordner ist (was ich vorhatte zu machen).

      1. Einfügen externe Daten:

      Was Du meinst, entspricht einer serverseitigen Einbindung von Daten. Dazu gibt es verschiedene Systeme, PHP ist nur eines davon. Der große Nachteil besteht darin, dass zum Testen immer ein Server vorhanden sein muss.

      »»

      Gibt es also keine "gängiges" alternative zum SHTML #include?
      Also etwas wie nen kleines CSS oder Java-Script?
      bzw. kannst du mir einige möglichkeiten genauer erklären (ich wüsste spontan jetzt nicht wonach genau ich suchen muss)

      1. Mouseover Bildwechsel mit <map>:

      Shapes haben keine eigene Darstellung, so dass dieser CSS-Trick nicht funktionieren wird; man könnte aber per JavaScript die Bildquelle des darunter liegenden Bildes ändern.

      Dazu solltest Du herausfinden, wie man mittels document.getElementById() das Bild anhand seiner ID referenzieren kann, wie man dessen .src-Eigenschaft verändert und wie man per onmouseover/onmouseout eine JavaScript-Funktion aufruft.

      Ok. Klingt im ersten Moment erstmal wie bömische Dörfer. Aber das hat HTML ganz am Anfang ja auch.
      Ich schau hier auf Selfhtml mal nach der getElementById()
      So ne gewisse Ahnung hab ich da glaub ich schon (sprich dem Bild ne ID geben und dann Bildertausch im Java... puh... mal sehen :) )

      Gruß, LX

      danke dir!
      seeya
      broken

      1. Hi,

        Gibt es also keine "gängiges" alternative zum SHTML #include?
        Also etwas wie nen kleines CSS oder Java-Script?
        bzw. kannst du mir einige möglichkeiten genauer erklären (ich wüsste spontan jetzt nicht wonach genau ich suchen muss)

        </hilfe/faq.htm#quelltext-auslagern>

        MfG ChrisB

        --
        RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
        1. Hi,

          Gibt es also keine "gängiges" alternative zum SHTML #include?
          Also etwas wie nen kleines CSS oder Java-Script?
          bzw. kannst du mir einige möglichkeiten genauer erklären (ich wüsste spontan jetzt nicht wonach genau ich suchen muss)

          </hilfe/faq.htm#quelltext-auslagern>

          MfG ChrisB

          danke dir :)
          (mann bin ich blöd)

        2. Hi,

          Gibt es also keine "gängiges" alternative zum SHTML #include?
          Also etwas wie nen kleines CSS oder Java-Script?
          bzw. kannst du mir einige möglichkeiten genauer erklären (ich wüsste spontan jetzt nicht wonach genau ich suchen muss)

          </hilfe/faq.htm#quelltext-auslagern>

          MfG ChrisB

          so ich hab mich da mal nen bisschen eingelesen und geschaut das mein SSI (also #include file) scheinbar garnicht so archaisch ist wie ich dachte.

          Auch der PHP Ansatz schaut relativ einfach aus aber bei allem was ich da gesehen habe hätte ich doch wieder nen "pfad-fehler" wenn nicht JEDE HTML Datei im selben Order liegt, oder?

          Sprich die Datei: "xyz\pages\latest_news.shtml" nutzt per #include file das Include "main.inc" aus dem order "xyz\pages\includes"

          Liegt aber eine weitere Page die auch "main.inc" nutzen soll in einem andern Ordner wie zum Beispiel "xyz\pages\archive\old_news.shtml"  würden doch im geladendenen Include die Pfade nicht mehr stimmen, richtig?

          Wie kann ich das denn umgehen?

    2. Grundsätzlich sollte man absolute Pfade nur bei externen Ressourcen verwenden (wenn z.B. der Bildserver ein anderer ist als der Deiner Seite), ansonsten sind relative Pfade nicht nur kürzer, sondern auch weniger fehleranfällig.

      Hmpf, nein. Absolute Pfade sind optimal auch für Site-interne Links.
      Aber vielleicht verwechselt ihr das beide etwas, indem ihr URIs mit Authority-Angabe (Domain/IP) redet.

      mfg Beat

      --
      ><o(((°>           ><o(((°>
         <°)))o><                     ><o(((°>o
      Der Valigator leibt diese Fische
      1. Grundsätzlich sollte man absolute Pfade nur bei externen Ressourcen verwenden (wenn z.B. der Bildserver ein anderer ist als der Deiner Seite), ansonsten sind relative Pfade nicht nur kürzer, sondern auch weniger fehleranfällig.

        Hmpf, nein. Absolute Pfade sind optimal auch für Site-interne Links.
        Aber vielleicht verwechselt ihr das beide etwas, indem ihr URIs mit Authority-Angabe (Domain/IP) redet.

        mfg Beat

        hmmm...
        ich hab ja nichts gegen absolute pfade.

        Das einzige Problem das ich mit absoluten Pfaden habe ist das ich jeden Pfad in JEDER Datei ändern muss sobald ich sie von meinem lokalen Testort auf meinen Server hochlade.

        denn wenn ich offline(lokal) den pfad "d:\hompage\pages\news\latestews.shmtl" (beispiel) habe funktiniert dieser Pfad ja auf meinem Server nicht mehr.
        Dort müsste der pfad dann ja "http:\www.meinserver\homepage\pages\news\latestews.shmtl".

        Drum hatte ich gefragt ob ich auch irgendwie lokal die "http:\www.meinserver" faken kann damit ich die Pfade nicht anpassen muss.

        1. denn wenn ich offline(lokal) den pfad "d:\hompage\pages\news\latestews.shmtl" (beispiel) habe funktiniert dieser Pfad ja auf meinem Server nicht mehr.

          Ja, das liegt eben daran, dass du einen Pfad nutzt der zu einem file:// Schema gehört. Dieses kennt natürlich kein dokument-toot.

          Ich würde dir empfehlen, einen Webserver lokal zu installieren.
          Dadurch kannst du lokal Websites testen.
          Ein localer Webserver ist auf jeden Fall sinnvoll, vor allem das du wohl bald auch mit anderen serverseitigen Techniken wie PHP oder Perl experimentieren kannst.

          Dort müsste der pfad dann ja "http:\www.meinserver\homepage\pages\news\latestews.shmtl".

          Du hast noch ein anderes Problem: Forward-Slashes sind im Web die Norm. Windows unterstützt Backslashes. Auch dies solltest du berücksichtigen.

          Im übrigen sehe ich ja gerade, dass dein filetype auf SSI hindeutet. Ein weiteres Argument, weshalb du deine Seiten auf einem lokalen Webserver entwickeln solltest.

          mfg Beat

          --
          ><o(((°>           ><o(((°>
             <°)))o><                     ><o(((°>o
          Der Valigator leibt diese Fische
          1. denn wenn ich offline(lokal) den pfad "d:\hompage\pages\news\latestews.shmtl" (beispiel) habe funktiniert dieser Pfad ja auf meinem Server nicht mehr.

            Ja, das liegt eben daran, dass du einen Pfad nutzt der zu einem file:// Schema gehört. Dieses kennt natürlich kein dokument-toot.

            Ich würde dir empfehlen, einen Webserver lokal zu installieren.
            Dadurch kannst du lokal Websites testen.
            Ein localer Webserver ist auf jeden Fall sinnvoll, vor allem das du wohl bald auch mit anderen serverseitigen Techniken wie PHP oder Perl experimentieren kannst.

            Dort müsste der pfad dann ja "http:\www.meinserver\homepage\pages\news\latestews.shmtl".

            Du hast noch ein anderes Problem: Forward-Slashes sind im Web die Norm. Windows unterstützt Backslashes. Auch dies solltest du berücksichtigen.

            Im übrigen sehe ich ja gerade, dass dein filetype auf SSI hindeutet. Ein weiteres Argument, weshalb du deine Seiten auf einem lokalen Webserver entwickeln solltest.

            mfg Beat

            ja. ich nutze SSI derzeit für die #include file funktion da ich nich weiss wie ich sonst "einfach" andere Bausteine extern reinladen kann (sprich meinen Seiten-Kopf der auf jeder Seite gleich sein soll/kann).
            Da hab ich dann auch auch wieder nen Pfad Problem IM include, wenn ich relative pfade nehm, wenn die SHTML Datei innem andern Ordner liegt und somit der Pfad nicht mehr passt...

            Drum wär ich schon beigeistert wenn mal irgendwie nur den Pfad ab einer bestimmten Stelle (den ich immer gleich halten würde) angeben könnte.

            ich kanns grad schwer beschreiben... ich hoffe man versteh was ich meine

      2. Grundsätzlich sollte man absolute Pfade nur bei externen Ressourcen verwenden (wenn z.B. der Bildserver ein anderer ist als der Deiner Seite), ansonsten sind relative Pfade nicht nur kürzer, sondern auch weniger fehleranfällig.

        Hmpf, nein. Absolute Pfade sind optimal auch für Site-interne Links.

        Nein, sind sie nicht.

        Aber vielleicht verwechselt ihr das beide etwas, indem ihr URIs mit Authority-Angabe (Domain/IP) redet.

        Ja, du verwechselst etwas :)

        http://example.com/foo/bar ist absolut
        /foo/bar ist relativ
        ../bar ist relativ
        ./foo/bar ist relativ

        Vorzuziehen sind imho in den meisten Fällen URLs relativ zum Wurzelverzeichnis in der Form /foo/bar

        Intern ist diese Notationsform aber ggf. unpraktisch bei einem Serverwechsel, einer Änderung an der Konfiguration des Betriebssystems oder sonstwas kann sich dieser Pfad ändern.

        Allein die Defaults der Document-Roots von Apache weichen je nach Version und OS wild voneinander ab: http://wiki.apache.org/httpd/DistrosDefaultLayout

        Hier ist es vorteilhaft, wenn man sich irgendwo eine Konstante setzt, die ein Präfix für sämtliche relativen Pfade definiert.

        /var/www/httpd/example_com/ + foo/bar
        /srv/www/httpd/example_com/ + foo/bar
        /usr/local/www/data/example_com/ + foo/bar

        usw

        Wenn man portabel bleiben will (oder muss) ist es sogar empfehlenswert, das OS zu prüfen, unter Windows sehen die Pfade ggf. anders aus.

        1. Grundsätzlich sollte man absolute Pfade nur bei externen Ressourcen verwenden (wenn z.B. der Bildserver ein anderer ist als der Deiner Seite), ansonsten sind relative Pfade nicht nur kürzer, sondern auch weniger fehleranfällig.

          Hmpf, nein. Absolute Pfade sind optimal auch für Site-interne Links.

          Nein, sind sie nicht.

          Aber vielleicht verwechselt ihr das beide etwas, indem ihr URIs mit Authority-Angabe (Domain/IP) redet.

          Ja, du verwechselst etwas :)

          Nein tue ich nicht. Die Frage war zu absoluten Pfaden, also solchen, die sich auf http-root aufbauen und nicht relativ vom aktuellen Dokument aus.

          http://example.com/foo/bar ist absolut
          /foo/bar ist relativ

          ist ein absoluter Pfad

          ../bar ist relativ

          OK ist ein relativer Pfad

          ./foo/bar ist relativ

          OK ist ein relativer Pfad

          Vorzuziehen sind imho in den meisten Fällen URLs relativ zum Wurzelverzeichnis in der Form /foo/bar

          also absolute Pfade.

          mfg Beat

          --
          ><o(((°>           ><o(((°>
             <°)))o><                     ><o(((°>o
          Der Valigator leibt diese Fische
          1. Aber vielleicht verwechselt ihr das beide etwas, indem ihr URIs mit Authority-Angabe (Domain/IP) redet.

            Ja, du verwechselst etwas :)

            Nein tue ich nicht. Die Frage war zu absoluten Pfaden, also solchen, die sich auf http-root aufbauen und nicht relativ vom aktuellen Dokument aus.

            Ja, Punkt für dich - da steht Pfad, ich hab' aber URL gelesen :)

            Ich zeihe meinen Einwand zurück.

            Absolute Pfade (ggf. relativ zum Base-URL) sind in den meisten Fällen optimal.

            Absolute URLs sind hingegen Unsinn.

            "Intern" - also z.B. bei include-Pfaden oder vergleichbarem bleibe ich aber dabei: hardcodierte absolute Pfade vermeiden wo es geht.

        2. http://example.com/foo/bar ist absolut
          /foo/bar ist relativ
          ../bar ist relativ
          ./foo/bar ist relativ

          Vorzuziehen sind imho in den meisten Fällen URLs relativ zum Wurzelverzeichnis in der Form /foo/bar

          Intern ist diese Notationsform aber ggf. unpraktisch bei einem Serverwechsel, einer Änderung an der Konfiguration des Betriebssystems oder sonstwas kann sich dieser Pfad ändern.

          Allein die Defaults der Document-Roots von Apache weichen je nach Version und OS wild voneinander ab: http://wiki.apache.org/httpd/DistrosDefaultLayout

          Hier ist es vorteilhaft, wenn man sich irgendwo eine Konstante setzt, die ein Präfix für sämtliche relativen Pfade definiert.

          /var/www/httpd/example_com/ + foo/bar
          /srv/www/httpd/example_com/ + foo/bar
          /usr/local/www/data/example_com/ + foo/bar

          Genau... relativ zum root-verzeichnis langt mir ja.
          Da die Ordnerstruktur lokal und online die selbe sein wird.
          Nur die Adresse (also bei mir ne festplatte/ordner und im web die http-adresse).

          Ich muss zugeben ich steh grad etwas auf dem schlauch mit dem Konstante setzen und deinem Beispiel darunter.

          Sorry... ich bin wirklich noch ne anfänger.

          Können wir mal "eben" nen beispiel bauen?

          also nehmen wir an mein lokaler Root Pfad ist:
          d:\work\homepage\ (dadrin liegt dann die startseite und halt alle andern unterordern wie images includes usw usw)

          und der pfad auf meinem webspace wäre:
          http:\www.meinserver.de\hompage\

          darin dann die selbe struktur wie im lokalen System.
          Wie müsste dann zum beispiel nen

            
          <div <img src="../images/header/header.jpg" border="0">  
          </div>  
          
          

          aussehen?

          Wie schreibe ich die passenden Variablen... kann oder muss ich die global für die ganze Page definieren und kann ich die auch über nen CSS oder #include einbinden?