HTML Überschriften auszuzeichnen ist eigentlich sehr einfach, trotzdem machen viele Fehler bei der Anordnung der sechs verschiedenen Überschriftelemente: <h1>, <h2>, <h3>, <h4>, <h5>, <h6>.
Der Unterschied der sechs Tags ist, dass <h1> die erste und wichtigste Überschrift ist, <h2> die Zweitwichtigste, <h3> die Drittwichtigste und so weiter. Oft ist <h1> das Logo der Website, <h2> die Seitenüberschrift und die restlichen sind im Content.
Die Tags werden der in den Browsern der Wichtigkeit entsprechend groß angezeigt und haben einen vordefinierten Abstand nach unten (margin), außerdem erzeugen die <h1-6> Tags einen Zeilenumbruch, weil sie Blockelemente sind. HTML Elemente sind aber nicht für das Design zuständig, daher sollten sie ihnen das richtige Design per CSS verpassen.
1 2 3 4 5 6 | <h1>Überschrift 1</h1> <h2>Überschrift 2</h2> <h3>Überschrift 3</h3> <h4>Überschrift 4</h4> <h5>Überschrift 5</h5> <h6>Überschrift 6</h6> |
Folgendes ist auch möglich:
1 2 3 4 5 6 7 8 9 10 11 12 | <h1>Lorem Ipsum</h1> <h2>Lorem Ipsum</h2> <div> <h3>Lorem Ipsum</h3> <h4>Lorem Ipsum</h4> </div> <div> <h3>Lorem Ipsum</h3> <h4>Lorem Ipsum</h4> <div> <h5>Lorem Ipsum</h5> <h6>Lorem Ipsum</h6> |
