Las hojas de estilo en cascada se han convertido en la forma estándar de diseñar y diseñar sitios web. Los diseñadores utilizan hojas de estilo para decirle a un navegador cómo debe mostrarse 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 implementan de dos formas:
- Inline: dentro de la codificación de la página web en sí, de forma individual, elemento por elemento
- En un documento CSS independiente, al que está vinculado el sitio web
Prácticas recomendadas para CSS
Las "mejores prácticas" son los métodos de diseño y construcción de sitios web que han demostrado ser los más efectivos y los más rentables por el trabajo involucrado. Siguiéndolos en CSS en diseño web ayuda a que los sitios web se vean y funcionen 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 varias maneras:
- Separa el contenido del diseño: Uno de los principales objetivos de CSS es eliminar elementos de diseño de HTML y colocarlos en otra ubicación para que el diseñador los mantenga. Esta práctica también sirve para separar a los diseñadores de los desarrolladores para que cada uno pueda centrarse en sus áreas de especialización. Un diseñador no tiene que ser un desarrollador para mantener el aspecto de un sitio web.
- Facilita el mantenimiento: Uno de los elementos del diseño web que más se pasa por alto es el mantenimiento. A diferencia de los materiales impresos, un sitio web nunca es "uno y listo". 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 esparcirlo 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 y a las personas discapacitadas a interactuar con su sitio.
- Mantiene su sitio actualizado por más tiempo: Al utilizar las mejores prácticas con CSS, se adhiere a los estándares que han demostrado ser estables pero lo suficientemente flexibles para adaptarse a los cambios en el entorno de diseño web.
Los estilos en línea no son las mejores prácticas
Los estilos en línea, aunque tienen un propósito, generalmente no son la mejor manera de mantener su sitio web. Van en contra de todas las mejores prácticas:
- Los estilos en línea no separan el contenido del diseño: Los estilos en línea son exactamente iguales que la fuente incrustada y otras etiquetas de diseño torpes contra las que los desarrolladores modernos se oponen. Los estilos afectan solo a los elementos individuales particulares a los que se aplican; Si bien ese enfoque puede brindarle un control más granular, también dificulta otros aspectos del diseño y el desarrollo, como la coherencia.
- Los estilos en línea causan dolores de cabeza por mantenimiento: Cuando se trabaja con hojas de estilo, puede resultar difícil determinar dónde se establece un estilo. Cuando se trata de una mezcla de Estilos en línea, integrados y externos, tienes muchas ubicaciones para comprobar. Si trabaja en un equipo de diseño web o tiene que rediseñar o mantener un sitio creado por otra persona, tendrá aún más problemas. Una vez que encuentre el estilo y lo cambie, tendrá que hacerlo en cada elemento de cada página donde se haya colocado. Eso aumenta astronómicamente los presupuestos de tiempo y trabajo.
- Los estilos en línea no son tan accesibles: Mientras que un lector de pantalla moderno u otro dispositivo de asistencia puede manejar atributos en línea y las etiquetas de forma eficaz, algunos dispositivos más antiguos no pueden, lo que puede provocar que se muestre una web de forma extraña páginas. Los caracteres y el texto adicionales también pueden afectar la forma en que un robot de motor de búsqueda ve su página, por lo que su página no funciona tan bien en términos de optimización de motor de búsqueda.
- Los estilos en línea hacen que sus páginas sean más grandes: Si desea que todos los párrafos de su sitio aparezcan de cierta manera, puede hacerlo una vez con aproximadamente seis líneas 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 de su sitio. Ese ancho de banda y el tiempo de carga pueden acumularse rápidamente.
La alternativa a los estilos en línea son las hojas de estilo externas
En lugar de utilizar estilos en línea, utilice hojas de estilo externas. Le brindan todos los beneficios de las mejores prácticas de CSS y son fáciles de usar. Empleado 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. Hojas de estilo externas afectar a cualquier documento al que estén adjuntos. Si tiene un sitio web de 20 páginas en el que cada página utiliza la misma hoja de estilo, que suele ser hecho: puede realizar un cambio en cada una de esas páginas simplemente editando esos estilos una vez, en una lugar. Cambiar los estilos en un lugar es más conveniente que buscar esa codificación en cada página de su sitio web. Esta flexibilidad hace que la gestión del sitio a largo plazo sea mucho más sencilla.