|
Gemeinde der Christen ECCLESIA | |
Hinweise zur "richtigen" Gebrauch von HTML(aus "SELFHTML" von Stefan Münz, http://www.teamone.de/selfhtml/ Für besonders eilige Zeitgenossen gibt es am Ende des Dokuments noch eine kurze Zusammenfassung. Allgemeine HinweiseDefinitive Richtlinien für "richtiges" HTML gibt es nicht. Denn HTML ist in ständiger Weiterentwicklung begriffen. Es hat daher keinen Sinn, an dieser Stelle den Gebrauch irgendwelcher HTML-Tags zu verdammen oder vorzuschreiben. Insgesamt ist es auf jeden Fall empfehlenswert, sich so weit wie möglich an den HTML-Sprachstandards des W3Konsortiums zu orientieren. [Man findet diese unter http://www.w3.org/] Eigentlich ist es viel besser zu beschreiben, wie man es auf keinen Fall machen sollte. Dazu gibt eine wunderbare Anleitung im WWW: die Goldenen Regeln für schlechtes HTML von Stefan Karzauninkat [http://www.karzauninkat.com/Goldhtml/]. Nicht für bestimmten Browser schreibenWenn Sie Dateien im WWW platzieren wollen, sollten Sie zum Testen Ihrer Dateien mehr als einen WWW-Browser verwenden. Verwenden Sie die weit verbreiteten Produkte wie Netscape und den MS Internet Explorer, wenn es irgendwie geht auch in mehreren Versionen (beim MS Internet Explorer leider nicht möglich), aber auch mal ein mäßigeres Produkt wie etwa Mosaic. [Ein kleiner Anhaltspunkt: unter http://ecclesia-gemeinden.de/statistik/statistik.html#browser gibt es eine Übersicht, welche Browser bei den Nutzern der ECCLESIA-Website am meisten in Gebrauch sind.] Wenn Sie die Möglichkeit haben, auf mehreren Plattformen (MS-Windows, Macintosh, Sun usw.) zu testen, machen Sie unbedingt Gebrauch davon. Es kann Ihnen niemand verbieten, HTML-Dateien zu schreiben, die nur von Netscape oder nur vom MS Internet Explorer korrekt interpretiert werden (wie das viele Leute tun, vor allem im kommerziellen Bereich, wo es um Outfit geht). [Aber man sollte es trotzdem lieber bleiben lassen!] In diesem Fall ist es jedoch angebracht, einen Hinweis einzubauen, dass die betreffenden Seiten für den Leistungsumfang eines bestimmten WWW-Browsers erstellt wurden. Versuchen Sie aber im Normalfall, einen Mittelweg zu erwägen. [Man sollte auch gut abwägen, ob es immer die neuesten Tags und Gimmicks sein müssen. Es gibt wirklich noch Leute im Netz, die nicht den neuesten Browser haben. Außerdem sollte man beachten, dass es Browser gibt, die keine Frames darstellen können (z.B. für Leute, die sehbehindert sind). Deshalb unbedingt <NOFRAMES>-Angaben machen, damit die Seiten dann nicht einfach leer sind]. Nicht für bestimmte Bildschirmauflösung schreibenSie wissen erstens nicht, welche Bildschirmauflösung die Besucher Ihrer Seiten haben, und zweitens wissen Sie nicht, ob die Anwender ihren Browser im Vollbildmodus laufen lassen. Deshalb hat es normalerweise wenig Sinn, über die "wahrscheinlichste" Bildschirmauflösung beim Anwender zu mutmaßen. Verwenden Sie bei Tabellen oder Frames tendenziell eher prozentuale Breiten und Höhenangaben. Absolute Pixelangaben haben nur dort einen Sinn, wo beispielsweise die erste Spalte einer blinden Tabelle über einem farblich zweigeteilten Hintergrundbild liegen soll. Ansonsten sollten Sie sich nicht zu sehr auf solche Vorstellungen wie die versteifen, daß eine Grafik oder ein Absatz bei jedem Anwender genau 10,8 cm vom linken Rand entfernt beginnt. Wenn das bei Ihnen gut aussieht, bedeutet das noch lange nicht, dass es bei jemand anderem gut aussieht, und in einigen Fällen könnte es auch ausgesprochen schlecht aussehen. [Kleiner Tipp am Rande zur Lesbarkeit längerer Texte: Wenn der Text zu breit ist, ermüdet man sehr schnell beim Lesen. Bei Printmedien versucht man Zeilenlängen von 40 Zeichen nicht zu überschreiten. Auf dem Bildschirm sind ca. 400-600 Pixel bei Standard-Schriftgröße ein grober Richtwert]. Tags nicht zweckentfremdenBesonders die logischen Tags von HTML sollten Sie nicht benutzen, um bestimmte Formatier-Effekte zu erzielen. So verwenden einige Leute z.B. das <blockquote>-Tag, um Absätze einzurücken, nur weil die Mehrzahl der Browser den Text, der in <blockquote> ... </blockquote> eingeschlossen ist, als eigenen, eingerückten Absatz darstellen. Das <blockquote>-Tag ist jedoch für Zitate gedacht, und sollte auch nur dafür verwendet werden. Noch häufiger wird mit Überschriften Schindluder getrieben. Überschriften sind nicht dazu da, um Text groß und fett zu machen, sondern dazu, logische Hierarchieverhältnisse zwischen Textabschnitten zu markieren. Wenn Sie Text formatieren wollen, dann benutzen Sie CSS Style-Sheets. Benutzerfreundliche SeitenDamit zusammen hängt ein weiterer Punkt: es hilft dem Benutzer sehr, wenn Dokumente und ganze Websites eine klare, nachvollziehbare Struktur haben. Man findet sich dann besser und schneller zurecht und fühlt sich "wohl" auf den Seiten. Dazu trägt auch bei, dass nicht zu viele Farben und Fonts auf einer Seite gemischt werden. Gute Seiten sind nicht trist, aber weisen doch eine gesunde Einheitlichkeit auf. Faustregel: nicht mehr als 2 verschiedene Fonts auf einer Seite. – Außerdem sollte man evtl. ein Corporate Design, also eine einheitliche Darstellung auf allen Seiten einer Website verwenden. Die wichtigen Inhalte einer Seite sollten ohne Scrollen zu sehen sein. Also lieber kleinere Dokumente machen. Das verringert übrigens auch die Ladezeit. Besonders wichtig ist das, wenn man aus Layout-Gründen größere Textblöcke oder gar das ganze Dokument in eine Tabelle packt. Diese wird nämlich erst nach dem vollständigen Laden (und der anschließenden Berechnung des Browsers) angezeigt. Bei großen Seiten kann das zu unangenehmen Wartezeiten führen (und dazu, dass der Besucher die Ladezeit eben nicht abwartet, sondern die Seite ganz verlässt). Regeln für Sonderzeichen beachtenViele Browser stellen deutsche Umlaute, scharfes S und andere Sonderzeichen korrekt am Bildschirm dar, auch wenn die Zeichen nicht vorschriftgemäß maskiert wurden [z.B. ä als ä] und eine Angabe zum benutzten Zeichensatz fehlt. Das hängt jedoch damit zusammen, dass der Browser, wenn er auf Sonderzeichen stößt, einfach auf den Zeichensatz zugreift, den Ihr Rechner verwendet (unter MS-Windows z.B. den ANSI-Zeichensatz). Sobald eine solche Datei jedoch auf einem Rechner angezeigt werden soll, der einen anderen Zeichensatz verwendet, oder mit einem Browser, der nicht so tolerant ist, werden Wörter unschön verstümmelt. [Im <HEAD>-Bereich kann man übrigens den Zeichensatz angeben, mit dem ein Dokument dargestellt werden soll. Dann kann man auch im Text uncodierte Umlaute verwenden. Für einen deutschen Text empfiehlt sich die Angabe <META http-equiv="content-type" content="text/html; charset=iso-8859-1">. Von der Verwendung der von Microsoft gerne beutzten Angabe "charset=windows-1252" möchte ich abraten, da nicht jeder ein Windows-Betriebssystem hat und iso-8859-1 genauso gut oder besser funktioniert.] Start- und End-Tags verwendenModerne Browser verfügen über relativ ausgereifte Algorithmen, um HTML-Dateien entsprechend der notierten Tags anzuzeigen. Bei Netscape und einigen anderen Browsern genügt es in vielen Fällen, nur ein Start-Tag zu notieren, z.B. <dl>, ohne das zugehörige </dl> anzugeben. Nicht alle Browser sind jedoch so tolerant. Fehlende End-Tags (meist aus Schreibfaulheit weggelassen), werden dort mit Anzeigefehlern bestraft. Da HTML immer umfangreicher und komplexer werden wird, wird es zukünftig sogar wahrscheinlich sein, dass die unbedingte Einhaltung von Anfangs- und End-Tag auch für Elemente wie <p> gefordert wird. Auch im Hinblick auf die Einhaltung der Grundregeln der ISO-normierten Sprache SGML ist das durchgängige Verwenden von Start- und End-Tags wichtig. Ehrliche und aussagekräftige Verweistexte verwendenGenerell gilt: das Ziel eines Verweises sollte das halten, was der Verweis verspricht. Das bedeutet beim Setzen des Verweises: der Verweistext sollte weder zu viel noch zu wenig versprechen. Wenn Sie beispielsweise Information über ein Software-Produkt anbieten, ohne es zum Download anzubieten, ist es unfair, dem Anwender mit einem Verweis auf die Information zu suggerieren, er könne das Produkt auch gleich downloaden. Verweise können in HTML an jeder beliebigen Stelle im Text stehen. Wenn Sie jedoch einmal Text lesen, in dem jedes zweite Wort ein Verweis ist, werden Sie schnell merken, dass dies den Lesefluss ungemein stört. Der Grund dafür ist, dass Verweise immer gleich die Aufmerksamkeit auf sich ziehen und den Leser von seiner eigentlichen Aufgabe, dem geistigen Erfassen des im Text Gemeinten, ablenken. Um so wichtiger ist es, dass Verweise innerhalb des Fließtextes dem Anwender keine Rätsel aufgeben, sondern sofort erfassbar sind. Verwenden Sie einen Verweis innerhalb des Fließtextes also nur dann, wenn der Verweistext sinnvoll ist. Und formulieren Sie Sätze, in denen verweis-sensitiver Text vorkommt, so, dass der Verweistext aussagekräftig ist. Schreiben Sie z.B. nicht: "Für weitere Information klicken Sie hier", sondern: "Weitere Information ist ebenfalls verfügbar". Grafiken sinnvoll einsetzenWenn Sie nicht gerade eine virtuelle Kunstausstellung in HTML programmieren, sollten Sie sich mit großen Grafikdateien zurückhalten. Bedenken Sie bei Dateien, die Sie fürs WWW erstellen, dass viele Anwender einen volumenabhängigen Internet-Zugang haben, d.h. sie zahlen dafür, wie viel Daten sie in den Arbeitsspeicher ihres Rechners laden. Zwar erlauben die meisten Browser, das Laden von Grafiken auszuschalten, doch falls der Anwender keinen Gebrauch von dieser Funktion macht, heißt das noch lange nicht, dass er bereit ist, ohne Ankündigung eine 1-Megabyte-Grafik zu laden. Versuchen Sie es daher lieber mit kleinen, wohlplatzierten Grafiken. Oft genügen 16 Farben statt 256 oder gar 16,7 Mio. Das macht die Grafiken deutlich kleiner. Andererseits sollten Sie keinesfalls auf den Einsatz von Grafiken verzichten. Reiner Text ist am Bildschirm nämlich wesentlich ermüdender zu lesen als in Printmedien. Deshalb sollten Sie längere Texte möglichst reichhaltig strukturieren und auflockern. Dazu gehört auch die Verwendung von Grafiken. Ideal sind kleine Grafiken in Icon-Größe. Die sind schnell geladen, und Sie können bedenkenlos mehrere davon pro HTML-Datei referenzieren. Kleine Grafiken können auch bestimmte Corporate-Identity-Funktionen oder Orientierungsfunktionen übernehmen. Der Vorteil solcher mehrfach verwendeter Grafiken ist, dass die meisten Browser sie nur einmal laden und dann im Speicher halten. Grafiken mit Größenangaben und Alternativtext versehenWWW-Seiten werden von modernen Browsern deutlich schneller und sauberer aufgebaut, wenn bei jeder referenzierten Grafik die genauen Angaben zu Breite und Höhe der Grafik notieren. Außerdem lassen die Browser entsprechend große Platzhalter frei, wenn die Grafik gar nicht oder nicht vollständig übertragen wird, und die übrige Seite wird dadurch nicht "zerhauen". Bei Grafiken sollten Sie sich auch angewöhnen, Alternativtexte zu notieren. Der Anteil der Netzteilnehmer, der mit nicht-grafikfähigen Browsern unterwegs ist, wird zwar immer verschwindender. Doch viele Anwender schalten angesichts der oft schlechten Übertragungsraten im WWW die Anzeige von Grafiken in ihrem WWW-Browser aus. Besonders bei WWW-Seiten, die hauptsächlich aus Grafiken bestehen, gehören Alternativtexte deshalb zum guten Ton. Urheberrechte beachtenNicht nur bei Grafiken sollte man die Urheberrechte beachten. Wenn das Kopieren nicht ausdrücklich erlaubt ist, sollte man davon ausgehen, dass es nicht gewünscht wird. Im Zweifelsfall kann man ja per Email nachfragen. Aus einem ähnlichen Grund sollte man auch fremde Seiten nicht in einen Frame der eigenen Seiten laden. Das erweckt den Eindruck, dass es sich dabei um eine eigene Seite handelt. Das will aber meist weder der Autor der fremden Seite, noch man selbst. Also bei externen Links also immer "target=_top" oder "target=_new" verwenden. Alle Seiten und Links ausgiebig prüfenEs zeugt nicht gerade von Professionalität, wenn Seiten falsch dargestellt werden oder Links nicht funktionieren. Bei Unix-Servern (wie zum Beispiel unserem eigenen) muss man auch auf Groß- und Kleinschreibung bei den Pfaden und Dateinamen achten. Es gibt inzwischen gute Hilfsmittel im Netz, die einem bei dieser Aufgabe helfen, so zum Beispiel den CSE HTML-Validator (http://www.htmlvalidator.com/ sorgt für korrektes HTML) oder den CyberSpyder (http://www.cyberspyder.com/ prüft ob alle Links funktionieren). Auch eine korrekte Rechtschreibung (ob alt oder neu) ist kein unnötiges Extra! [Ein gutes Tool zum Aufspüren nicht funktionierender Links ist Xenu (http://home.snafu.de/tilman/xenulink.html) – das Beste daran: es ist kostenlos!) META-InformationenMan will ja schließlich gefunden werden. Deshalb ist es dringend anzuraten META-Informationen im Datei-Kopf unterzubringen. Diese sorgen dafür, dass die Seiten von Suchmaschinen besser indiziert und somit leichter gefunden werden. Eine Einführung in META-Tags findet man z.B. unter http://ecclesia-gemeinden.de/service/meta.html. Zusammenfassung und Kurzübersicht
|
