Procesando CSS

CSS es un lenguaje diferente, no hay for, ni muchas instrucciones de un lenguaje de programación. Pero llegar al punto de no tener ni variables, en la actualidad es casi demencial. Esto es normal cuando se empezo a crear CSS solo servía para pintar el HTML que estaba en la pantalla, pero en la actualidad lucha con javascript e incluso crea sitios web diferentes para móviles. El CSS debe de evolucionar.

Y asi ha sido y CSS ha evolucionado aunque no lo veamos. Desde hace años que existen lenguajes que nos ayuda a organizarnos, a programar y en definitiva a ser más eficientes a la hora de preparar nuestros CSS en un proyecto Web. Hay varias herramientas, fundamentalmente esta LESS, Styluss y SASS. Y a continuación hablamos de como nos ayudan y su necesidad.

¿Que tiene en común LESS y SASS?

La creación de variables, para mi es el punto fundamental. En varias empresaas donde he estado han cambiado su imagen corporativa, donde era un azul claro, de la noche a la mañana se convertia en azul oscuro. Entonces abrías el Notepad++ todos los ficheros CSS y remplazabas el hexadecimal. Y lo normal es que cambies hasta algún estilo de la base de Bootstrap que no querías. En un proyecto grande ayuda tener todo concretado con variables, en mi caso hasta las fuentes estan mapeadas en varibles de LESS

Otro punto que en este caso no es para que nos ayude en el desarrollo sino para al usuario, el permitir que se compriman los ficheros CSS y unificarlos es un único fichero es obligatorio para pasar test de velocidad e incluso posicionamiento SEO. Explicandolo mejor, imagenemos un proyecto grande, para la maquetación igual que usaremos muchos ficheros tpl o html en CSS deberiamos de acabar con muchos por el tema de la reusabilidad, gestión de errores y evitar el código espagueti. Pero esto nos obliga a insertar multitud de import por cada página que carguemos, no es bueno tener que llamar a 15 o 20 ficheros.css. Tarda más en cargar la web, al final lo del código espagueti es lo mejor en producción. Y para unificar las dos cosas necesitamos un preprocesamiento, que unifique y comprima el CSS solo en producción.

Mi experiencia y opinión