En el competitivo mundo de la creación de contenido web, las herramientas que usamos para hacer nuestras páginas más atractivas y posicionadas van evolucionando rápidamente; un ejemplo claro son las hojas de estilo, quienes se van innovando en archivos complejos y dificultosos de manejar, es por esta razón que se hace imperioso buscar mecanismos para que nos faciliten el proceso creativo.

El SASS (Syntactically Awesome Style Sheets) es uno de estos mecanismos que vienen a ayudarnos y es un meta-lenguaje basado en CSS que nos brinda una sintaxis más simple incorporándole otras funciones como el uso de variables, anidamiento y mixins (directivas que permiten definir estilos reutilizables en toda la hoja de estilos); logrando así un desempeño más eficiente y rápido.

sass-y-sus-ventajas

La función de las Variables es altamente ventajosa ya que nos permite guardar información (colores, fuentes, dimensiones, etc) que se pueda reutilizar posteriormente en las hojas de estilo.

La función del Nesting o Anidamiento nos permite escribir hojas de estilo con jerarquías o niveles, que nos facilite mantener la misma jerarquía visual del código HTML, agrupando posteriormente los estilos de forma separada y ordenada.

La función del Mixins nos permite reutilizar un bloque completo de código, lo que provee maneras más flexibles de establecer estilos complejos; sin la necesidad de copiarlos y pegarlos cada vez que se vayan a utilizar.

En el SASS se manejan dos tipos de sintaxis: SCSS y la Indented Syntax. El SCSS es el más conocido ya que es muy parecido a la sintaxis de CSS, porque trabaja en bloques permitiendo importar hojas de estilo CSS desde un archivo SCSS. La indentación se usa para separar bloques de código. Se puede pasar de una sintaxis a la otra por medio del sass-convert (librería muy interesante).

El SASS es un lenguaje muy ventajoso por diversas razones y podemos destacar las siguientes:

  1. Es 100% compatible con CSS3, que es el lenguaje más utilizado actualmente.
  2. Crea archivos CSS bien formateados y admite configurar su formato.
  3. Nos brinda un margen amplio de libertad al facilitar el uso de variables, anidamiento de estilos y mixins.
  4. Agiliza los tiempos y el proceso con el uso de variables y funciones, ya que es una manera eficaz de reducir las líneas que tienen que escribirse y evitar que se repitan.
  5. Podemos crear contenidos más elegantes, divertidos y versátiles al incluir las funciones para manipular en forma rápida y efectiva los colores, tamaños, fuentes y otros valores.
  6. Permite la integración de numerosos Frameworks.

Teniendo en cuenta todo esto, es hora de empezar a diseñar usando SASS, es sencillo y muy útil en todo aspecto, por algo su eslogan dice “CSS con Superpoderes”, ¿te lo imaginas entonces?. Aquí la página oficial con todo lo que necesitas para usarlo.

http://sass-lang.com/