Введение в веб-разработку с HTML, CSS, JavaScript. Тимур Машнин
Читать онлайн книгу.
же.
Теперь возьмите этот код, скопируйте его и проверьте в валидаторе W3C. Вы увидите, что страница действительна.
Но что произойдет, если вы прямо внутри валидатора добавите еще один тег div прямо внутри тега span с некоторым содержимым. Вы увидите, как валидатор пожалуется, что недопустимый элемент div является дочерним элементом span.
На самом деле спецификация HTML5 группирует традиционные блочные и встроенные элементы в семь типов HTML контента. И вы можете посмотреть это разделение более подробно в разделе видов контента W3C, где перечислены семь типов контента, которые определяет HTML5.
Теперь, давайте рассмотрим следующие HTML элементы, представляющие заголовки документа.
В этом очень простом HTML-документе есть элементы h1, h1, h2, h3 и вплоть до элемента h6, в общем, все доступные элементы заголовков.
И эти элементы указывают то, что содержимое заголовка между открывающим элементом h1 и закрывающим элементом h1 является самым важным заголовком в документе, и так далее.
Таким образом, h6 также будет заголовком документа, но наименее важным из всех.
И обратите внимание, несмотря на то что отображение заголовков в браузере визуально отличает их, заголовки не следует использовать для стилизации документа. Эти элементы предназначены только для передачи структуры вашей HTML-страницы, не более того.
Стилизацию следует делать с помощью CSS, так как структура документа важна для поисковых машин. То, что помечено как h1, очевидно, является наиболее важным и обобщенным описанием содержания этой страницы. Для SEO крайне важно использовать тег h1, и он должен содержать формулировку, которая передает центральную тему остального содержания.
В этом примере вы можете увидеть новый тег header, который содержит такую информацию о документе, как логотип компании, слоган, навигацию.
HTML тег <nav> содержит ссылки, ведущие на другие страницы сайта или на разделы текущей веб-страницы. Эти ссылки позволяют пользователю перемещаться по сайту.
Большинство сайтов имеют горизонтальное или вертикальное меню, располагающееся в верхней части страницы, это и является содержимым элемента <nav>.
В этом примере, у нас есть также элементы section. И внутри каждого тега section у нас есть элементы article.
Элемент section представляет общий раздел документа. И раздел section в этом контексте представляет собой тематическую группу контента, обычно с заголовком.
Элемент article представляет собой полную или автономную композицию в документе. Это может быть сообщение на форуме, статья, запись в блоге, пользовательский комментарий, интерактивный виджет или гаджет или любой другой независимый элемент контента.
Когда элементы article являются вложенными, внутренние элементы article представляют статьи, которые в принципе связаны с содержимым внешней статьи. Например, запись в блоге на сайте может представлять комментарии пользователей как вложенные элементы статьи.
Обычно статья помещается внутри элемента