Darstellung einer Überschrift

[Gisela]

Hi,

vor einer Auflistung (<ul>) in dem aside-Bereich möchte ich eine Überschrift, die etwas größer ist als die normale Textgröße.

Ich hatte an <h3> gedacht.

Nun habe ich aber gelesen, dass die Reihenfolge soll sein h1, h2, h3. Die ersteren gibt es aber nicht in meinem aside-Bereich.

Was ist die beste Lösung?

[Gunnar Bittersmann]

@@Gisela

Ich hatte an <h3> gedacht.

Nun habe ich aber gelesen, dass die Reihenfolge soll sein h1, h2, h3. Die ersteren gibt es aber nicht in meinem aside-Bereich.

Was ist die beste Lösung?

h1 ist für die Seitenüberschrift, sollte genau einmal auf einer Webseite auftreten.

Dein aside-Bereich gehört nicht zu einem Unterkapitel (dessen Überschrift h2 wäre)? Dann ist h2 für dessen Überschrift richtig.

Die Hierarchie-Ebene hat nichts mit der gewünschten Darstellung (Schriftgröße) zu tun. Andersrum schon: die visuelle Hierarchie sollte meist die logische Hierarchie widerspiegeln.

🖖 Live long and prosper

[Hierarch]

h1 sollte genau einmal auftreten? Dann hätte man es ja gleich title nennen können!

IMO sollten(!) „die hs“ die Ebenen einer Gliederung (ja, so wie man das mal in der Schule gelernt hat) repräsentieren. Und so eine Glierdung könnte IMHO auch in irgend welchen Elementen, losgelöst von der Seitenhierarchie, wieder auftreten. Mit Bezug zur Frage: auch so ein aside hat das Recht auf eine eigene Hierarchie (die da dann aber oft oder meist besser in da auftauchenden Listen repräsentiert – :first-child, :first-of-type, … – oder auch „nur“ als simpler Absatz [<p>]zwischendrin – und nicht als explizite Auszeichnung als Überschrift [h1 … h6] dargestellt werden sollte).

Das Grundkonzept dahinter sollte eben sehr Ähnlich dem sein, wie es mal im Unterricht gelehrt wurde: erst mal die Gliederung. Eine Gliederung, der die Inhalte folgen. Nicht Inhalte, denen dann oft (meist?) ein Chalos als Gliederung aufgezwungen wird.

Was im Übrigen ja nicht dem wiederspricht, was dazu schon geschrieben wurde. Es ist nur „allgemeiner“.

[Gunnar Bittersmann]

@@Hierarch

h1 sollte genau einmal auftreten? […] IMO sollten(!) „die hs“ die Ebenen einer Gliederung […] repräsentieren.

Ja. Und die erste Ebene (h1) ist das Ganze. (der ganze Inhalt der aktuellen Webseite, nicht der ganze Inhalt der Website)

Also eine h1 pro Webseite.

Dann hätte man es [h1] ja gleich title nennen können!

h1 und title haben oft ähnlichen Inhalt. Wobei im title sinnvollerweise auch der Name der Website genannt wird.

Beispiel: https://gunnarbittersmann.de/buchclub/
title: Buchclub – Gunnar Bittersmann
h1: Buchclub

🖖 Live long and prosper

[Rolf B]

Hallo Hierarch,

dein Problem liegt vermutlich darin, dass HTML originär gar nicht (oder: nicht nur) für Webseiten gedacht war, sondern für Dokumente jeder Art. Wenn ich HTML für ein längeres Dokument nutze, sind mehrere h1 durchaus sinnvoll.

Für Webseiten gilt es aber als gute Praxis, nur eine h1 zu verwenden.

Eine Website hat dann wieder viele h1, eine pro Webseite

Rolf

[Gunnar Bittersmann]

@@Rolf B

dein Problem liegt vermutlich darin, dass HTML originär gar nicht (oder: nicht nur) für Webseiten gedacht war, sondern für Dokumente jeder Art.

Und zwar für Hypertext-Dokumente, also mit Verlinkungen von und zu anderen Dokumenten jeder Art. Und jeder Domain, also von und zu anderen Dokumenten im Web.

Lange Rede, kurzer Sinn: HTML war originär für Hypertext-Dokumente im Web gedacht, d.h. für Webseiten.

🖖 Live long and prosper

