Semantisches HTML in Foren

[Jensemann]

Hallo zusammen,

frage an die Leute die wissen was Semantik ist, ein paar haben wir ja davon

In meinen Augen ist der Forenindex und auch die Viewforum eine klassische Tabelle. Nun sehe ich, das proSilver das als Definitions-Liste notiert. Was ist in euren Augen richtiger? Mir kommt das teilweise so vor, als wurde krampfhaft versucht auf Tabellen zu verzichten. Dabei wird dort durch die Überschriftenköpfe sogar noch eine Tabelle simuliert ...

[brustverein]

Ich denke die Forenübersicht ist OK als Tabelle. Sie beschreibt ja klar und tabellarisch den Inhalt.
Für den Rest des Layout sollte man wohl auf Tabellen verzichten. Das ist dann ja wirklich nur Layout.

Jan

[easygo]

frage an die Leute die wissen was Semantik ist, ein paar haben wir ja davon

Und du weißt es?

Ich mein, solange in proSilver "nichtsemantische" Tags wie div,span und br ohne Ende vorkommen,
könnte man höchstens über Barrierefreiheit und den Sinn oder Unsinn von Tabellen reden..

aber nicht über Semantik :/ easy

[BB-BF-BM]

kommt darauf an:

Da in der Standard-phpBB-Forenübersicht auch andere Daten wie Themen, Beiträge und letzte Beiträge für jedes Forum aufgelistet sind, lohnt sich eine Tabelle.

Das Problem ist jedoch bei beiden: wenn man nicht weiß, dass die Spalte mit "Topics" oder "Posts" betitelt ist, hat man nichts von den Angaben. Sinnvoller wäre meines Erachtens eine Definitionsliste nach dem Schema:

Code: Alles auswählen

<dl>
    <dt><a href="link/zum/forum1">Forum 1</a></dt>
    <dd>Beschreibung des ersten Forums</dd>
    <dd>xyz Topics</dd>
    <dd>abc Posts</dd>
    <dd>Letzter Beitrag von irgendwem an irgendeinem Tag</dd>

    <dt><a href="link/zum/forum2">Forum 2</a></dt>
    <dd>
      Beschreibung des zweiten Forums, 
      kann auch etwas länger sein
    </dd>
    <dd>uvw Topics</dd>
    <dd>ijk Posts</dd>
    <dd>Letzter Beitrag von irgendeinem anderen an irgendeinem anderen Tag</dd>
</dl>

Hab mir erst gerade eben den Quellcode des neuen Styles angeschaut: das von mir genannte Problem ist durch

Code: Alles auswählen

<dd class="posts">122049 <dfn>Posts</dfn></dd>

behoben...


@easygo: Definitionslisten besitzen eine Semantik!

[larsneo]

/me verweist dezent auf das markup von http://www.einfach-fuer-alle.de/forum/

beim thema semantik und standard-konformität hätte ich mir von proSilver übrigens auch deutlich mehr gewünscht - auf der WAIDE-liste würde man wahrscheinlich sagen: das layout hat sich eine schwere div-itis in verbindung mit inline-css zugezogen

[easygo]

@easygo: Definitionslisten besitzen eine Semantik!

Wer behauptet das Gegenteil?

Definitionslisten <dl> brauchen kein div und kein span und kein br. easy

[Jensemann]

Ich mein, solange in proSilver "nichtsemantische" Tags wie div,span und br ohne Ende vorkommen,
könnte man höchstens über Barrierefreiheit und den Sinn oder Unsinn von Tabellen reden..

aber nicht über Semantik :/ easy

Nun ja, ich meine natürlich nur soweit wie es mit HTML z.Z. möglich ist. Und das ist eine Mischung aus semantisch korrekt notiertem Inhalt und Bedeutungslosen Elementen die nur zum Zwecke des Layouts eingesetzt werden. Zumindest stören div-Container die Semantik nicht, wie es bei Tabellen Layouts der Fall wäre.

@Larsneo

Danke, sowas habe ich mir gewünscht.

[S2B]

Ich würde das ganze auch mit Tabellen aufbauen, ungefähr so:

Code: Alles auswählen

<table>
  <caption>Kategorie</caption>
  <thead>
    <tr>
      <th>Forum</th>
      <th>Themen</th>
      <th>Beiträge</th>
      <th>Letzter Beitrag</th>
    </tr>
  </thead>
  <tbody>
    [...]
  </tbody>
</table>

Irgendwie haben die phpBBler Gefallen an Definitionslisten gefunden und setzen sie entsprechend (zu) oft ein, wie z.B. in diesem Fall... Hier ist es schlicht und einfach falsch und raubt den Daten ihren Zusammenhang (Die Spaltentitel haben keine Verbindung zu den Einträgen etc.).

[easygo]

Nun ja, ich meine natürlich nur soweit wie es mit HTML z.Z. möglich ist.

Schon klar so ganz ohne "Sünden" wirds beim Designen schon schwieriger bis unmöglich
und um nochmal auf deinen (und auch meinen ersten) Eindruck zurückzukommen..

Mir kommt das teilweise so vor, als wurde krampfhaft versucht auf Tabellen zu verzichten.

hier mal ein ganz interessanter, weil kontroverser Lesestoff zu diesem
eher weniger neuen Trend: Weg mit den bösen Tabellen -->

Ein Herz für Tabellen

[Jensemann]

Danke nochmal an die informierten Helfer. Ich habe mich jetzt für S2Bs Lösung entschieden, gemischt mit Teilen aus larsneos Link.

Ich verwende eine Tabelle wie S2B sie beschrieb, mit caption für den Kategorie Namen. Diese Tabelle hat 3 Spalten "Forum", "Stats" und "Letzte Antwort". Die Tabellenüberschriften habe ich aus optischen Gründen unsichtbar gemacht. In der Spalte Forum verwende ich die Folder-Grafik, daneben eine Definitionsliste um eine Beziehung zwischen Forum-Name (dt) und Forum-Beschreibung (dd) herzustellen. Die selbe Liste benutze ich auch, sofern vorhanden, für die Moderatoren- und Subforum-Information.

In Stats habe ich 2 Paragraphen eingesetzt. Für Anzahl Postings und Topics. Hier verwende ich nicht nur die Zahl, sondern auch den Bezeichner (Posts oder Topics), was dann jeweils in ein dfn-Element verpackt wird.

Dann die 3. Spalte "Letzter Beitrag" as usual, ein Paragraph mit dem lustigen altbekannten Inhalt wer den letzten Spam verfasst hat

Bei der Folder-Grafik habe ich einige Zeit überlegt ob ich diese als normale Grafik, oder wie in proSilver, als Hintergrund-Element verwenden soll. Habe mich anschliessend jedoch für die normale Grafik entschieden, weil die Grafik eine klare Information ausgibt (gelesen, ungelesen, locked, verschoben, 1000 und ein anderes Märchen) und diese Information nirgends anders auf der Seite ersichtlich ist.

Edit: Das bezieht sich auf die Foren-Übersicht. Bei viewforum werde ich ähnlich verfahren.