Definición de hoja de estilo (css)

Anuncios

Las hojas de estilo (en inglés Style Sheets) son la forma que tienen los diseñadores web para definir el aspecto y diseño de las páginas web. Las hojas de estilo suelen ser escritas en el lenguaje CSS (Cascading Style Sheets) y también en XSLT. El CSS es un estándar de la W3C que es ampliamente aceptado entre los navegadores web actuales.

Con las hojas de estilo un diseñador puede definir muchos aspectos de una página web como: fuentes, colores, diseño, posicionamiento, imágenes, accesibilidad, tamaño de página, márgenes, etc., manteniendo la consistencia entre sus páginas web y permitiendo una fácil actualización y adaptación del diseño.


Aspectos generales del uso de hojas de estilo

Las hojas de estilo son una poderosa forma de definir el aspecto de las páginas web, además permiten separar el aspecto del código de la misma. Esto facilita actualizar el aspecto rápidamente sin tocar el código HTML.

Si un determinado estilo debe cambiar en múltiples páginas web de un sitio web, CSS permite resolver este problema permitiendo a los diseñadores especificar estilos por defecto para cualquier elemento HTML y reglas especiales que pueden ser reusadas para casos especiales.

Las reglas para el diseño CSS pueden aplicarse a uno o más tipos de etiquetas (tags). Pueden aplicarse a todas las etiquetas de un tipo (por ejemplo, a todas las etiquetas para párrafos en HTML), o sólo a ciertas etiquetas identificadas por una clase específica o un atributo ID. Las reglas CSS incluso pueden ser aplicadas a etiquetas basadas en las etiquetas que vienen antes que estas o las que están dentro.

Las reglas CSS son aplicadas respetando una jerarquía llamada "en cascada", esto significa que las reglas más generales y por defectos se heredan y pueden ser reemplazadas por otras reglas más específicas.

Por ejemplo, si se aplica un estilo a todas las etiquetas párrafos y luego se aplica otro estilo a una clase especial de párrafos, los párrafos "especiales" heredarán el estilo general y el estilo especial. El especial tiene prioridad y reemplaza lo que haya que reemplazar del general.


Ventajas de usar hojas de estilo

- Velocidad: los sitios que utilizan hojas de estilo suelen cargarse más rápido, si la hoja de estilo está bien escrita y, especialmente, si la hoja de estilo ya se cargó anteriormente (se guarda una copia caché en nuestra computadora).

- Mantenibilidad: guardar los estilos de presentación en un único archivo puede reducir el tiempo de mantenimiento, reduce los errores y mejora la consistencia del diseño de un sitio web. Por ejemplo, rápidamente podríamos cambiar el tipo de fuente para texto utilizado en todo un sitio web.

- Accesibilidad: los sitios que emplean hojas de estilo pueden ser ajustados para que su apariencia sea similar usando diferentes navegadores. Además permite que navegadores que no son gráficos ignoren la hoja de estilo (por ejemplo, los navegadores en braille).

- Personalización: el autor de un sitio web puede ofrecer diferentes aspectos dependiendo del visitante.

- Consistencia: las hojas de estilo sólo contienen el aspecto, que se mantiene separado del código HTML o XHTML. Las páginas web resultantes son consistentes en su aspecto entre sí.

- Portabilidad: los detalles de presentación de un documento se dejan para último momento (para el momento que es cargado el documento), por lo que se puede adaptar el diseño de acuerdo a variables como el dispositivo que intenta accederlo (PC, móvil, tablet, impresora...), resolución de la pantalla, etc.




Relacionado

- CSS (definición)