CSS (Cascading Style Sheets) se ha convertido en la manera de facto de diseñar y diseñar sitios web. Los diseñadores usan las hojas de estilo para decirle a un navegador cómo se debe mostrar un sitio web en términos de apariencia, cubriendo factores como el color, el espaciado, las fuentes y mucho más.
Los estilos CSS se pueden implementar de dos maneras:
- En línea: dentro de la codificación de la página web, de forma individual, elemento por elemento
- En un documento CSS independiente, al que está vinculado el sitio web
Mejores Prácticas para CSS
Las "mejores prácticas" son los métodos de diseño y creación de sitios web que han demostrado ser los más efectivos y ofrecen el mayor rendimiento por el trabajo involucrado. Seguirlos en CSS en el diseño web ayuda a los sitios web a verse y funcionar lo mejor posible. Han evolucionado a lo largo de los años junto con otros lenguajes y tecnologías web, y la hoja de estilo CSS independiente se ha convertido en el método de uso preferido.
Seguir las mejores prácticas para CSS puede mejorar su sitio de las siguientes maneras:
- Separa el contenido del diseño.Uno de los objetivos principales de CSS es eliminar elementos de diseño de HTML y colocarlos en otra ubicación para que el diseñador los mantenga. Esto también sirve para separar a los diseñadores de los desarrolladores para que cada uno pueda centrarse en sus áreas de experiencia. Un diseñador no tiene que ser un desarrollador para mantener el aspecto de un sitio web.
- Facilita el mantenimiento.Uno de los elementos más ignorados del diseño web es el mantenimiento. A diferencia de los materiales impresos, un sitio web nunca es "uno y está hecho". El contenido, el diseño y la función pueden y deben evolucionar con el tiempo. Tener el CSS en un lugar central, en lugar de esparcido por todo el sitio web, hace que las cosas sean mucho más fáciles de mantener.
- Mantiene su sitio accesible.El uso de estilos CSS ayuda a los motores de búsqueda e individuos discapacitados a interactuar con su sitio.
- Mantiene su sitio actual por más tiempo.Al utilizar las mejores prácticas con CSS, usted cumple con los estándares que se han demostrado estables pero lo suficientemente flexibles para adaptarse al cambio en el entorno de diseño web.
Los estilos en línea no son la mejor práctica
Los estilos en línea, si bien tienen un propósito, generalmente no son la mejor manera de mantener su sitio web. Van en contra de cada una de las mejores prácticas:
- Los estilos en línea no separan el contenido del diseño.Los estilos en línea son exactamente lo mismo que las fuentes incrustadas y otras etiquetas de diseño torpe contra las que los desarrolladores modernos critican. Los estilos afectan solo a los elementos particulares e individuales a los que se aplican; Si bien eso podría darle un control más granular, también hace que otros aspectos del diseño y desarrollo, como la consistencia, sean más difíciles.
- Los estilos en línea causan dolores de cabeza de mantenimiento.Cuando trabaja con hojas de estilo, puede ser difícil determinar dónde se está configurando un estilo. Cuando se trata de una mezcla de estilos en línea, incrustados y externos, hay muchas ubicaciones para verificar. Si trabajas en un equipo de diseño web o tienes que rediseñar o mantener un sitio creado por otra persona, tendrás más problemas. Una vez que encuentre el estilo y lo cambie, deberá hacerlo en cada elemento de cada página donde se haya colocado. Eso aumenta el tiempo y los presupuestos de trabajo astronómicamente.
- Los estilos en línea no son tan accesibles.Si bien un lector de pantalla moderno u otro dispositivo de asistencia puede ser capaz de manejar atributos y etiquetas en línea de manera efectiva, algunos dispositivos más antiguos no pueden, lo que puede resultar en algunas páginas web que se muestran de forma extraña. Los caracteres y el texto adicionales también pueden afectar la forma en que un robot de motores de búsqueda ve su página, por lo que su página no funciona tan bien en términos de optimización de motores de búsqueda (SEO).
- Los estilos en línea hacen tus páginas más grandes.Si desea que todos los párrafos de su sitio aparezcan de cierta manera, puede hacerlo una vez con seis líneas o más de código en una hoja de estilo externa. Sin embargo, si lo hace con estilos en línea, debe agregar esos estilos a cada párrafo de su sitio. Si tiene cinco líneas de CSS, son cinco líneas multiplicadas por cada párrafo en su sitio. Ese ancho de banda y el tiempo de carga pueden acumularse rápidamente.
La alternativa a los estilos en línea: hojas de estilo externas
En lugar de usar estilos en línea, use hojas de estilo externas. Le brindan todos los beneficios de las mejores prácticas de CSS y son fáciles de usar. Empleados de esta manera, todos los estilos utilizados en su sitio viven en un documento separado que luego se vincula a un documento web con una sola línea de código. Las hojas de estilo externas afectan a cualquier documento al que se adjuntan. Eso significa que, si tiene un sitio web de 20 páginas en el que cada página utiliza la misma hoja de estilo, que es la forma en que se realiza, puede modificar cada una de esas páginas simplemente editando esos estilos una vez, en un solo lugar. Cambiar los estilos en un solo lugar es infinitamente más conveniente que buscar esa codificación en cada página de su sitio web. Esto hace que la gestión del sitio a largo plazo sea mucho más fácil.