Webstandard & Webdesign - CSS, HTML

 

Sinn und Zweck von Überschriften

Jeder der Webseiten entwickelt sollte wissen, dass für Überschriften das Element h in 6 Abstufungen innerhalb eines HTML Dokumentes zum Einsatz kommen sollte. Wobei für h1 die grösste und h6 die kleinste Art der Überschriften benutzt wird, auch wenn diese wiederum von den unterschiedlichen Browsern auf verschiedenen Plattformen unterschiedlichst gross dargestellt werden. Was sollte innerhalb einer Webseite eigentlich als h1 definiert werden?

Die einzelnen Überschriften besitzen, wie oben bereits erwähnt,verschiedene Wertigkeiten, somit sollte in der Hierarchie der Titel eines Webdokumentes im Sinne der Semantik so angelegt sein, dass h1 nur einmal definiert wird, da es mit dem Webseitentitel, den mit der höchsten Wertigkeit auszeichnet ( siehe Beispiel ).

 

h1 = Seitentitel
( bspw. Titel der Webanwendung )

h2 = Überschrift der aktuellen Seite
( bspw. Produkte )

h3 = Überschrift eines Artikels der Seite
( bspw. neue Produkte )

h4 = Überschrift für einen 1.Absatzes des Artikels der Seite
( bspw. Produktmarke eines der neuen Produkte )

h4 = Überschrift für einen weiteren 2.Absatzes des Artikels der Seite
( bspw. weitere Produktmarke eines der neuen Produkte )

...

 

Die Frage die man sich auf Grund der zahlreichen unterschiedlichen Herangehensweisen stellen sollte ist, ab wann denn eigentlich ein Dokument beginnt? Da viele Ihre Überschriften anhand der Darstellung von Screens ( bspw. einer Photoshopdatei ) anlegen ohne die Dokumentstruktur zu berücksichtigen, wird der eigentliche Seitentitel in der Vorlage oft als Grafik dargestellt ( was an sich ja nicht falsch ist, solange diese mit dem Tag h1 versehen wird). Eine gut Möglichkeit hierfür wäre auch auf die Technik des Image-Replacements zurückzugreifen. Oft wird aber für den Webseitennamen auch nicht die vom W3C empfohlene Auszeichnung verwendet, sondern auf ein span oder div mit einer Klasse oder ID namens "websitetitle", "title" oder "headline" zurückgegriffen. Wenn man aber eine Webseite erst inhaltlich strukturell anlegt ( erst den Quellcode, dann die Styles ), dürfte es offensichtlich sein was die erste Überschrift und somit der Title des Webdokumentes sein sollte. Das die strukturelle Reihenfolge h1, h2, h3 ... beibehalten werden sollte und keine übersprungen oder vertauscht werden sollten ( bspw. h1, h4, h2 ).

Wenn es doch so offensichtlich und eigentlich auch unkompliziert umzusetzen ist, warum schaffen es dann bspw. Portalbetreiber wie die von Immobilienscout24.de nicht sich daran zu orientieren? Die Seite wurde erst kürzlich einem Relaunch unterzogen und verwendet bspw. auf der Startseite im gesamten Dokument ein h3 und ein h5, wobei das h3 korrekterweise eigentlich eher den HTML-Tag legend verdient hätte.

Ein weiteres Beispiel wäre www.otto-baumarkt.de. Hier wird zwar ein h1 und h2 verwendet, dem folgt aber ein h4 und kein h3. Außerdem ist die Überschrift, der Titel mit der höchsten Wertigkeit eines Webdokumentes, die Überschrift einer Linkliste in der Marginalspalte und nicht der Titel des Webseitendokumentes.

Eigentlich sollte man davon ausgehen, dass Themen wie diese keiner Diskussion mehr würdig seien, aber leider würden sich diese negativen Anwendungsbeispiele unendlich weiterführen lassen. Frage: Warum ist es vielen nicht möglich, Webseiten wie diese, die nicht gerade im geringen Umfang von Usern benutzt werden und bezüglich der Umsetzung einiges gekostet haben werden, den Standards und der Semantik entsprechend auszuzeichnen? Man sollte es wenigstens in Erwägung ziehen sich an den Standards zu orientieren, denn eine besser Arbeit in dieser Hinsicht, kann auch für bessere Suchmaschinenergebnisse sorgen, denn hier sind eine gute Struktur und korrekt ausgezeichnete Überschriften sehr beliebt.