[Rolf B]

Hallo Gunnar,

ja, und in der Welt von 1989-1992 gab es noch keine Suchmaschinen und Web-Visitenkarten, sondern Forschungsergebnisse, die man austauschen wollte. Das war ein anderes Web als das, was wir heute kennen.

Wenn es von Anfang an und für jegliche Dokumente best practice gewesen wäre, nur ein h1 Element pro HTML Seite Dokument zu haben, dann wäre dieses Element tatsächlich fehlbenannt.

Context is King, wie immer.

Rolf

[Auge]

Hallo

ja, und in der Welt von 1989-1992 gab es noch keine Suchmaschinen und Web-Visitenkarten …

… und ebenso kein HTML. Laut der deutschsprachigen Wikipedia war dessen Erstveröffentlichung 1992, laut der englischsprachigen Wikipedia 1993.

Wenn es von Anfang an und für jegliche Dokumente best practice gewesen wäre, nur ein h1 Element pro HTML Seite Dokument zu haben, dann wäre dieses Element tatsächlich fehlbenannt.

Context is King, wie immer.

Hmm, der Titel bliebe immer noch die erste Überschrift in der Hierarchie. Insofern passt h1 meiner Meinung nach ganz gut. Das hätte zwar durchaus title sein können aber (hierarchisch gesehen) unterhalb des Titels einer Seite die Hierarchie mit h1 zu beginnen, kommt mir auch komisch vor.

Davon ausgehend, dass, zumindest abseits der ursprünglich angesprochenen wissenschaftlichen Klientel, die Websitebastler in den ersten Jahren die Elemente eben doch anhand ihrer Darstellung auswählten, kann zu dieser Zeit von einer Best Practise nicht die Rede sein. Nun entwickelt und verändert sich so eine Best Practise im Laufe der Zeit sowieso. Jetzt lautet sie eben so, wie sie lautet, nämlich dass h1 die Hauptüberschrift eines einzelnen Dokuments enthält.

Tschö, Auge

[Rolf B]

Hallo Auge,

deswegen schrieb ich '89 bis '92, weil ich die gleichen Quellen konsultiert hatte. Die Idee des WWW ist 3 Jahre älter als HTML. Das hatte mich auch erstaunt; ich dachte immer, das WWW wäre eine Wirkung von HTML gewesen und nicht HTML die für das WWW designte Markup-Sprache.

Zumindest ist die Idee von Hypertext älter…

Ich habe über's Wochenende nochmal über das Thema sinniert und bin zu der Folgerung gekommen: eigentlich sind h1-h6 ein Fehldesign. Es ist doch vollkommener Unfug, dass ich als Autor die Überschriftenebene festlegen und die Überschriften nummerieren muss. Die Schachtelungsstruktur von HTML liefert die Überschriftenstufe eigentlich automatisch, und die Nummerierung ergibt sich ganz von selbst. Zumindest dann, wenn es zwischen Dokument und Datei eine 1:1-Beziehung gibt. Wenn ein Dokument auf mehrere Dateien verteilt wird, sieht das anders aus, aber auch hier wäre die Überschriftentiefe und -nummer eher etwas, das sich als Hint in einem Attribut zu verstecken hätte, den der Browser ignorieren kann, wenn ich die einzelnen Kapitel zu einem Gesamtdokument zusammeninkludiere.

Aber dieses Bad ist wohl schon längst inklusive des Kindes in den Brunnen umgefüllt worden; ein <h> Element, das sich automatisch levelt und nummeriert, werden wir wohl nicht bekommen.

Rolf

[Gunnar Bittersmann]

@@Rolf B

Aber dieses Bad ist wohl schon längst inklusive des Kindes in den Brunnen umgefüllt worden; ein <h> Element, das sich automatisch levelt und nummeriert, werden wir wohl nicht bekommen.

Nein, das werden wir nicht.

In XHTML 2 war das vorgehen. Und als Hixie HTML5 entwickelte, dachte er wohl ‚XHTML ist XML ist Scheiße; und außerdem ist es nicht von mir, also muss es Scheiße sein.‘ Oder er dachte: Alte Browser würden ein ihnen unbekanntes h-Element ignorieren, damit wäre für diese keine Überschrift da. Also gab es in HTML5 kein h-Element, das sich seine Hierarchie-Ebene aus dem Outline-Algorithmus selbst bestimmt.

