В HTML5 могут появляться tags и вне тега ?

В настоящее время я использую вышеуказанные tags (classический порядок тегов):

 ...  
...
...
...

Использование тегов и спецификации были очень жесткими в предыдущих версиях HTML (4.x), в то время как HTML5 действительно не нуждается в тегах и даже .

Поэтому я бы использовал следующую структуру, которая ИМХО гораздо более семантическая, чем предыдущая.

  
...
...
...
...
...

Как вы думаете?

Ну, не имеет никакого отношения к тегу

. В head все метаданные и прочее, поскольку header – это просто компонент макета.
И макет приходит в body . Поэтому я не согласен с вами.

Давайте дадим канонический ответ. Я буду ссылаться на спецификацию HTML5 .

Прежде всего, 12.1.2.4 Дополнительные tags :

Начальный тег элемента заголовка может быть опущен, если элемент пуст, или если первым элементом внутри элемента head является элемент.

Конечный тег элемента заголовка может быть опущен, если за элементом заголовка не следует сразу пробельный символ или комментарий .

Начальный тег элемента body может быть опущен, если элемент пуст или если первая вещь внутри элемента body не является символом пробела или комментарием , за исключением того, что первое, что внутри элемента body является элементом script или style .

Конечный тег элемента body может быть опущен, если за элементом body сразу не следует комментарий .

Затем, 4.1.1 Элемент html :

Модель контента: элемент head за которым следует элемент body .

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

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


Теперь давайте рассмотрим ваш второй fragment:

  
...
...
...
...
...

Здесь элемент

не подходит для (это streamовое содержимое ), будет помещен непосредственно перед ним. Другими словами, документ будет пониматься браузером следующим образом:

    
...
...
...
...
...

И это, конечно, не то, что вы ожидали. И в качестве примечания это также недействительно; см. 4.4.1 Элемент body :

Контексты, в которых этот элемент можно использовать: как второй элемент в элементе html .

[…]

В соответствующих документах имеется только один элемент body .


Таким образом,

или

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


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

Цитирование 4.4.1 Элемент body еще раз:

Элемент body представляет основное содержание документа.

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

Я вижу, что вы пытаетесь сделать, вы пытаетесь использовать в качестве контейнера для основного содержимого страницы. Вместо этого используйте

, как указано в спецификации HTML5. Я использую этот макет:

  < !DOCTYPE html>   *Metadata*   
*

and other important stuff

*
*All my content*
*Copyright, links, social media etc*

Я не уверен на 100%, но я думаю, что что-либо вне считается метаданным и не будет отображаться браузером. Я не думаю, что DOM может получить к нему доступ.

В заключение используйте

для вашего контента и сохраните форматирование своего HTML-кода правильно, как в первом fragmentе кода. Вы использовали

но я думаю, что при некоторых попытках применения CSS возникают некоторые странные проблемы с форматированием.

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

. Со всеми последними достижениями элемент не является семантическим, как когда-то, но вам просто нужно думать об этом как обертке, в которой видит порт представления.

     

Согласно стандарту HTML , модель содержимого элемента HTML:

Элемент головки, за которым следует элемент тела.

Вы можете определить элемент BODY в исходном коде:

   ... web-page ...   

или вы можете опустить элемент BODY:

  ... web-page ...  

Однако недопустимо размещать элемент BODY внутри содержимого веб-страницы (между другими элементами или текстовым контентом), например:

  ... content ...  ... content ...  ... content ...  

Я согласен с некоторыми из ответов других. Теги и

имеют две уникальные и очень несвязанные функции. Тег

, если я не ошибаюсь, был представлен в HTML5 и был создан для повышения доступности, а именно для чтения с экрана. Он обычно используется для указания заголовка вашего документа и, чтобы работать надлежащим образом и эффективно, должен быть помещен в . Тег , поскольку он является источником, используется для SEO в том, что он создает все необходимые метаданные и тому подобное. Правильная структура HTML для вашей страницы с включенными двумя тегами будет выглядеть примерно так:

 < !DOCTYPE html/>      

Это общая структура html-документа.

   Title, meta-data, scripts, etc go here... Don't confuse with header   You body stuff comes here... 
Your footer stuff goes here...

Несмотря на то, что tags и не требуются, элементы все еще существуют – это просто, что браузер может решить, где tags были бы из остальной части документа.

Другие элементы, которые вы используете, все еще должны находиться внутри