Hallo Felix,
Aus boshafter Neugier habe ich den Quelltext auch gleich dem Validator gefüttert... der kam mit ein paar Fehlern und Warnungen.
Die Fehler beziehen sich aber nur auf die <link rel="top">
und <link rel="bookmark">
sowie die doppelten IDs. Letztere sind ein Bug, den habe ich gerade gefixed (da sollten gar keine IDs generiert werden).
Die <link>
-Elemente habe ich auch mal raus genommen, ich glaube nicht, dass die noch irgendwo ernsthaft benutzt wurden.
Wenn ich die nicht geschlossenen <span>-Elemente sehe (class="author" und class="registered-user"), dann ist mir gleich klar, dass das nicht ohne Meckern durchgeht.
Bitte poste mal den kompletten Quelltext, hier bei mir gibt es keine span
-Elemente, die nicht geschlossen wurden.
Was mich aber viel mehr wundert ist die Notwendigkeit aller dieser Klassennamen.
Die sind nicht notwendig, die sind eine Erleichterung für den User, der sich eventuell ein eigenes User-Stylesheet schreiben möchte. Klar käme ich mit deutlich weniger Klassen aus, aber mehr Klassen geben dem User mehr Möglichkeiten der einfachen Selektion.
Und <article class="threadlist thread"> wäre dann vielleicht auch anders selektierbar, ohne dass es hier die Klassen "threadlist" und "thread" bräuchte. Auch wenn das Ganze modular aufgebaut wird, so könnte man doch den Selektor für ".threadlist" um ".score-table td:last-child article" erweitern.
Klar, kann man machen - aber das erhöht einerseits die Komplexität des CSS (das eh schon ziemlich komplex ist) und erfordert andererseits, dass man zusätzliches CSS schreibt - was mit eimen mehr generischen Selektor über die Klassen halt einfach global überall abgedeckt ist. Das ist ja nicht der einzige Punkt, wo ich Nachrichten-Header genriere. Es gibt die augeblendeten Threads, die interessant markierten Nachrichten, die Suchergebnisse, etc, pp. - für diese Fälle müsste man überall eigene Selektoren dann schreiben.
Oder plärre ich gerade von einem Elfenbeinturm herab, ohne CSS-Präprozessoren in Erwägung zu ziehen, die das Markup mehr oder weniger bedingen?
Die haben damit nichts zu tun.
Trotzdem gefällt mir das <div>-Element in <article><header><div /></head></article> nicht, da es nur inline-Elemente enthält und semantisch auch als <p>-Element umgesetzt werden könnte.
Das war ursprünglich ein details
-Element. Das hat aber durch die unterschiedliche Umsetzung im Shadow-DOM starke Probleme im Styling mit sich gebracht, gerade über verschiedene Browser hinweg. Deshalb habe ich das dann durch ein div
ersetzt.
Wieso eigentlich die Verschachtelung von <article> und <header> und <div>?
<article>
leitet den Beitrag ein, in der Einzel- und Nested-Ansicht enthält das auch den Beitrags-Text und so weiter. <header>
enthält die Header-Informationen zu dem Beitrag und <div class="details">
enthält die Detail-Informationen zu dem Beitrag, die mit der Headline nichts mehr zu tun haben.
Damit eine identische Umgebung wie auf einer Forenseite erreicht wird und das ohnehin schon vorhandene CSS greift?
Die Nachrichten-Header werden alle mit der gleichen Funktion gerendert. Deshalb haben sie auch überall immer das gleiche Markup. DRY.
LG,
CK