html - para - etiquetas css
HTML y CSS: coloque la etiqueta<link> fuera del<head> (4)
¿Está bien colocar el <link> en un archivo css fuera de la etiqueta <head/> , por ejemplo en el lado del pie de página?
¿Cuáles son los malos y buenos resultados de esto?
Pregunto esto, porque en realidad tengo un archivo css que no da ningún estilo, solo trae algunas animaciones css3 a mi sitio web, así que me gustaría ponerlo al final del html solo por razones de rendimiento ...
Gracias
Las hojas de estilo están vinculadas en el <head> para que el navegador pueda darle un estilo al HTML y renderizarlo a medida que avanza. Si coloca la información de estilo en la parte inferior del documento, el navegador tendrá que volver a crear el documento completo desde la parte superior.
Esto en primer lugar, lleva más tiempo, y en segundo lugar, se ve muy feo.
Esto difiere de los scripts incluidos ya que los scripts bloquearán la carga hasta que finalicen, por lo que los cargará lo más tarde posible en el proceso.
Esta es una discusión antigua, pero creo que vale la pena señalar aquí que Google Pagespeed Insights actualmente (2017) recomienda diferir la carga de archivos CSS grandes hasta el doblez para garantizar que no bloqueen la carga de html.
De acuerdo con las especificaciones W3, las etiquetas <link> solo deben ir en la sección <head> :
Referencias
Para HTML 4.01: http://www.w3.org/TR/html401/struct/links.html#edef-LINK
Para HTML5: http://www.w3.org/TR/html5/document-metadata.html#the-link-element
Problemas de validación: actualizado el 27 de octubre de 2017
En 2013, si coloca una etiqueta de link dentro del body del documento HTML, no se validaría con validate.w3.org con reglas basadas en HTML 4.01.
(Puede probar la validación de HTML 4.01 frente a HTML 5.0 en https://validator.nu )
En una primera lectura, el documento de especificación de HTML 5.0 parece implicar que los link deben aparecer solo en el elemento principal del documento. Sin embargo, si valida utilizando un validador de HTML 5.0, entonces los documentos aparecen bien incluso si tiene un link en el contenido de flujo.
La mejor explicación para esta discrepancia puede ser la siguiente.
Si lee la documentación de MDN para la entrada de link (entrada MDN Link) , verá que si el elemento de link tiene un atributo itemprop , entonces el link puede aparecer en flujo y contenido de fraseo, por lo tanto, en el body .
Esta puede ser la razón por la cual los validadores de HTML 5.0 no emiten una advertencia incluso si el atributo itemprop no está presente.
El itemprop es parte de la especificación de microdatos y es relativamente nuevo ( lea sobre Microdatos HTML) y vale la pena leerlo.
Por el momento, uno podría agregar un link a una hoja de estilo dentro del body , pero no está claro cuáles son las ventajas.
Sí , está bien con las especificaciones de HTML5 para poner un elemento de enlace dentro del elemento de cuerpo. Si es una mala o buena idea, depende de cuál sea tu enlace. Si no es crucial realizar la primera vista de su sitio, consideraría una buena idea cargarlo lo más tarde posible.