Ihre Wahl? Ihre Wahl? Ihre Wahl? Ihre Wahl? Ihre Wahl? Ihre Wahl? Ihre Wahl? Ihre Wahl? Ihre Wahl?
 

HTML

Textdatei dieser Seite: html4.txt


Vorbemerkungen

Was ist das schwierigste am Erstellen einer Homepage? Tipp: Es handelt sich nicht um eines der vielen technischen Probleme, sondern um ein menschliches: Faulheit. Für viele Besucher Ihrer Homepage ist nichts frustrierender als zu erkennen, dass sie auf einer völlig veralteten Seite Zeit und damit Geld verschwenden. Man sollte also immer die Aktualität des Angebotenen im Auge behalten und keine Versprechungen machen, die man nicht halten kann!

Wer HTML sucht ist bei SelfHTML bestens aufgehoben ;-) Wir "erfinden hier das Rad" nicht auf ein Neues!


Bildformate

Achten Sie auf die Größe (kByte) Ihrer Bilder, diese macht einen Großteil der Ladezeit aus. Entscheidend ist die Wahl des richtigen Formates für den jeweiligen Zweck. Für Fotos liefern JPG und PNG die besten Ergebnisse. Einfache Grafiken mit bis zu 216 Farben sollten als GIF gespeichert werden, da dieses Format optimale Ergebnisse bei kleinen Dateigrößen ermöglicht.

Nur wichtige Bildausschnitte sollten als Bild gespeichert werden. Außerdem sollten Bilder wieder verwendet werden, da sich diese dann bereits im Cache (auf der Festplatte des Besuchers) befinden und nicht neu vom Server geladen werden müssen. Wenn Sie außerdem dem IMG-Tag die Attribute WIDTH und HEIGHT zuordnen, wird dem Browser das Anzeigen des Bildes erleichtert, da die Größe bekannt ist. Beim Besucher entsteht das subjektive Gefühl eines schnelleren Bildaufbaus durch die angezeigten Platzhalter.

nach unten nach oben Hilfe

Tabellen

Setzen Sie verschachtelte Tabellen sparsam auf Ihrer Homepage ein, da erst die Berechnung (durch den Browser) für die inneren Tabellen abgeschlossen sein muss, bevor diese Maße für die Berechnung der äußeren Tabellen verwendet werden können. Da also erst die Tabellen-inhalte vorliegen müssen, damit eine Tabelle mit gleich hohen Zeilen und gleich breiten Spalten dargestellt werden kann, sollten Sie besser mehrere einzelne Tabellen verwenden.

Tabellen mit wenigen Zeilen erreichen Sie auch durch Zeilenumbrüche mit dem BR-Tag, anstatt jedes Mal neue Zeilen mit dem TR-Tag anzulegen. Texte einrücken können Sie auch ohne Tabellen einfach mit dem BLOCKQUOTE-Tag, Probleme mit Netscape Browsern verhindert ein   in jeder leeren Zelle und durch den Einsatz von CSS sparen Sie sich die FONT-Angaben für jede einzelne Zeile, indem Sie mit CLASS den Tabellenzellen einzelne Schriften zuordnen.


Hyperlinks

Außer, dass Ihre Links alle ein Ziel haben sollten, kann man nur zu leicht den abschließenden Slash (/) vergessen. Ohne diesen jedoch erkennt der Server nicht, dass er die index.html laden soll. Besser also man gewöhnt sich an ...sinnig.de/, oder hängt gleich die Datei (index.html) hinten an.

Schreiben Sie Ihre Links alle gleich! Bei jedem Unterschied in der Schreibweise versucht der Browser die Seite neu vom Server zu laden, anstatt sie schneller aus dem Cache zu holen. www.mausgrau.de/ ist beispielsweise für einen Browser nicht identisch mit www.Mausgrau.de/. Da die meisten Server unter UNIX "arbeiten" und diese Unterscheidung machen, sollte man dies immer berücksichtigen.

nach unten nach oben Hilfe

Animationen

In Zeiten in denen jede Minute teuer bezahlt werden muss, sollte man Haushalten mit den Mitteln des Besuchers und sich fragen ob, man dieses oder jenes optische Bonbon (Flash, Bilder, Imagemaps, animierte Giffs, ...) wirklich braucht. Viele Surfer sind außerdem noch mit älteren Browsern, auch auf langsameren Rechnern unterwegs und haben aus diesem Grunde die Anzeige von Bildern erst einmal abgeschaltet.