Stattdessen sollte man für alle Überschriften h1 verwenden, was sich seine Hierarchie-Ebene aus dem Outline-Algorithmus selbst bestimmt. Nur dass Browserhersteller keine Anstalten machten, den Outline-Algorithmus zu implementieren.

Siehe Diskussion zwischen mir und molily von 2014.

🖖 Live long and prosper

[Gunnar Bittersmann]

@@Rolf B

Das hatte mich auch erstaunt; ich dachte immer, das WWW wäre eine Wirkung von HTML gewesen und nicht HTML die für das WWW designte Markup-Sprache.

Nö, Timbo^[1] entwickelte HTML, um sein Hypertext-System am CERN zu implementieren. Aber nicht aus dem Nichts:

“HTML wasn’t the first markup language to be used at CERN. Scientists there were already sharing documents written in a flavour of SGML—Standard Generalized Markup Language. Tim Berners‐Lee took this existing vocabulary from CERN SGML and used it as a starting point for his new markup language. Once again, it made sense to build on what people were already familiar with rather than creating something from scratch.”
— Jeremy Keith, Resilient Web Design, Chapter 1: Foundations

Und dann war er überrascht, welche Kreise HTML zog:

“Tim Berners‐Lee assumed that most URLs would point to non‐HTML resources; word‐processing documents, spreadsheets, and all sorts of other computer files. HTML could then be used to create simple index pages that point to these files using links. Because HTML didn’t need to do very much, it had a limited vocabulary. That made it relatively easy to learn. To Tim Berners‐Lee’s surprise, people began to create fully‐fledged documents in HTML. Instead of creating content in other file formats and using HTML to link them up, people began writing content directly in HTML.”

Zumindest ist die Idee von Hypertext älter…

Ein paar Zeilen höher:

“Tim Berners‐Lee did not invent hypertext. That term was coined by Ted Nelson, a visionary computer scientist who was working on his own hypertext system called Xanadu. Both Ted Nelson and Tim Berners‐Lee were influenced by the ideas set out by Vannevar Bush in his seminal 1945 essay, As We May Think. Bush, no doubt, was in turn influenced by the ideas of Belgian informatician Paul Otlet. Each one of these giants in the history of hypertext was standing on the shoulders of the giants that had come before them. Giants all the way down.”

🖖 Live long and prosper

PS: Wer Resilient Web Design noch nicht gelesen hat, sollte dies nachholen. Jeremy Keith schreibt über die Urprünge des Webs, grundlegende Technik, und Grundgedanken wie progressive enhancement.

Und wer nicht gerne liest, kann das auch als Hörbuch genießen. Gelesen vom Autor, nur echt mit den kreischenden Möven von Brighton.

---

1. Wo hab ich den Namen her? Ich glaube, Bruce Lawson nennt ihn so. ↩︎

[Felix Riesterer]

Lieber Gunnar,

nur echt mit den kreischenden Möven von Brighton.

wo findet man das? War vor wenigen Wochen erst in Brighton...

Liebe Grüße

Felix Riesterer

[Gunnar Bittersmann]

@@Felix Riesterer

wo findet man das?

Auf der Startseite unter Audio

Hm, der den Viewport ausfüllende Titel lädt nicht zum Rumterscrollen ein?

🖖 Live long and prosper

[Felix Riesterer]

Lieber Gunnar,

wo findet man das?

Auf der Startseite unter Audio

ähm, da höre ich in der Introduction aber keine Möwen. Schon gar nicht aus Brighton. Schade...

Hm, der den Viewport ausfüllende Titel lädt nicht zum Rumterscrollen ein?

Am PC habe ich dieses Problem nicht.

Liebe Grüße

Felix Riesterer

[Gunnar Bittersmann]

@@Felix Riesterer

ähm, da höre ich in der Introduction aber keine Möwen.

Ach so, du hast es speziell auf die Viecher abgesehen. Die sind ab und zu mal im Hintergrund zu hören.

Jetzt haste (noch) einen Grund, das ganze Buch durchzuhören.

🖖 Live long and prosper

[MudGuard]

Hi,

ja, und in der Welt von 1989-1992 gab es noch keine Suchmaschinen und Web-Visitenkarten …

