Статьи / Что такое HTML5
HTML – это язык разметки веб-сайтов, который в последующем интерпретируется браузером и пользователю представляется страницу в нужном виде. Благодаря данному языку разметки интернет предстаёт нам в весьма «дружелюбной» форме. Ведь согласитесь, приятнее смотреть на красиво оформленный сайт, чем на код той или иной страницы. Совсем недавно в свет вышел новый стандарт разметки веб-страниц – HTML 5 и подавляющее большинство веб-мастеров принялось его изучать. Выход нового стандарта можно назвать событием не совсем ординарным, т.к. HTML 5 обладает рядом нововведений, которые делают его более мощным и расширяют возможности. Мы постараемся в данной статье, как можно более широко осветить все нововведения, но для начала начнём с основных отличий от HTML 4.
В чём заключаются основные отличия HTML5 от HTML4?
Все мы знаем, что работа над HTML4 была закончена в 1999 году, а работа над новым стандартом началась в 2007 году.
В процессе работы, разработчики следовали принципу соблюдения максимальной обратной совместимости со старыми браузерами, поэтому можно сказать, что в целом никаких революционных изменений не свершилось, но возможности языка значительно расширились.
В новом стандарте появились новые элементы, относимые к тегу div. К примеру, добавились section, nav, article, footer и т.д. К привычному же тегу img добавились audio, video, хотя, потребность в этом была ещё 10 лет назад. К id добавились атрибуты tabindex, repeat. Ушли такие элементы, как font и center.
Стоит также сказать, что браузеры, поддерживающие HTML5, будут отличаться большой гибкостью. Если говорить о старых браузерах, то они будут просто игнорировать HTML5, при этом ничего страшного с веб-страницей не произойдёт.
Если всё просуммировать, то в итоге имеем следующее – ряд инноваций, которые не принесут много потерь.
Структура и разметка HTML5
В старом стандарте вся нагрузка разметки ложилась на тег div, т.е. меню, навигация, разделы и сайдбары делались с помощью дивов. Главное новшество HTML5 в плане разметки — распределение указанных ролей между новыми элементами, что делает структуру более понятной и логичной:
header — заголовок страницы, может содержать заголовки и подзаголовки, не путать с head, поскольку он им не является;
nav — определяет раздел навигации;
section — общий раздел содержания, можно использовать для любого блока текста которому требуется свой заголовок;
article — документ, отдельная запись, контент страницы как таковой;
footer — «подвал», нижняя секция страницы.
Пример структуры в HTML5:
<!DOCTYPE html>
<html>
<head>
<title> Пример структуры в HTML5</title>
</head>
<body>
<header>...</header>
<nav>...</nav>
<section>
<article>
...
</article>
</section>
<aside>...</aside>
<footer>...</footer>
</body>
</html>
Согласитесь, в этом примере гораздо больше структуры, нежели раньше.
Продолжение следует...
Комментарии