Какова наиболее семантически правильная структура страницы блога с использованием тегов HTML5?

9

Я хотел бы обращал внимание на конечную природу <aside>, <section>, <article>.

Какова наилучшая, наиболее семантически правильная структура страницы блога с использованием тегов HTML5?

Должен ли я поставить боковую панель внутри <aside>? Или это скорее относится к <section>(как <aside>следует использовать для рекламы, коротких цитат и тому подобное)?

Как мне представить основную функцию, сообщение в блоге? Как <article>правильно использовать ?

Как я должен разметить теги статьи?

Wabbitseason
источник

Ответы:

7

Вы хотите использовать <article>для сообщений в блоге. У Марка Пилигрима есть действительно хорошее объяснение того, как использовать каждый тег. Он также объясняет, как разметить articleчуть ниже список определений на своем сайте. Это фантастическая книга для изучения HTML 5 и CSS.

«Элемент article представляет собой компонент страницы, который состоит из автономной композиции в документе, странице, приложении или сайте и предназначен для независимого распространения или повторного использования, например, в синдикации».

Asideпредназначен для «тангенциально связанных» элементов, а sectionпредставляет «представляет собой общий документ или раздел приложения».

citadelgrad
источник
2

Ибо <aside>подумайте об этом, как о театральной стороне: история приостановлена, чтобы что-то объяснить аудитории, ненадолго отклоняясь от касательной, прежде чем вернуться к основному фокусу. Например:

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

Страшный пример, но действительный. Скорее всего, он будет полезен для таких вещей, как «кавычки» и другие относящиеся к статье касательные, но как чисто семантический тег рекламные объявления обычно не принадлежат.

Рекламная система на основе ключевых слов не заботится о семантической подгонке вашего контента, она больше заинтересована в подборе демографических данных. Если вы <article>говорите только о PHP и извлекаете рекламу, связанную с Python / Perl / Java (в какой-то момент это произойдет), вы <aside>просто потеряли смысл. Вам лучше размещать их в другом месте на странице.

tadamson
источник
+1 за улыбку на лице и ответ на мой собственный вопрос.
Джейсон