Qual è la struttura più semanticamente corretta di una pagina di blog usando i tag HTML5?


9

Mi piacerebbe Grok la natura ultima della <aside>, <section>, <article>.

Qual è la struttura migliore e semanticamente corretta di una pagina di blog che utilizza i tag HTML5?

Dovrei mettere la barra laterale all'interno di un <aside>? Oppure appartiene piuttosto a un <section>(come <aside>dovrebbe essere usato per pubblicità, brevi citazioni e simili)?

Come devo presentare la funzionalità principale, il post sul blog? Come si usa <article>correttamente?

Come devo contrassegnare i tag dell'articolo?

Risposte:


7

Si desidera utilizzare <article>per i post sul blog. Mark Pilgrim ha un'ottima spiegazione su come usare ogni tag. Spiega anche come contrassegnare articlela lista di definizioni appena sotto il suo sito. Questo è un libro fantastico per l'apprendimento di HTML 5 e CSS.

"L'elemento articolo rappresenta un componente di una pagina che consiste in una composizione autonoma in un documento, una pagina, un'applicazione o un sito e che è destinato a essere distribuito in modo indipendente o riutilizzabile, ad esempio in syndication."

Asideè per elementi "collegati tangenzialmente" e sectionrappresenta "rappresenta un documento generico o una sezione dell'applicazione".


2

Per <aside>, pensare che, come il teatro da parte: la storia viene messa in attesa di spiegare qualcosa al pubblico, virando per la tangente per un breve po 'prima di tornare al focus principale. Per esempio:

<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>

Esempio terribile, ma valido. È probabile che sarà utile per cose come le virgolette e altre tangenti pertinenti agli articoli, ma come tag puramente semantico , le pubblicità in genere non appartengono.

Un sistema di annunci basato su parole chiave non si preoccuperà di adattare semanticamente i tuoi contenuti, è più interessato ad abbinare i dati demografici. Se si <article>tratta solo di PHP e estrae annunci correlati a Python / Perl / Java (lo farà, ad un certo punto), il tuo significato è <aside>appena perso. Farai meglio a metterli altrove sulla pagina.


+1 per avermi fatto sorridere e aver risposto a una mia domanda che avevo.
Jason
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.