HTML 5 является развитием предыдущих версий языка HTML, в частности наиболее часто используемой сейчас HTML 4.01.

Давайте сравним структуру страницы HTML 4.01 и HTML 5.

Код HTML 4.01:

	
	
     

	
		

			
Главная страница
		
		

		

		

		
	

Код HTML 5:

	
	
	


	

		
Главная страница
	
	

	
	
	

Элементы HTML5 имеют простую структуру и семантику, используют новые теги, такие как верхняя и нижняя часть страницы (хедер, футер) и другие элементы.

Рассмотрим какие элементы (теги) HTML5 наиболее часто используются.

<header>

Он задает «шапку» сайта или раздела, в которой обычно располагается заголовок.

Может внутри содержать другие теги: <hgroup>, <h1> … <h6>, <nav>, metadata.

Пример кода:

   
  
Создай сайт для бизнеса
  
Узнайте как создать сайт для бизнеса в Интернет 
  
Сергей, 20 Сентября 2013

<hgroup>

Используется для группирования заголовков веб-страницы или раздела. Внутри располагаются теги заголовков от <h1> до <h6>.

Данный тег исключён из версии HTML от W3C, но остался в версии WHATWG, будущее элемента пока не определено.

Пример кода:

	

		
Создай сайт для бизнеса
		
Узнайте как создать сайт для бизнеса в Интернет
	
	
20 Сентября 2013 написано Угольников Сергей

<nav>

Он задает навигацию по сайту. Если на странице несколько блоков ссылок, то в <nav> обычно помещают приоритетные ссылки. Также допустимо использовать несколько тегов <nav> в документе. Запрещается вкладывать <nav> внутрь <address>.

Пример кода:

<section>

Задаёт раздел документа, может применяться для блока новостей, контактной информации, глав текста, вкладок в диалоговом окне и др. Раздел обычно содержит заголовок. Допускается вкладывать один тег <section> внутрь другого.

Пример кода:

   
Регистрируем домен в зонах RU и РФ за 99 рублей
   
Первое, что необходимо сделать для размещения Вашего сайта в сети Интернет, зарегистрировать имя для него — домен. По нему на Ваш сайт будут заходить посетители. 
  

<article>

Тег задает содержание сайта вроде новости, статьи, записи блога, форума или др.

Пример кода:

	
Чем отличается блог от сайта?
	

		
Автор: Грегг Холл
		
		
Всем и каждому уже давно очевидно, что блоги становятся в последнее время все более и более популярными. Отрицать этот факт бессмысленно, и любой здравомыслящий «сетянин» со мной согласится. Но рост популярности и распространенности блогов породил комплекс своих собственных вопросов и проблем, которыми отныне терзаются практически все новички блоггинга. 
		
И один из этих вопросов аналогичен заголовку нашей сегодняшней статьи. 
	
	

		.. другая запись ..
	
	

		.. другая запись ..
	
	

		.. другая запись ..
	

<footer>

Тег <footer> задаёт «подвал» сайта или раздела, в нём может располагается имя автора, дата документа, контактная и правовая информация.

Пример кода:

<figure> и <figcaption>

Используется для группирования любых элементов, например, изображений и подписей к ним.

Пример кода:

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

P.S. — Коммерческий сайт своими руками от и до — это просто! Не верите? Щелкайте здесь — перейти