no-flash

jomo.org

aus dem Unterricht von Johann Moser: Mathematik, Webdesign und Realtime Processing
Subscribe

Artikel der Kategorie »HTML & CSS«

HTML-Konventionen

15. Dez. 2005 Von: Johann Moser Kategorie: HTML & CSS Keine Kommentare →

http://www.jomo.org/index.php/html-konventionen
gedruckt am 04. Feb. 2012

Konventionen für Dateinamen

HTML-Dateien und Ordner sollen keine Sonderzeichen enthalten, anstelle von Leerzeichen wird der Underscore verwendet. Die Sonderzeichen werden in der URL-Leiste codiert dargestellt und stören daher die Lesbarkeit.

Weiters ist es empfehlenswert, die Dateinamen klein zu schreiben und auf eine konsequente Verwendung einer einheitlichen Extension zu (html) achten.

Die Startdatei eines einfachen Internet-Projektes sollte default.htm (Windows-Server) oder index.html (UNIX-Server) heißen. In diesem Fall braucht der Dateiname nicht mit der URL eingegeben zu werden. Außderdem ist für Webdesigner dann klar, welche Datei die Startdatei ist.

Konventionen für den Quellcode

Um den Quellcode gut lesbar zu halten, sind folgende Konventionen empfehlenswert:

Inhaltlich zusammengehörende Bereiche werden durch eine Leerzeile im Quelltext voneinander abgegrenzt (zb. innerhalb von <div>-tags.) Verschachtelte Inhalte werden durch Einrückungen (etwa 3 Leerzeichen) hierarchisch gegliedert.

Die Leerzeichen und leeren Absätze werden in der Browseransicht nicht angezeigt (Ausnahme: Abstand zwischen Bildern, wenn die <img>-tags nicht unmittelbar aufeinander folgen.

Grundsätzlich gilt die Trennung von Inhalt und Gestaltung, das heißt, Formatierungsvorschriften sind in Stylesheets zu schreiben.

Es ist auch möglich, Teile zu kommentieren. Ein mehrzeileiger Kommentar in HTML wird mit <!– eingeleitet und mit –> beendet.

Die Bild-Dateien für eingebundene Bilder und die Zieldateien von Hyperlinks müssen mit relativen Pfaden – soweit sie sich auf Dateien des eigenen Projektes beziehen – eingegeben werden.

Es ist unbedingt nötig, die Ordner- und Datei-Struktur eines Projektes am lokalen Computer gleich zu halten wie am Server. Für Bilder empfehle ich dringend einen Ordner images innerhalb eines Projektes, in dem die Bilder abgespeichert werden. Ein Verweis auf den Ordner Eigene Bilder oder Eigene Dateien kann nur zu Problemen führen, da diese Ordner am Server nie zur Verfügung stehen.

Relative Pfade

Wenn eine Bild nicht angezeigt wird oder ein Link nicht funktioniert, genügt ein Blick in den Quellcode dieser Seite im Browser. Hier kontrolliert man, ob die relativen Pfade richtig gesetzt sind. Bei einem fehlerhaften Link genügt oft ein Blick in die Statusleiste des Browsers, wenn man mit der Maus über den Link fährt. Hier sieht man sofort, ob ein Pfad-Problem vorliegt. Allerdings ist vorausgesetzt, dass man über die Dateistruktur des eigenen Projektes auch Bescheid weiß.

Fehlersuche

Werden Bilder nicht richtig angezeigt oder führen Links ins Leere, kontrolliert man zuerst die relativen Pfadangaben.

Bilder
Rechter Mausklick auf das nicht angezeigte Bild, Eigenschaften ansehen: sind Dateiname und relativer Pfad richtig? Befindet sich das Bild im angegebenen Ordner?

Links
Beim Drüberfahren über einen Link mit der Maus wird in der Statusleiste des Browsers das Ziel angegeben. Hier man kontrollieren, ob der Link richtig gesetzt wurde, vorausgesetzt man hat einen Überblick über die Ordnerstruktur des eigenen Projektes. Im Quelltext sind dann die Angaben zu korrigieren: meist sind die Fehler zu Beginn auf unklare Ordnerstrukturen zurückzuführen.