HomeKontaktImpressum
Sie sind hier: Home

HTML-Code-Struktur minimieren

Die Struktur einer Internetseite kann sich in erheblichem Maße auf die Website-Performance auswirken. Aufgeräumter und kompakter HTML-Code führt nicht nur dazu, dass der Webserver geringere Datenmengen ausliefert. Auch auf dem Client laufende Scripte, die per DOM auf die Seitenelemente zugreifen, arbeiten schneller.

Da sich die Seitenstruktur einer Website auch auf den Umfang der vom Webserver auszuliefernden Datenmenge auswirkt, sollte natürlich auch der einer Seite zugrunde liegende Code nach Möglichkeit so knapp gehalten werden wie es eben geht. Immerhin soll die Homepage Informationen ausliefern und nicht eine aufgeblasene Sammlung überflüssiger und logisch nicht nachvollziehbarer Sttrukturelemente. Die einzelnen in der Seite verbauten Tags sollen – auch im Hinblick auf Aspekte bzgl. Barrierefreiheit und logischem Aufbau – sparsam und auf Basis ihres Bestimmungszwecks genutzt werden. Zwar sind Seitenlayouts mit Hilfe von Tabellen sehr leicht umsetzbar, allerdings sollte man sich gut überlegen, ob diese Strukturierung künftig noch tragbar ist.

Noch ein Grund weshalb man sich bei der Nutzung von Strukturelementen zurück zu halten sollte, besteht darin, dass der Vorgang des Renderns – der Browser interpretiert die Struktur der Internetseite und stellt diese, unter Berücksichtigung der CSS-Angaben, im Browserfenster dar – mit wachsender Seitenstruktur auch mehr Zeit benötigt um diese darzustellen. Letztlich würde sich die Zeit bis zur vollständigen Darstellung von komplexen Internetseiten unnötig verlängern – die Usability leidet und der Seitenbesucher ist verärgert.

Direkte Angaben zur Formatierung von Seitenelementen sollten ebenso in das Stylesheet ausgelagert und nicht – womöglich noch mehrfach wiederholt – im Dokument angegeben werden. Ob das Stylesheet extern gespeichert oder direkt in die Seite eingebettet wird, ist dabei unerheblich. In jedem Fall sollte bereits bei der initialen Erstellung einer Internetseite die konsequente Trennung von Layout und Inhalten verfolgt werden.

Auch im Hinblick auf die Wartung bzw. Pflege einer Website ist es sinnvoll, dass die Struktur der vom Webserver ausgelieferten Internetseiten nicht allzu komplex wird. Schließlich leidet die Übersichtlichkeit des Codes unter zahlreich verschachtelten HTML-Elementen und Änderungen im Zuge der Homepagepflege werden – insbesondere nach längeren Bearbeitungspausen – entsprechend erschwert. In solch einem Fall gestaltet sich auch die Fehlersuche beim Ausmerzen von Darstellungsproblemen mittels des durch die Homepage genutzten Stylesheets immer schwieriger. Grundsätzlich bedeutet ein kompaktes Template zugleich auch, dass man mit einem ebenso kleinen Stylesheet auskommt – geringe Zahl genutzter Tags im Dokument benötigt auch wenige CSS-Regeln zur Steuerung der Darstellung.

Ein weiterer Grund, weswegen eine möglichst kompakte Seitenstruktur gewählt werden sollte, ist der, dass es zu einer Verbesserung der Script-Performance kommt. Gerade die allseits bekannten und als schick empfundenen Dienste aus der Sparte „Web 2.0” nutzen den Zugriff auf Elemente per JavaScript/DOM um bestimmte Elemente im HTML-Dokument zu manipulieren. Die Website-Performance derartiger internetbasierter Anwendungen ist von hoher Bedeutung, da diese möglichst flüssig – eben wie eine normale Anwendung auf einem lokalen System – laufen sollten. Stockt die Ausführung, so leidet die Usability dieser Dienste und die Nutzer wenden sich schnell ab und suchen nach alternativen Anbietern.

Je zahlreicher die Elemente (Tags) in einem HTML-Dokument, desto aufwändiger sind Abfragen, die auf der Struktur des Dokuments operieren (etwa mittels getElementsByTagName oder getElementsByName). Obwohl die Aktivitäten der Entwickler von Browseranwendungen hinsichtlich der Geschwindigkeit der integrierten JavaScript-Interpreter mittlerweile zu deutlich performanteren Engines geführt haben, sind diese längst noch nicht bei allen Internetnutzern im Einsatz. Bei älteren Browseranwendungen kommt es schnell zu einem Einbruch der Verarbeitungsgeschwindigkeit, wenn eine Website in großen Dokumentstrukturen formuliert ist.

  
© 2009-2024 Möglichkeiten zur Steigerung von Geschwindigkeit und Usability Ihrer eigenen Website