Landesamt für Natur, Umwelt und Verbraucherschutz Nordrhein-Westfalen Landesamt für Natur, Umwelt und Verbraucherschutz Nordrhein-Westfalen
Erweiterte Suche

    Überschriften

    Auf dieser Seite informieren wir darüber, wie Sie Überschriften verschiedener Größen auf den Content-Seiten einsetzen können.

    Funktionen richtig verwenden

    Video-Demonstration

    Benennung der gezeigten Content-Module in der Modulübersicht

    • Akkordeon [cont_accordion] --> im Reiter Container
    • Text & Medien [textmedia] --> im Reiter Typischer Seiteninhalt

    Allgemeine Hinweise zur Verwendung von Überschriften

    Überschriften spielen eine entscheidende Rolle auf Websites. Sie dienen nicht nur dazu, die Struktur der Inhalte zu verdeutlichen und die Lesbarkeit zu verbessern, sondern haben auch erhebliche Auswirkungen auf die Suchmaschinenoptimierung (SEO). Durch den gezielten Einsatz von Überschriften kann die Auffindbarkeit einer Website in den Suchmaschinenergebnissen gesteigert werden. Jede Überschriftsebene (H1 bis H6) hat dabei spezifische Funktionen und Prioritäten.

    Die hierarchische Struktur der Überschriften von H1 bis H6 hilft dabei, die Informationen auf einer Webseite klar und logisch zu ordnen. Dabei ist die H1-Überschrift typischerweise der wichtigste Titel, der die Hauptthematik der Seite repräsentiert. Es sollte stets nur eine H1-Überschrift pro Seite geben, um deren Bedeutung hervorzuheben. In der Bedienung der Content-Module haben wir dafür Sorge getragen, dass die Seitenüberschrift nur im Seitentitel ausgegeben werden kann. Sie finden die Möglichkeit, eine Überschrift H1 einzusetzen, deshalb nur in den beiden Content-Modulen Bühne Startseite und Bühne (nicht Startseite). In allen anderen Content-Modulen können Sie nur Überschriften der Größen H2 bis H5 ausgeben.

    Überschriftenschemata

    Die Überschrift auf der Startseite ist abweichend zu den anderen Bereichen der Website in der Größe 50 px angelegt. Diese Abweichung ist dadurch begründet, dass auf der Startseite die Bühne größer ist und thematisch auf die Gesamtseite einstimmen soll. 

    Ansichtsbeispiel H1: Desktop: 50 px, Mobile: 28 px

    Landesamt für Natur, Umwelt und Verbraucherschutz Nordrhein-Westfalen

    Die Seitenüberschriften der Unterseiten sind kleiner als die H1-Überschrift der Startseite. Das hat den Hintergrund, das der Größenabstand zu den weiteren Überschriftengrößen geringer ausfallen sollte, damit sich ein harmonisches Bild auf allen Endgeräten ergibt. Die Überschrift H1 kann auch auf den Unterseiten nur im Modul Bühne (nicht Startseite) ausgegeben werden. Um die Lesbarkeit zu erleichtern, wird die Überschrift H1 auf Mobilgeräten in einer verkleinerten Darstellung von 28 px ausgegeben.

    Ansichtsbeispiel H1: Desktop: 35 px, Mobile: 28 px

    Boden für alle

    H2-Überschriften werden genutzt, um die Hauptabschnitte innerhalb einer Seite zu kennzeichnen, während H3- und nachfolgende Überschriften für Unterabschnitte verwendet werden. Diese Gliederung unterstützt nicht nur die Benutzerführung, sondern auch Suchmaschinen bei der Analyse des Seiteninhalts.

    Wichtig ist, dass die Überschriften in einer logischen Ordnung zueinander stehen sollten. Es ist beispielsweise nicht sinnvoll, nur eine Überschrift H2 und eine Überschrift H3 zu nutzen, da dadurch eine logische Teilung des Contents nicht gegeben wäre. Sollten Sie auf einer Unterseite nur zwei verschiedene Unterüberschriften nutzen, ist es deshalb der bessere Weg, stattdessen zwei Mal die Überschrift H2 zu verwenden, um verschiedene Inhalte gegeneinander abzugrenzen.

    Ansichtsbeispiel H2: Desktop und Mobile: 28 px

    Klimaatlas NRW

    Ansichtsbeispiel H3: Desktop und Mobile: 24 px

    Organische Bodensubstanz und Bodenleben

    H4- und H5-Überschriften sind weniger verbreitet und werden für sehr spezifische Unterpunkte oder detaillierte Gliederungen verwendet. Sie sind besonders nützlich, um lange und komplexe Inhalte übersichtlich zu gestalten. Die Ausführungen oberhalb gelten analog: Überschriften der Ordnung H4 und H5 sollten nicht einzeln stehend verwendet werden, sondern nur dann, wenn mindestens zwei Überschriften dieser Ordnung auf einer Unterseite verwendet werden sollen.

    Die Überschrift der Ordnung H6 ist in allen Content-Modulen deaktiviert. Das hat den Grund, dass in der Abstufungshierarchie diese Überschrift die gleiche Größe hätte wie der Fließtext. Dadurch wäre die H6 als Überschrift nicht gut erkennbar und entfällt deshalb.

    Ansichtsbeispiel H4: Desktop und Mobile: 22 px

    Erosion und Verschlämmung (H4)

    Ansichtsbeispiel H5: Desktop und Mobile: 18 px

    Organische Substanz und Bodenleben (H5)

    Teilen Sie diese Seite auf