¿Qué es CSS?
Es necesario que los diseñadores web, a la hora de crear sitios web, dominen fundamentalmente dos lenguajes: uno, HTML (HyperText Markup Language) y el otro, CSS (Cascading Style Sheets). Las últimas versiones de estos dos lenguajes: HTML5 y CSS3, han revolucionado la forma de crear sitios web últimamente, ofreciendo nuevas posibilidades de estructura, formato y composición.
CSS (hojas de estilo en cascada) es un lenguaje de hojas de estilos creado para diseñar y dotar de un determinado aspecto a los documentos HTML. CSS es la mejor forma de separar los contenidos de su aspecto formal y es imprescindible para crear páginas web complejas.
Separar contenido y aspecto presenta numerosas ventajas, ya que obliga a crear documentos HTML bien definidos y con significado completo (también llamados "documentos semánticos"). Además, mejora la accesibilidad del documento, reduce el tiempo y la complejidad de su mantenimiento y permite visualizar el mismo documento en distintos dispositivos (smarphones, tablets o desktops).
Al crear una página web, se utiliza en primer lugar el lenguaje HTML estructurar y marcar los contenidos, es decir, para designar la función de cada elemento dentro de la página web: un párrafo, un titulo, un texto destacado, una tabla, una lista de elementos, etc.
Una vez creados los contenidos, se utiliza el lenguaje CSS para definir el aspecto de cada elemento: el color de la letra y fondo, el tamaño y tipo de letra del texto, la separación horizontal y vertical entre elementos, la posición de cada elemento dentro de la página, etc.
Las normas oficiales están escritas en inglés y se pueden consultar de forma gratuita en las siguientes direcciones:
- Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification
- Descriptions of all CSS specifications
Ventajas de utilizar CSS:
- Separar la estructura de las páginas y su contenido (HTML), del formato del texto y de la página
- Tener muchas más posibilidades de formato y de presentación de la página
- Definir un estilo una sola vez y poder aplicarlo tantas veces como se desee
- Evitar los errores causados por la repetición
- Reagrupar todos los estilos
- Hacer actualizaciones de forma extremadamente rápida
etc, etc, etc, ... (vamos, todo son ventajas)
Las versiones del CSS
La versión "level 1" aparece en diciembre de 1996. La versión "level 2" es de mayo de 1998. Ésta se trataba de una versión muy ambiciosa, ¡demasiado ambiciosa incluso!. La gran cantidad de novedades (fuentes, síntesis vocal...) hicieron que no fueran adoptadas por los navegadores más comunes.
Ante ese "fracaso parcial" el W3C volvió a retomar el trabajo para publicar, en el período de 2004-2006, la versión level 2 revision 1, conocida como CSS 2.1. La versión 2.1 de CSS fue publicada como "Recomendación" el 7 de junio de 2011.
CSS3 está dividido en varios documentos separados, llamados “módulos”. Cada módulo añade nuevas funcionalidades a las definidas ya en CSS2, de manera que se preservan las anteriores para mantener la compatibilidad. Los trabajos en el CSS3, comenzaron a la vez que se publicó la recomendación oficial de CSS2, y los primeros borradores de CSS3 fueron liberados en junio de 1999.
Las principales novedades de CSS3 son las posibilidades de:
- Crear sitios web que se adapten a los distintos tamaños de pantalla.
- Aplicar imágenes a los bordes y añadir varios bordes
- Crear fondos con degradados y con imágenes múltiples
- Usar la transparencia con los colores y con los elementos
- Aplicar sombras a los elementos (cajas, texto, etc.)
- Aplicar transformaciones, transiciones y animaciones a los elementos
- Insertar fuentes con caracteres diversos y especiales
etc ...
Soporte de CSS en los navegadores
El trabajo del diseñador web siempre está limitado por las posibilidades de los navegadores que utilizan los usuarios para acceder a sus páginas. Por este motivo es imprescindible conocer el soporte de CSS en cada uno de los navegadores más utilizados del mercado.
Los navegadores Firefox, Chrome, Safari y Opera son los más avanzados en el soporte de CSS, ya que incluyen muchos elementos de la versión CSS 3 y un soporte casi perfecto de la version 2.1.
Una de los sitios más utilizados por todos los desarrolladores y diseñadores web para comprobar la compatibilidad CSS es http://caniuse.com/
Por otra parte, el navegador Internet Explorer sólo puede considerarse adecuado, desde el punto de vista de CSS, a partir de su versión 9, y aún así, con numerosas limitaciones, incluida la última versión disponible hoy, MS-Edge.
También existe un blog oficial en el que se publican todas las novedades relacionadas con el estándar CSS.