Набор авторов в комманду!!!




Пожертвовать на развитие сайта. Пожертвовать

Элемент section в html 5

Главная » Справочники » Справочник HTML5 » Элемент section в html 5
Элемент section опеределяет общую часть документа.
script

Поддержка браузерами элемента section в HTML5

Элемент section в браузере Internet Explorer не поддерживается
Элемент section в браузере Firefox 3.7 поддерживается в ночных сборках
Элемент section в браузере Chrome 5.0 поддерживается
Элемент section в браузере Safari 5.0 поддерживается
Элемент section в браузере Opera не поддерживается

Описание элемента section в HTML5

элемент section (секция, раздел) в HTML5 представляет собой элемент общей части документа или приложения. Такой, как главы, заголовки, колонтитулы, или любые другие секции этого документа. Под секцией понимается, тематическая группировка содержимого, как правило, с заголовком.

Примеры секций - главы, различные вкладки в диалоговом окне, несколько разделов диссертации. Главная страница веб-узла может быть разбита на секции для введения, новостных статей, контактной информации.

В следующем примере, вы видите статью/article (часть большой интернет страницы) про Тыблыки, содержащий три коротких секции/sections.


	

		
Тыблыки

		
Вкуснятинка

	

	
Предисловие от Сочинителя.

	

		
Красный тыблык

		
Легенда о красном Тыблыке.

	

	

		
Бабушка и Яблочный Дракон

		
Сказка о том как Яблочный Дракон
		учился готовить драники.

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

Отличие элемента section HTML4.1 от HTML5

элемент section добавлен в HTML 5.

Атрибуты элемента section в HTML5

Индивидуальные атрибуты для элемента section не определены

Зачем нужен элемент section в HTML5

При правильном использовании даёт возможность структурировать документ и вносить стилизацию на уровне css.

Не решенные вопросы про элемент section в HTML5

Что, где и при каких условиях элемент section упрощает разработку и вёрстку?

Какие плюсы даёт использвание элемента section (SEO, навигация)?

Какие элемент предпочтительнее: элемент section или элемент article?

Какой из следующих вариантов использования элемента section предпочтительнее?

Вариант 1: 
<article>
	<section>
		<h1>Часть первая</h1>
		<p>
			В которой Медвед встречается с Незнайкой.
		</p>
	</section>
	<section>
		<h2>Глава первая</h2>
		<p>
			В которой Медвед поймал мальчика
			и решил подарить ему позитив.
		</p>
	</section>
	<section>
		<h2>Глава вторая</h2>
		<p>
			В которой Медвед сделал правильные выводы, 
			после которых Незнайка долго икал от смеха.
		</p>
	</section>
</article>
Вариант 2: 
<article>
	<section>
		<h1>Часть первая</h1>
		<p>
			В которой Медвед встречается с Незнайкой.
		</p>
		<section>
			<h2>Глава первая</h2>
			<p>
				В которой Медвед поймал мальчика 
				и решил подарить ему позитив.
			</p>
		</section>
		<section>
			<h2>Глава вторая</h2>
			<p>
				В которой Медвед сделал правильные выводы,
				после которых Незнайка долго икал от смеха.
			</p>
		</section>
	</section>
</article>

Какой из следующих вариантов использования заголовков h1,h2,h3,h4,h5,h6 с элементом section предпочтительнее?

Вариант 1: 
<article>
	<section>
		<h1>Часть первая</h1>
		<p>
			В которой Медвед встречается с Незнайкой.
		</p>
		<section>
			<h2>Глава первая</h2>
			<p>
				В которой Медвед поймал мальчика 
				и решил подарить ему позитив.
			</p>
		</section>
		<section>
			<h2>Глава вторая</h2>
			<p>
				В которой Медвед сделал правильные выводы,
				после которых Незнайка долго икал от смеха.
			</p>
		</section>
	</section>
</article>
Вариант 2: 
<article>
	<section>
		<h1>Часть первая</h1>
		<p>
			В которой Медвед встречается с Незнайкой.
		</p>
		<section>
			<h1>Глава первая</h2>
			<p>
				В которой Медвед поймал мальчика 
				и решил подарить ему позитив.
			</p>
		</section>
		<section>
			<h1>Глава вторая</h2>
			<p>
				В которой Медвед сделал правильные выводы,
				после которых Незнайка долго икал от смеха.
			</p>
		</section>
	</section>
</article>

Идеи использования элемента section в HTML5

1. Автоматическое создание оглавления и указателей в начале страницы с помощью javaScript.

2. Переход по ссылкам. Ведь в пару section - h1 можно занести анкор/anhor с помощью javaScript

script