… und ebenso kein HTML. Laut der deutschsprachigen Wikipedia war dessen Erstveröffentlichung 1992, laut der englischsprachigen Wikipedia 1993.

Hm. Laut RFC 1866 war HTML bereits seit 1990 in Benutzung.

Siehe 2. Absatz im Abstract.

cu,
Andreas a/k/a MudGuard

[Auge]

Hallo

ja, und in der Welt von 1989-1992 gab es noch keine Suchmaschinen und Web-Visitenkarten …

… und ebenso kein HTML. Laut der deutschsprachigen Wikipedia war dessen Erstveröffentlichung 1992, laut der englischsprachigen Wikipedia 1993.

Hm. Laut RFC 1866 war HTML bereits seit 1990 in Benutzung.

Ich halte es durchaus für plausibel, dass die Sprache mindestens innerhalb des CERN schon vor ihrer öffentlichen Freigabe in Benutzung war. Die Jahresangaben, die in der Wikipedia zu finden sind, beziehen sich ja auf die „Veröffentlichung“ (des Standards?).

Siehe 2. Absatz im Abstract.

Du hast auch zuviel Zeit, oder? 😉😆

Tschö, Auge

[MudGuard]

Hi,

Du hast auch zuviel Zeit, oder? 😉😆

Derzeit leider ja.

cu,
Andreas a/k/a MudGuard

[Rolf B]

Hallo MudGuard,

benutzt, ja, aber nicht richtig spezifiziert.

Wann das geschah, darüber unterscheiden sich die deutsche und englische Wikipedia.

EN: TBL veröffentlichte 1991 einen ersten Entwurf mit 18 Tags und die IETF brachte 1993 eine richtige Spec heraus

DE: Timeline „Am 13.03.89 von TBL vorgeschlagen, 03.11.92 Urversion nur für Text, 30.04.93 fett+kursiv+Bilder“

Man könnte ja Tim mal fragen, wie er sich das 1989 gedacht hatte 😉. Wenn man https://info.cern.ch/ als Antwort ansieht, dann denkt er sich das Gleiche: eine Seite, ein h1

Rolf

[Gunnar Bittersmann]

@@Hierarch

h1 sollte genau einmal auftreten? Dann hätte man es ja gleich title nennen können!

Nö.

“[Title] is not normally displayed in the text of a document itself. Contrast titles with headings.”
— HTML Tags – die Urfassung (Vorläufer) der HTML-Spec?

title und h1 haben unterschiedliche Funktionen:

“It is suggested that the first heading be one suitable for a reader who is already browsing in related information, in contrast to the title tag which should identify the node in a wider context.”

🖖 Live long and prosper

[Felix Riesterer]

Liebe(r) Gisela,

Nun habe ich aber gelesen, dass die Reihenfolge soll sein h1, h2, h3.

Reihenfolge? Wo hast Du denn von einer Reihenfolge gelesen? Nicht Reihenfolge sondern Hierarchie:

• h1 - Hauptüberschrift
• h2 - Unter-Überschrift (z.B. Kapitel)
• h3 - Unter-Unterüberschrift (z.B. Abschnitt)
• usw.

Was ist die beste Lösung?

Am besten ist die Lösung, die am meisten Sinn hat. Also Sinn im Sinne von „mit Logik“.

Liebe Grüße

Felix Riesterer

[Gisela]

Hallo Felix,

Reihenfolge? Wo hast Du denn von einer Reihenfolge gelesen? Nicht Reihenfolge sondern Hierarchie:

OK, ich meinte Hierarchie.

• h1 - Hauptüberschrift
• h2 - Unter-Überschrift (z.B. Kapitel)
• h3 - Unter-Unterüberschrift (z.B. Abschnitt)
• usw.

Es gibt aber im Hauptteil bereits eine Hierarchie h1,h2,h3

Es handelt sich bei der Überschrift zu der Auflistung nicht um eine Hierarchiebezeichnung sondern nur einen größeren Text.

Ist hier dann ein p- oder div-tag mit entsprechendem Attribut sinnvoll?

[Rolf B]

Hallo Gisela,

ich würde behaupten, dass hier eine h2 Überschrift angemessen ist, als weiterer Abschnitt neben dem Inhalt.

Mit

aside h2 {
   font-size: 120%;
}

könntest Du eine Schriftgröße anfordern, die 20% als die Schriftgröße des aside-Elements ist.

Rolf