Anordnung von Kategorien über Überschirften

[cseifert]

Hallo,

wie würdet ihr folgende Anforderung am Besten umsetzen, um es so semantisch wie möglich umzusetzen?

Es soll ein Newslisting werden, das mehrere Newseinträge enthält. Jeder Newseintrag hat eine Überschrift (h2), sowie Bild und Text. Nun zum interessanten Teil: die Kategorie des Eintrags. Die Kategorie soll über der Überschrift erscheinen (Vgl. z.B. https://www.spiegel.de/panorama/leute/). Wie würdet ihr diese auszeichnen? Ein übergeordnetes Tag (hier mindestens h1) kommt nicht in Frage, da sich die Kategorienamen später wiederholen. Ein Absatz ist es auch nicht und div und span sagen nichts aus.

Mein Ansatz wäre nun folgender:

Code: Alles auswählen

<h2>Erste News <em><span class="hide">/ </span>Technik</em></h2>
<p><img .../> Text</p>

<h2>Zweite News <em><span class="hide">/ </span> Technik</em></h2>
<p><img .../> Text</p>

.hide versteckt damit den Slash und bei deaktiviertem CSS ist der Überschriftentitel von der Kategorie getrennt. per CSS würde ich den Kategorienamen dann darüberheben.

Was meint ihr?

Viele Grüße

[Mork vom Ork]

Die Kategorie soll über der Überschrift erscheinen

Dies …

Code: Alles auswählen

<h2>Technik&#58;<br>Fluxkompensator marktreif</h2>

Code: Alles auswählen

h2:first-line {
    font-size:smaller
}

… ergibt:

Technik:
Fluxkompensator marktreif

Ein Schrägstrich hat zwischen Themenbereich und Titel nebenbei bemerkt eher wenig zu suchen, er trennt üblicherweise (lies: außerhalb der IT) Alternativen: „Besucher aus Hamburg / Berlin“ bedeutet nicht, dass Berlin ein Stadtteil von Hamburg wäre.