HTML5 семантика тег статьи для основного контента - PullRequest
Новая
       23

HTML5 семантика тег статьи для основного контента

2 голосов
/ 06 апреля 2011

Семантика: Вы хотите понять их правильно, но иногда они просто сбивают с толку.

Структура документа сайта: 

<body>
    <header>
    <div id="main">
        <header> (not on every page)
        <div id="content">
        <footer> (not on every page)
    <aside>
    <footer>

Является ли семантически правильным заменить div # main с тегом article ?

Ответы [ 3 ]

9 голосов
/ 19 декабря 2012

Чтобы поднять мертвых по этому вопросу, в настоящее время принятый ответ скоро будет неправильным.Был расширенный черновик для элемента <main>, предназначенного именно для того, что вам нужно.Кроме того, он автоматизирует ARIA role="main" в браузере для лучшей доступности.Пожалуйста, смотрите эту ссылку для получения дополнительной информации: https://dvcs.w3.org/hg/html-extensions/raw-file/tip/maincontent/index.html

Данная спецификация является расширением спецификации HTML5 [HTML5].Он определяет элемент, который будет использоваться для идентификации основной области содержимого документа.Весь нормативный контент в спецификации HTML5, если он специально не переопределен этой спецификацией, предназначен для использования в качестве основы для этой спецификации.

Основной элемент формализует общую практику идентификации раздела основного содержимого документа с использованиемзначения id, такие как «content» и «main».Он также определяет элемент HTML, который воплощает семантику и функцию ориентира WAI-ARIA [ARIA] role = main. 

<main>

  <h1>Apples</h1>
 <p>The apple is the pomaceous fruit of the apple tree.</p>

 <article>
 <h2>Red Delicious</h2>
  <p>These bright red apples are the most common found in many
  supermarkets.</p>
  <p>... </p>
  <p>... </p>
  </article>

  <article>
  <h2>Granny Smith</h2>
  <p>These juicy, green apples make a great filling for
  apple pies.</p>
  <p>... </p>
  <p>... </p>
  </article>

</main>
3 голосов
/ 06 апреля 2011

Согласно http://html5doctor.com/the-article-element/, это допустимый семантический способ кодирования. Это называется "стиль блога <article>".

В зависимости от вашей структуры вы также можете заменить #content на статью.

Не забудьте включить http://code.google.com/p/html5shiv/, и, пока вы работаете над ним, если вы обслуживаете свой сайт в течение https , также посмотрите на относительный URL протокола (Google для него), так что вы не необходимо обнаружить переключение между http и https.

0 голосов
/ 06 апреля 2011

Я думаю, что было бы более целесообразно заменить его тегом <section>. Тег <article> предназначен для таких вещей, как посты в блогах, на форумах или в газетных статьях (отсюда и название тега).

В отличие от этого, тег <section> предназначен для более общих частей содержимого в вашем документе и поэтому лучше подходит в этом случае.

Все это гораздо лучше объяснено Марком Пилигримом в DiveIntoHTML5.ep.io

...