Inhaltsverzeichnis

Kein Buch kommt ohne Verzeichnis auf den Markt. Doch was sich schon seit Ewigkeiten bewährt hat muss nicht unbedingt gut sein? Darum lässt mancher Webdesigner die Besucher lieber im Dunkeln durch die Seite stolpern, anstatt ihm ein Inhaltsverzeichnis anzubieten. Die Betonung liegt hier aber auch auf Begriffen wie Inhalt oder Verzeichnis, mit einer "Sitemap" können die Wenigsten etwas anfangen, warum auch? Freuen würde ich mich auch manchmal über ein Stichwortverzeichnis :-)

nach unten nach oben Hilfe

Vertrauen in einen HTML-Editor ist gut ...

Kontrolle ist besser! Kaum ein Editor lässt Ihren Code unangetastet. Ohne Rücksicht auf die bereits bestehenden Formatierungen werden nachträgliche Änderungen durch setzen des gleichen Tags vollzogen. Ein neues Attribut, welches im Design-Fenster zugewiesen wird, erzeugt damit unnötigen Code. Dieser wirkt wie eine Bremse beim Laden der Seite, da hier jedes Byte zählt.

Weitere unnötige Ärgernisse sind das Einfügen von Tabellen, um Objekte zu positionieren und der viel zu großzügige Umgang mit Leer-stellen oder Einzügen. Auf der sicheren Seite bewegen Sie sich, wenn Sie Ihren Code vor dem Hochladen auf den Server nochmals mit einem schlichten Texteditor überarbeiten.


Erscheinungsbild

Bieten Sie Ihren Besuchern einen roten Faden, der sie begleitet über alle Ihre Seiten hinweg. Dies könnte eine einheitliche Navigation, ein konstantes Farbschema und auf jeden Fall gleich bleibende Schrift sein. Viele erfolgreiche Seiten benutzen außerdem Tabellen um das Erschei-nungsbild auf möglichen Plattformen (Mac, Unix, Windows, ... ) und Browsern (Internet Explorer, Netscape Navigator, Opera, ... ) sicher zu gewährleisten.

nach unten nach oben Hilfe

Neue Techniken

Die Verwendung von JavaScript, XHTML, CSS2, Frames sowie auf einzelne Browser zugeschnittene Tags sollten Sie auf das Notwendigste beschränken. Machen Sie Ihre Entscheidung über einen Einsatz ab-hängig vom Zielpublikum. Nicht jeder Ihrer Besucher ist Informatik-Student ;-) Die Info-Seite des Deutschen Bundestages sollte zum Bei-spiel für alle Bürger zugänglich sein. Wer hier gedankenlos vorgeht, sperrt mit Sicherheit interessierte Besucher aus.


Weitere Maßnahmen

Auf jeden Fall eine korrekte Schreibweise Ihres HTML-Codes und ein maßvoller, gezielter Einsatz von Kommentaren. Vermeiden Sie unnötige Leerstellen und Einschübe im Quelltext. Nehmen Sie dem Browser Arbeit ab, indem Sie absolute Werte in Tabellen und Bildern angeben. Verwenden Sie Thumbnails im Bildformat JPG oder PNG. Vor allem PNG ist in Bezug auf Qualität und Kompressionsrate unschlagbar. Fassen Sie sich kurz! Aussagekräftige Texte und kurze Seiten sorgen für schnelles Verständnis und schnelle Ladezeiten. Weniger ist gerade im Internet mehr. Über weniger animierte Giffs, Banner, Bilder im BMP-Format und ungefragt abgespielte Musik wird sich Ihr Besucher mit Sicherheit auch freuen.

JavaScript- und CSS-Anweisungen, die in mehreren Dokumenten zum Einsatz kommen, sollte man in externen Dateien ablegen, da diese dann aus dem Cache (Festplatte=schnell) und nicht vom Server (Modem / ADSL=langsamer) geladen werden müssen. Tipp: Verwenden Sie auch den Meta-Tag: <meta http-equiv="expires" content="Sun, 15 Jan 1998 12:00:00 GMT">, damit Ihr Dokument erst wieder vom Server geladen werden muss, wenn das Datum ("Dokument") abgelaufen ist.

nach unten nach oben Hilfe
 
 
°