Можно ли положить <link> в файл css из тега <head/>, например, на стороне нижнего колонтитула?
Какие плохие и хорошие результаты?
Я спрашиваю об этом, потому что на самом деле у меня есть файл css, который ничего не стилирует, но приносит только некоторые анимации css3 на мой сайт, поэтому я хотел бы поставить его в конец html только для соображений производительности...
спасибо
Таблицы стилей связаны в <head>, чтобы браузер мог стилизовать HTML-код и отображать его по мере его появления. Если вы поместите информацию о стиле в нижней части документа, браузеру придется переустановить и снова отобразить весь документ сверху.
Это, во-первых, занимает больше времени, а во-вторых, выглядит очень уродливо.
Это отличается от включенных сценариев, поскольку скрипты будут блокировать загрузку до тех пор, пока они не будут выполнены, поэтому вы загружаете их как можно позже в процессе.
В соответствии со спецификациями W3 теги <link> должны находиться только в разделе <head>:
Для HTML 4.01: http://www.w3.org/TR/html401/struct/links.html#edef-LINK
Для HTML5: http://www.w3.org/TR/html5/document-metadata.html#the-link-element
Еще в 2013 году, если вы поместите тег link в body документа HTML, он не будет проверять использование validate.w3. org с правилами, основанными на HTML 4.01.
(Вы можете проверить HTML 4.01 по сравнению с проверкой HTML 5.0 на https://validator.nu)
В первом чтении документ спецификации HTML 5.0, по-видимому, подразумевает, что link должен отображаться только в элементе head документа. Однако, если вы проверяете использование валидатора HTML 5.0, документы выглядят нормально, даже если в потоковом содержимом есть link.
Лучшее объяснение этого несоответствия может быть следующим.
Если вы прочитали документацию MDN для записи link (запись в MDN-ссылке), вы видите что если элемент link имеет атрибут itemprop, тогда link может отображаться в потоковом и фразирующем содержании, поэтому в body.
Это может быть причиной того, что валидаторы HTML 5.0 не выдают предупреждение, даже если атрибут itemprop отсутствует.
itemprop является частью спецификации микроданных и является относительно новым (читать о HTML файлах), и это стоит прочитать.
На данный момент можно добавить link в таблицу стилей в body, но неясно, какие преимущества есть.
Это старая дискуссия, но я думаю, что стоит упомянуть здесь, что Google Pagespeed Insights на самом деле сейчас (2017) рекомендует отложить загрузку больших файлов CSS пока ниже складки, чтобы гарантировать, что они не блокируют загрузку html.
Да, все в порядке с спецификациями HTML5, чтобы поместить элемент ссылки внутри элемента body. Если это плохая или хорошая идея, зависит от того, что вы связываете. Если это не важно, чтобы сделать первый вид вашего сайта, я бы счел полезным загрузить его как можно позже.