Was ist die semantisch korrekteste Struktur einer Blog-Seite mit HTML5-Tags?


9

Ich möchte grok die ultimative Natur <aside>, <section>, <article>.

Was ist die beste und semantisch korrekteste Struktur einer Blog-Seite mit HTML5-Tags?

Soll ich die Seitenleiste in eine legen <aside>? Oder gehört dies eher zu einem <section>(wie <aside>es für Werbung, kurze Zitate und dergleichen verwendet werden sollte)?

Wie soll ich das Hauptfeature, den Blog-Beitrag, präsentieren? Wie verwende ich <article>richtig?

Wie soll ich die Artikel-Tags markieren?

Antworten:


7

Sie möchten <article>für Blog-Beiträge verwenden. Mark Pilgrim hat eine wirklich gute Erklärung, wie man jedes Tag benutzt. Er erklärt auch, wie man die articledirekt unter der Liste der Definitionen auf seiner Site markierte Markierung markiert . Dies ist ein fantastisches Buch zum Erlernen von HTML 5 und CSS.

"Das Artikelelement stellt eine Komponente einer Seite dar, die aus einer in sich geschlossenen Komposition in einem Dokument, einer Seite, einer Anwendung oder einer Site besteht und unabhängig voneinander verteilbar oder wiederverwendbar sein soll, z. B. bei der Syndizierung."

Asidesteht für "tangential verwandte" Elemente und steht sectionfür "repräsentiert ein generisches Dokument oder einen Anwendungsabschnitt".


2

Denn <aside>, dass denkt wie die Theater beiseite: die Geschichte wird gehalten , etwas an das Publikum zu erklären, auf einer Tangente für einen kurzen Bit abkommt , bevor mit dem Schwerpunkt zurückkehren. Z.B:

<article>
     <p>A horse walks into a bar.</p>
     <p>The bartender says, "Why the long face?"</p>
     <aside>Not because it was sad, horses just have long faces.</aside>
</article>

Schreckliches Beispiel, aber ein gültiges. Wahrscheinlich ist es nützlich für Dinge wie Pull-Quotes und andere artikelrelevante Tangenten, aber als rein semantisches Tag gehören Anzeigen im Allgemeinen nicht dazu.

Ein schlüsselwortgesteuertes Anzeigensystem kümmert sich nicht um die semantische Anpassung Ihrer Inhalte, sondern ist eher an der Anpassung der demografischen Daten interessiert. Wenn <article>es nur um PHP geht und Anzeigen im Zusammenhang mit Python / Perl / Java geschaltet werden (dies wird irgendwann der Fall sein), haben Sie <aside>gerade ihre Bedeutung verloren. Sie sollten diese besser an anderer Stelle auf der Seite platzieren.


+1 für ein Lächeln auf meinem Gesicht und die Beantwortung einer eigenen Frage, die ich hatte.
Jason
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.