(X)HTML- und CSS-Fehleranalyse

20.11.2005 Fehlerbehebung bei der Erstellung von Webseiten kann mitunter eine recht schwierige Angelegenheit sein. Ich möchte an dieser Stelle einmal grob die Vorgehensweisen festhalten, die sich für mich bei der Fehleranalyse eigener wie auch fremder Seiten bewährt haben und beziehe mich hierbei in besonderem auf den (X)HTML- und CSS-Quelltext. Vorteilhaft für eine Analyse ist auch eine Fehlerprophylaxe, vor allem, wenn man mal unter Zeitdruck Anzeige-Fehler beseitigen muss.

1. Eigene Fehler

Bevor man sich die Frage stellt, warum der Browser etwas falsch anzeigt, sollte man zuerst mithilfe eines oder mehrerer Validatoren überprüfen, ob der HTML-Quelltext und das CSS überhaupt fehlerfrei sind. Dabei kann es durchaus hilfreich sein, die Fehler zu beseitigen, bevor sie in den Browsern Anzeigefehler hervorrufen, die mit ihrer Fehlerkorrektur einige Fehler abfangen können. So muss man sich später nicht erst durch eine Vielzahl von Fehlern kämpfen, wenn es dann doch Probleme gibt.

2. Browser(-Version)

Als nächstes gilt es festzuhalten, bei welchem Browser und bei welcher Browserversion der Fehler auftritt. Oft gibt es mehrere Lösungswege, aber nur ein oder zwei, die mit allen wichtigen Browsern möglich ist. Es empfiehlt sich daher frühzeitig mit verschiedenen Browsern zu testen, und nicht erst, wenn eine Seite schon fast fertig erstellt ist, und sich der bereits gegangene Weg dadurch womöglich erst dann als Sackgasse herausstellt. Weiter empfehle ich die Verwendung von drei ausreichend verschiedenen Testbrowsern. Wenn sich zwei Browser einig sind in der Darstellung, dann ist es sehr wahrscheinlich, dass der dritte spinnt. Für Windows bieten sich hierfür der Internet Explorer, Firefox und Opera zum Testen an (Firefox, Mozilla und Netscape sind einander zu ähnlich).

3. Doctype-Angabe

Ein (X)HTML Dokument sollte über eine Doctype Angabe verfügen, schon als Voraussetzung zu Punkt 1. (Zur Wahl des Doctypes siehe auch: Welche (X)HTML-Version verwenden?) Bei welcher Doctype-Angabe tritt der Fehler auf? Auch dies muss noch getestet werden, denn Browser können bei einem Doctype Switching in einen anderen Anzeige-Modus springen. Oft lassen sich durch einen Wechsel des Doctypes auch schon Fehler beseitigen

4. Browser Bugs

Erst jetzt steht die Suche nach dem Browser Bug an. Hierzu kann man z.B. Buglisten wie Positon is Everything konsultieren. Dort findet man meist auch einen Workaround für den betreffenden Bug. Zur Bestimmung des Bugs ist es oft nicht nur notwendig, die Browserversion zu kennen (Punkt 2), sondern auch die auslösenden HTML- und CSS-Elemente. Diese kann man dadurch ausfindig machen, dass in einer exakten Kopie des Quelltextes nach und nach alle (HTML- und CSS-)Elemente entfernt werden. Tritt der Bug nicht mehr auf, wird der zuvor gelöschte Abschnitt wieder hinzugefügt, und ein anderer gelöscht, bis nichts mehr gelöscht werden kann, ohne den Bug zu beseitigen. Der Rest enthält neben elementaren Elementen dann auch diejenigen, die den Bug auslösen.

2 Kommentare / Trackbacks