main divigation

Main divigation, eine Zusammensetzung aus (Haupt)navigation mit Div, so lautet der Titel des 18. Beitrags auf Manuel Matuzovićs Codesammlung HTMHell, den ich beisteuern durfte. Der Artikel handelt von einer empfehlenswerten HTML-Struktur für die Hauptnavigation. Ausgangspunkt ist schlechter Code.

HTMHell, was ist das für eine Seite?

HTMHell ist eine Sammlung verschiedener äußerst fragwürdiger Codebeispiele, die der Betreiber, der frontend developer, Manuel Matuzović bei seiner Arbeit auf echten Websites entdeckt hat. Das schlechte Beispiel wird als anonymer – es soll ja niemand blamiert werden – Code vorgestellt, dann wird ein alternativer Lösungsvorschlag gezeigt und vor allem begründet. In dieser Erklärung steht einerseits warum der Code schlecht ist und wie man es besser machen kann, andererseits wird aber auch der Vorteil des neuen Codes besprochen.

Der Nutzen dieser Codesammlung besteht nicht nur darin, eine Übersicht über Good und Bad Practices zu gewinnen, man entdeckt bei der Lektüre auch vielleicht den einen oder anderen eigenen eingeschlichenen Fehler. Doch bei dieser Seite mitzumachen, Manuel fordert dazu auf, ist noch lehrreicher als man annimmt, da man auch seine eigenen Annahmen immer wieder hinterfragen muss.

Über Twitter hat Manuel gefragt, wer denn Lust hätte, bei dem neuesten Beispiel mitzumachen. Ich hatte gerade, coronabedingt, etwas mehr Zeit und habe mir den Code angeschaut: Es ist ein Beispiel einer wahrhaft verhunzten Navigation. Mein erster Gedanke war: super, easy Sache, den richtigen Code hinzuschreiben ist in diesem Fall nicht schwer, das ist ja sowieso Standard.

Die Herausforderung Code zu begründen

Wie vorher erwähnt, war es mit dem Codebeispiel einer korrekten Navigation nicht getan. Manuel hat sich im Vorfeld Gedanken dazu gemacht, die alle möglichen Aspekte beinhalten, und die natürlich auch hinterfragt gehören. Darauf folgt Check und Gegencheck: verschiedene Seiten werden zum Nachschlagen benutzt. Auch auf a11y darf man heutzutage natürlich nicht vergessen.  Die Specs der einzelnen Tags werden bei MDN und W3C nochmals nachgelesen, anschließend wird eine Erklärung des Sachverhalts formuliert und nochmals überprüft.

Da niemand ellenlange Beschreibungen lesen will, müssen diese also gekürzt werden. Am Schluss schaut Manuel noch einmal drüber, macht es noch verständlicher – er kann Dinge wirklich auf den Punkt bringen – und stellt es, nach Rückfrage, schließlich online.

So einfach kann man einen Beitrag leisten und gleichzeitig auch noch viel lernen. Ehrlich gesagt, wer hat sich denn das letzte Mal mit den aktuellen Specs auseinandergesetzt und alle Für und Wider abgewogen?

HTMHell ist nicht nur ein ständig wachsendes, leicht verständliches Nachschlagwerk, sondern auch eine gute Schule. Danke hier nochmals, dass ich bei Manuel meinen Gastbeitrag „main divigation“ schreiben durfte.

weitere Artikel zu HTML:
HTML und Textgestaltung, kbd - Das HTML-Element zu keyboard