Структура документа на HTML 5

TIMA · March 17, 2012

Здравствуйте!

Подскажите, правильно ли я использовал новые теги HTML 5? Если нет, поправьте пожалуйста.


<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8">
      <title>Страничка на HTML 5</title>
   </head>
   <body>
      <section>
         <header>
            <h1>Страничка на HTML 5</h1>
            <nav>
               <ul>
                  <li><a href='#'>Пункт меню 1</a></li>
                  <li><a href='#'>Пункт меню 2</a></li>
                  <li><a href='#'>Пункт меню 3</a></li>
               </ul>
            </nav>
         </header>
         <aside>
            <nav>
               <ul>
                  <li><a href='#'>Пункт меню 1</a></li>
                  <li><a href='#'>Пункт меню 2</a></li>
                  <li><a href='#'>Пункт меню 3</a></li>
               </ul>
            </nav>
         </aside>
         <section>
            <article>
               <h2>Статья 1</h2>
               <p>
               Lorem ipsum dolor sit amet, cyrenensi reversus ait est cum suam ad suis.
               </p>
            </article>
            <article>
               <h2>Статья 2</h2>
               <p>
               Lorem ipsum dolor sit amet, agimus nolo accipies Tharsos determinatio debitis torporis quin.
               </p>
            </article>
      </section>
      <footer>
      © Страничка на HTML 5
      </footer>
   </section>
   </body>
</html>

Edited March 17, 2012 by TIMA

Gaspode · March 17, 2012

section и aside на дивы поменяйте и будет ок. Ящитаю.

Radiocity · March 17, 2012

<h1>Страничка на HTML 5</h2>

Тег правильно закройте.

w3c валидатор не ругается =\

Edited March 17, 2012 by Radiocity

TIMA · March 17, 2012

section и aside на дивы поменяйте и будет ок. Ящитаю.

А можно поподробней что с ними не так? Хочу разобраться, чтобы в будущем не делать ошибок.

<h1>Страничка на HTML 5</h2>
Тег правильно закройте.

Поправил.

Edited March 17, 2012 by TIMA

ablay2009 · March 17, 2012

Мне кажется не надо было пихать навигацию в aside, т.к. содержимое этого элемента не должно относится к содержимому сайта или должно, но косвенно, дабы прочесть их "за компанию" (последние твиты, комментарии и т.п. Сайт smashingmagazine своим сайдбаром нам прекрасно это показывает)

Теги section, в идеале, должны иметь заголовок (это необязательно). Они нужны не для оформления, а для выделения логических секций в документе. То есть всякие там врапперы и контейнеры должны быть просто дивами.

Также лучше присваивать классы (или id) таким элементам, потому что их может быть много. Вообще это очень неправильно - использовать новые теги всего однажды (шапка, подвал и т.п.), ведь тег footer, к примеру, может находится внутри тега article и показывать нам дату опубликовки поста.

TIMA · March 17, 2012

Мне кажется не надо было пихать навигацию в aside, т.к. содержимое этого элемента не должно относится к содержимому сайта или должно, но косвенно, дабы прочесть их "за компанию" (последние твиты, комментарии и т.п. Сайт smashingmagazine своим сайдбаром нам прекрасно это показывает)

Aside предназначен для банеров, ссылок на сторонние ресурсы и тому подобное, я правильно понимаю?

Теги section, в идеале, должны иметь заголовок (это необязательно). Они нужны не для оформления, а для выделения логических секций в документе. То есть всякие там врапперы и контейнеры должны быть просто дивами.
Также лучше присваивать классы (или id) таким элементам, потому что их может быть много. Вообще это очень неправильно - использовать новые теги всего однажды (шапка, подвал и т.п.), ведь тег footer, к примеру, может находится внутри тега article и показывать нам дату опубликовки поста.

Про использование многократно футера и хедера я читал.

Будет верным такое использование?


<article>
   <h2>Статья 1</h2>
   <header>Дополнительная информация о посте</header>
   <p>
   Lorem ipsum dolor sit amet, cyrenensi reversus ait est cum suam ad suis.
   </p>
   <footer>Количество комментариев: 5</footer>
</article>

Gaspode · March 17, 2012

Читайте тут, может поможет.

TIMA · March 17, 2012

Читайте тут, может поможет.

В английском не силен.

То что хотел узнать, узнал, спасибо всем кто откликнулся.

Edited March 17, 2012 by TIMA

Sign In

Структура документа на HTML 5

Question

TIMA

Link to comment

Share on other sites

7 answers to this question

Recommended Posts

Gaspode

Link to comment

Share on other sites

Radiocity

Link to comment

Share on other sites

TIMA

Link to comment

Share on other sites

ablay2009

Link to comment

Share on other sites

TIMA

Link to comment

Share on other sites

Gaspode

Link to comment

Share on other sites

TIMA

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information