Новичок
11 уроков
(1 час 28 минут)
Курс
HTML для начинающих
HTML - стандартный язык разметки документов во Всемирной паутине. Курс поможет разобраться в HTML даже тем, кто не имеет ни малейшего представления о нем.

#11 — Семантические особенности HTML5

Сегодня на повестке дня у нас семантика. На видеоуроке мы будем рассматривать новшества, которые принес в жизнь веб-разработчиков HTML5. Вы узнаете, какие новые теги html5 стоит использовать, чтобы улучшить семантичность вашего документа, применяя новые знания на учебном сайте-портфолио из предыдущих уроков.


Семантические теги HTML5

В HTML5 добавлено много новых тегов, но в своей практической работе вы будете применять всего несколько из них.

Тег <DOCTYPE>

Первым рассматриваемым элементом, который претерпел существенные изменения в HTML5, будет тег <DOCTYPE>. В HTML4 он имел крайне неудобную форму записи. С введением новых стандартов запись этого тега стала очень компактной и легкой для запоминания. А если вы используете в своей работе плагин Emmet, то и запоминать ничего не нужно. При определенной комбинации действий заготовка под новый сайт появляется в редакторе кода автоматически.

Теги <header> и <nav>

Для шапки сайта в HTML5 предусмотрен специальный тег <header>.
Еще одним новшеством HTML5 является тег <nav>, он используется как контейнер для основной навигации, меню, расположенного, как правило, в header.

Теги <main> и <aside>

Для основного содержимого сайта в HTML5 введен новый семантический тег <main>. Тег этот должен быть единственным на странице.

Блоки второстепенной (или вспомогательной) информации заключаются в тег <aside>. Это могут быть блоки меню, расположенные в левой части веб-страницы, блоки форм выбора каких-то категорий и т.п.

Теги <section> и <article>

На видеоуроке также будут рассмотрены такие новые семантические теги HTML5, как <section> и <article>.
Тег <section> используется для разделения логических блоков, а тег <article> — для выделения независимых блоков, т.е. новости, статьи, записи в блоге и т.п.

Тег <footer>

И, наконец, для выделения подвала сайта HTML5 ввел такое новшество, как тег <footer>.
Со всеми этими тегами вы познакомитесь на нашем занятии.

Это последний наш видеоурок курса по основам HTML. Вы молодцы! Вы прошли его вместе с нами до конца, заложив тем самым фундамент для строительства своего блестящего будущего в веб-разработке. Теперь можно смело переходить к изучению еще одного нашего видеокурса «Основы CSS»

Приятного всем просмотра! Учитесь с удовольствием!

Материалы к уроку:
Делись:

Оставь комментарий!

4 thoughts on “#11 — Семантические особенности HTML5

  1. Disappear36:

    Большое спасибо, хорошая подача и отличный учитель!

  2. agata:

    Спасибо большое за такой понятный курс)

  3. jake2017:

    Ваш курс настолько доступный, что я его выучил за 5 часов. Спасибо большое

  4. Nrox:

    Спасибо, все круто, всем удачи 😉

Добавить комментарий

Рекомендуемые курсы