Una diseñadora web en el trabajo en su computadora en una oficina moderna
Credito de imagen: monkeybusinessimages / iStock / Getty Images
La especificación original de Cascading Style Sheets, así como su revisión CSS3 mucho más reciente, son tecnologías que se utilizan para mejorar y formatear páginas web HTML. CSS se diseñó inicialmente para manejar la capa de presentación de una página web de una manera más eficiente que formateado con HTML, que nunca tuvo la intención de manejar la compleja construcción de la Web contemporánea. Debido a que CSS2 es una extensión de CSS1 adoptada universalmente, el término CSS sin un número implica la inclusión de CSS2. La especificación CSS3 aún está en desarrollo en julio de 2014, por lo que los desarrolladores web deben considerar que la compatibilidad con las funciones varía entre los navegadores.
CSS3 es retrocompatible con CSS
CSS3 es una actualización de CSS2 que mantiene la compatibilidad con todas las funciones de CSS; CSS3 no desaprovecha ninguno de los códigos CSS. El código CSS3 está diseñado para hacer que las páginas web se vean mejor y se carguen más rápido, así como para reducir el tiempo de desarrollo para crear páginas en el navegador de un usuario. CSS3 hace que el diseño web dependa menos de los archivos de imagen para los elementos de diseño de la página y reduce las solicitudes de transferencia de archivos y el tiempo de descarga al usar menos imágenes. CSS1 se centró en el formato de apariencia, mientras que CSS2 agregó capacidades de posicionamiento para texto y objetos. Las versiones anteriores del navegador, como IE 9 y anteriores, no son compatibles con las funciones agregadas de CSS3, que pueden requerir tiempo de desarrollo adicional para mantener el código de respaldo de CSS.
Video del día
CSS3 agrega esquinas redondeadas y degradados
Antes de CSS3, los desarrolladores web necesitaban diseñar archivos de imagen para agregar elementos como esquinas redondeadas para bordes estructurales y degradados de imágenes de fondo; CSS3 incluye características comparables que se pueden agregar con unas pocas líneas de código. En CSS, un desarrollador web tiene que diseñar un borde o degradado, subirlo al servidor de imágenes, colocar la imagen en la página y usar CSS para colocar correctamente el borde. En CSS3, el desarrollador web puede lograr algo similar con un código como ".roundBorder {border-radius: 10px;}". Los degradados de fondo son un poco más complicados y requieren un código diferente para diferentes navegadores. Por ejemplo, un degradado de blanco a negro para Chrome e IE utiliza código como ".gradBG {background: liner-gradient (white, black);}".
CSS3 agrega funciones de animación y efectos de texto
CSS3 tiene un puñado de características que no están presentes en CSS para mejorar el aspecto de los elementos de su página. Con CSS3, los desarrolladores web pueden agregar una sombra de texto al texto para facilitar la lectura o agregar un toque visual y pueden forzar saltos de línea dentro de palabras más largas para que quepan dentro de columnas con ajuste de palabras. Antes de CSS3, los desarrolladores web necesitaban codificar la animación en lenguajes de programación como JavaScript y jQuery; CSS3 agrega varias funciones de animación a la capa de diseño. El W3C todavía está trabajando en un estándar de animaciones web para resolver problemas de compatibilidad entre las diferentes técnicas de animación.
CSS3 define columnas de texto
CSS3 agrega la capacidad de dividir secciones de texto en múltiples columnas para leerlas como un periódico. En la especificación CSS2, los desarrolladores web tienen dificultades para construir secciones de texto de varias columnas porque el estándar no está equipado para dividir texto automáticamente. Particularmente con los sitios que cuentan con un diseño receptivo, una técnica de desarrollo que reorganiza y cambia el tamaño del contenido en función de la Al ver la resolución de pantalla del dispositivo, las personas con monitores más grandes pueden tener dificultades para leer las filas de texto que se extienden por el pantalla.
