Die Erstellung von Internet-Seiten ist mit all den technischen Hilfsmitteln mittlerweile kinderleicht. Die Browser arbeiten auch sehr tolerant, verzeihen so manchen Fehler. Warum soll ich dann noch auf korrektes, semantisches html achten?

Was ist semantisches html?

html ist eine sogenannte Auszeichnungssprache und dient der Strukturierung von Internetseiten. Für die Enwicklung des html-Standards ist das W3 Konsortium zuständig. Es gibt eine große Auswahl an html Elementen, jedes erfüllt seinen eigenen Zweck. Allerdings kann man auch viele davon zweckentfremden. Man kann zum Beispiel einen Absatz mit Hilfe von css wie eine Überschrift aussehen lassen und eine Überschrift wie einen Absatz. Semantisches html will sich allerdings an die Standards halten, also die html-Elemente gemäß ihrer Bestimmung verwenden.

Was bringt semantisches html?

Es wird einfacher, sowohl für den Verfasser der Internetseite als auch für den Betrachter. Es geht ja um Kommunikation. Der Verfasser hat etwas zu sagen und möchte, dass es beim Empfänger, den Betrachter, auch ankommt, die Botschaften also verstanden werden. Nehmen wir als Beispiel einen wissenschaftlichen oder allgemein informativen Text. Man kann Texte sinnvoll strukturieren. Für mich als Verfasser wird es mit strukturiertem html einfacher, ihn einigermaßen vollständig aufzusetzen, sodass ich mit gutem Gefühl den Text veröffentlichen kann. Der Leser bekommt durch die Struktur einen Leitfaden und wird die Inhalte des (hoffentlich) wertigen Textes besser aufnehmen und verstehen können.

Quelltext-Beispiel

Sich daraus ergebende Ansicht

Mein Thema der Internetseite

Ein einleitender Absatz als Bezug aufs Thema

Unterthema 1

Absatz mit Bezug auf Unterthema 1

Unterthema 2

Absatz mit Bezug auf Unterthema 2

Diversifizierung 1 des Unterthemas 2

Absatz mit Bezug auf Diversifizierung 1

Diversifizierung 2 des Unterthemas 2

Absatz mit Bezug auf Diversifizierung 1

Unterthema 3

Absatz mit Bezug auf Unterthema 3

Erläuterung

Diese sehr einfache Struktur beschreibt bereits eine gute Grundstruktur. Um die jeweiligen Elemente kann man zwar noch vielerlei strukturierende und sortierende Elemente wie div Container, span Elemente etc. einsetzen. Sparsamkeit bei den zusätzlichen Elementen ist aber angebracht. Die Hierarchie ist sehr leicht durchschaubar,denn die einzelnen Elemente sind auch im Browser gut identifizierbar, da die Elemente vom Browser ebenfalls hierarchisch interpretiert werden. Das Überschriften-Element H1 wird standardmäßig größer, prominenter dargestellt als H2, usw.

Indirekte Wirkungen

Wenn Menschen Texte gut aufnehmen können, dann wird es wohl Maschinen auch leichter fallen. Google wird sich auch leichter tun, die Texte besser einschätzen zu können. Wer sich bei seinem Text mehr Mühe gibt, auch intern, in der Struktur, der wird bessere Texte verfassen. Und hier beginnt die indirekte Wirkung, denn bessere, hochwertigere Inhalte werden bei Google honoriert, besser platziert und erfahren somit eine größere Reichweite. Bei der Suchmachinenoptimierung sind die guten Inhalte bekanntlichermaßen das wichtigste Kriterium für beste Platzirungen in den Suchmaschinen

Semantisch ordentlich aufgesetztes html bietet entscheidende Vorteile, es lohnt sich der Aufwand.