Cascading Style Sheets – kurz CSS (siehe: Stylesheets (CSS) bei SelfHTML) – ist sehr faszinierend. Mit Hilfe von Klassen <tag class=“klasse“> und IDs <tag id=“id“> kann man die Seite schön formatieren. In der CSS-Datei werden dann mit .klasse bzw. #id die Formatierung zugewiesen.
Man kann daher eigentlich eine Seite fast vollständig mit <div>s aufbauen. Beispiel: <div class=“wichtige-ueberschrift“>. Ist aber nicht sinnvoll!
Für eine Überschrift sollte man ruhig die guten alten HTML-Tags verwendet werden. Wenn man sich die Seite ohne CSS anschaut, dann ist <div class=“wichtige-ueberschrift“>ganz doll wichtig</div> ein ganz normaler (unbedeutender) Text. Ein <h1≶ wird ohne CSS jedoch trotzdem als wichtig angezeigt/markiert. Dies gilt auch für Blinde.
„Wen interessieren den Blinde?“ / „Barrierefreiheit – so ein quatsch, braucht man nicht!“ höre ich immer wieder. Aber einer der wichtigsten Besucher ist blind! Die Spider wie z.B. der Googlebot. Und da macht es einen großen Unterschied, ob ein Text mit <h1> ausgezeichnet wurde – oder halt eben nur als normaler Text mit einer Klasse…
Daher kann ich nur jeden empfehlen, die Inhalte erstmal sinnvoll mit HTML-Tags auszuzeichnen. <h1> sollte pro Seite natürlich nur einmal verwendet werden!
Auch ist es sinnvoll die Navigation mit <ul> bzw. <ol> und <li> aufzubauen. Über CSS kann man das Design sehr gut anpassen!
Statt <b> empfehle ich die Verwendung von <strong>. Der Tag <b> sagt aus, dass der Text fett gedruckt werden soll. <strong> hingegen sagt aus, dass dieser Text wichtig ist und fett gedruckt werden soll. Siehe dazu auch SelfHTML: Logische Auszeichnungen im Text.
<b> gehört zu den physischen Auszeichnungen und haben daher nur Einfluss auf die Darstellung. Auf die physischen Auszeichnungen versuche ich zu verzichten – stattdessen lieber die logischen Auszeichnungen und CSS verwenden.