¿Es mejor mantener el estilo de su página web dentro de las etiquetas en el encabezado del documento, o usar un href = ” para vincular su documento HTML a un CSS separado?

Razones para usar un bloque

:

• Pequeños bloques de CSS en línea (menos de 14 KB) mejoran el tiempo de procesamiento en comparación con las hojas de estilo externas. Su página web se renderizará notablemente más rápido (si ha eliminado todos los scripts de bloqueo de renderizado).
• Si su CSS está incluido en su HTML, hace que su HTML sea más fácil de distribuir, especialmente en sistemas de archivos sin acceso a Internet.
• A veces no desea que los estilos de página demasiado específicos contaminen su CSS principal. Un bloque


  es un buen lugar para servir estos estilos específicos de la página.

Razones para usar una hoja de estilo a través de :

• Separación limpia del estilo del contenido
• La edición de una hoja de estilo individual le otorga capacidades de edición, como linting CSS, verificación de sintaxis, etc.
• Una vez que el navegador recibe la hoja de estilo, las solicitudes posteriores para ese mismo archivo se pueden almacenar en caché.
• Comparta estilos entre páginas haciendo que todas esas páginas se vinculen a la misma hoja de estilos
• Los archivos CSS se pueden convertir rápidamente a archivos SCSS, lo que le otorga potentes funciones de programación funcional.

Conclusión

La elección depende de muchos factores, que incluyen (entre otros):

• Cómo se distribuirá el HTML
• ¿Cuántos otros archivos HTML necesitan el mismo CSS?
• Si su HTML está configurado para ser almacenado en caché
• Si su CSS está configurado para ser almacenado en caché
• Si el tamaño total del archivo combinado y el del archivo HTML y CSS es inferior a 14 KB.

Dicho todo esto, para la mayoría de los sitios web, generalmente es una mejor estrategia tener tu CSS separado de tu HTML.

Mantenimiento. Puede optimizar la velocidad por un lado (Google) o lidiar con la intensa ventana de copiar / pegar lado a lado mientras actualiza 80 páginas para un cambio en el relleno en una barra lateral / bloqueo de dolor de cabeza más adelante. A menos que la súper velocidad después del desarrollo completo sea una necesidad definitiva, digo que use hojas de estilo separadas, combine según sea necesario (en otras palabras, no se preocupe por eso al desarrollar), minimice y ahórrese. CSS puede volverse monótono extremadamente rápido. Una hoja de estilo separada aliviará muchos de los dolores de cabeza de estilo global de cambio pequeño aquí-pequeño-cambio-allá y cuando encuentre sus definiciones concretas sólidas de “esto no cambiará es perfecto”, póngalas en una hoja, llámela “main”, “final”, qué tienes, y minify-> guarda eso, y construye desde allí. CSS puede ser masivo y muy rápido, especialmente cuando se toman en cuenta acciones receptivas (@media aquí, @media allá, etc.). Si desea usar etiquetas de estilo, hágalo, pero cualquier cosa que encuentre copiando / pegando por página, córtela y vuélvala a una hoja de estilo y disfrute de sus recompensas. Te lo agradecerás más tarde. 🙂

Hojas de estilo externas cuando lo estás creando. Para la mayoría de los usos, no existe una desventaja real y solo una ventaja para crear los archivos externamente. Puede vincular varias páginas al mismo CSS para obtener código reutilizable, y puede vincular varios archivos CSS a una sola página para organizar el código. Depende de usted, pero nunca encontré ninguna razón por la que no debería comenzar inicialmente con archivos externos.

Los estilos integrados para mí vienen a jugar en ediciones. Si quiero asegurarme de que solo afecta a una página en particular, la agregaré a una etiqueta de estilo. Eso tendrá prioridad sobre los archivos CSS externos, y un paso más en el CSS en línea tiene prioridad sobre los estilos incrustados, aunque los considero más como un último recurso y rara vez uso estilos en línea.

Cuanto menos pueda fragmentar su código, más útil creo que es mantenerlo. Si tiene propiedades externas incrustadas e integradas, todas aplicadas al mismo elemento, puede llevar más tiempo descubrir qué está sucediendo o ajustar fácilmente lo que necesita para llegar.

Estoy de acuerdo con el hecho de que todo lo que está arriba del pliegue debe estar en la etiqueta

Mejor,
Norbert Torok - norbertorok.com

Se prefiere mantener el estilo en el archivo css. También le permite reutilizar lo mismo en diferentes archivos HTML.

En producción, puede minimizar el archivo css, y esto ayuda a reducir el tiempo de carga de la página.

Depende de si desea tener el archivo tan independiente como si lo va a enviar por correo electrónico o si lo va a poner en Internet, donde puede tener tantos archivos como desee.
Personalmente, sugeriría si va a tener muchas páginas con el mismo estilo, luego guárdelo como CSS independiente para evitar escribirlo todo el tiempo.

CSS para el contenido que aparece sobre el pliegue, debe estar en una etiqueta