Как пользоваться тегом <main>

[PavelTkachev]

Хочу применять в сёрстке тег <main> и не могу понять как его применять правильно. Из описания я понял, что это тег для основного и уникального контента для данной страницы. Но как тогда его использовать с тегом <article>, ведь в нём данные контент должен также находиться?

 

Что-то на подобии:

<main>

<article>

<h1></h1>

<time></time>

</article>

</main>

 

Так?

 

И должен ли тег <h1> быть внутри <article>?

[lexxcode]

ну тут уже дело вкуса и реализации, я обычно делаю обертку по умолчанию, чтобы меньше трогать body

Я наоборот стал реже использовать обертку, т.к. это позволяет более гибко конфигурировать  скелет страницы

[PavelTkachev]

Есть и другое мнение что излишнее использование новых тегов это тоже не совсем хорошо.

 

Переучиваться-то надо. На дворе уже который год HTML5, а я только пол года, как стал его применять.

 

В общем

 

<header></header>

<nav></nav>

<main>

<article>

<h1></h1>

<time></time>

</article>

<aside></aside>

<menu></menu>

</main>

<footer></footer>

 

Лучший и не противоречивый вариант?

[Sergik+]

 

Есть и другое мнение что излишнее использование новых тегов это тоже не совсем хорошо.

 

Переучиваться-то надо. На дворе уже который год HTML5, а я только пол года, как стал его применять.

 

В общем

 

<header></header>

<nav></nav>

<main>

<article>

<h1></h1>

<time></time>

</article>

<aside></aside>

<menu></menu>

</main>

<footer></footer>

 

Лучший и не противоречивый вариант?

 

В принципе нормально.

[Switch74]

 

ну тут уже дело вкуса и реализации, я обычно делаю обертку по умолчанию, чтобы меньше трогать body

Я наоборот стал реже использовать обертку, т.к. это позволяет более гибко конфигурировать  скелет страницы

 

Гибче, не спорю, но если например нужно ограничить размеры по ширине не проще ли задать их обертке, чем задавать header, footer и content. А таких блоков может быть больше, а еще могут быть и media. 

[PavelTkachev]

Гибче, не спорю, но если например нужно ограничить размеры по ширине не проще ли задать их обертке, чем задавать header, footer и content. А таких блоков может быть больше, а еще могут быть и media.

 

Проще. Но DOM элементов больше и для скриптов сложнее пробегать дерево. А CSS кешируется и ничего, что больше строк.

[lexxcode]

Гибче, не спорю, но если например нужно ограничить размеры по ширине не проще ли задать их обертке, чем задавать header, footer и content. А таких блоков может быть больше, а еще могут быть и media. 

Зависит от конкретной ситуации. и media как раз может быть еще и дополнительной причиной для отказа) Вообще, конечно если хедер, мейн и футер всегда одной ширины, то конечно проще сделать обертку. но если у тебя хедер и футер тянутся на всю ширину, а мейн ограничен, то обертка мешает. А если в разных ситуациях поведение разное, то тоже обертка будет мешать. Следовательно уже видно что процент ситуаций когда обертка мешает выше. 

 

 

 

Гибче, не спорю, но если например нужно ограничить размеры по ширине не проще ли задать их обертке, чем задавать header, footer и content. А таких блоков может быть больше, а еще могут быть и media.

 

Проще. Но DOM элементов больше и для скриптов сложнее пробегать дерево. А CSS кешируется и ничего, что больше строк.

 

один элемент не затормозит ощутимо работу страницы

[PavelTkachev]

Скажите, а элемент <time> должен быть тольчо внутри <article>, или же он показывает время для контента внутри своего родителя?

[lexxcode]

time просто определяет даты, ограничений где его использовать нету