Uno de los grandes debates de los últimos años en torno al desarrollo web es la pregunta si CSS se puede considerar programación. Tradicionalmente, CSS nació como un lenguaje de estilos orientado a la definición de aspectos básicos visuales como colores y ciertos detalles menores más. Si querías hacer algo más complejo, tenías que apoyarte en lenguajes de programación como Javascript o preprocesadores de CSS.
Desde entonces, CSS ha cambiado y evolucionado bastante, aunque muchos desarrolladores siguen pensando CSS (quizás por desconocimiento, quizás por desinterés) que sólo sirve para detalles básicos de apariencia.
Preguntas frecuentes
Dentro del ámbito de la programación, cuando hablamos de lógica hablamos del conjunto de reglas, principios y estructuras que nos permiten controlar el comportamiento y resolver problemas de forma organizada. En esta categoría hablaremos de Lógica CSS refiriéndonos a estos aspectos de lógica de programación que en este caso están orientados al mundo de CSS.
Vamos a empezar respondiendo las preguntas más clásicas que suelen plantearse alrededor de este tema:
- 🟥 «CSS no es un lenguaje de programación porque no tiene variables». Incorrecto
Existen las variables CSS (llamadas realmente CSS custom properties) desde 2015. Incluso es posible tiparlas, estableciendo un tipo de dato CSS concreto. Mucha gente desconoce que existen las variables CSS porque se quedaron anclados en la época donde sólo era posible hacerlo mediante un preprocesador CSS como Sass.
- 🟥 «CSS no es un lenguaje de programación porque no tiene condicionales». Incorrecto
Existe una propuesta que ya está siendo implementada en navegadores para añadir condicionales en CSS mediante ternarios if() y consultas de estilos style(), así como reglas @when / @else, más orientadas a media queries y soporte del navegador. Aún así, en CSS existe desde hace mucho tiempo reglas como @media, @supports e incluso @container, que son una especie de condicionales restringidos a un objetivo concreto. También, mediante la pseudoclase :has() podemos establecer condiciones muy potentes para realizar lógica en determinados casos.
- 🟥 «CSS no es un lenguaje de programación porque no permite cálculos». Incorrecto
CSS tiene funciones matemáticas como calc() que permiten realizar cálculos incluso entre diferentes unidades, así como funciones matemáticas como máximos y minimos, funciones trigonométricas o funciones de redondeo. Además, muy pronto tendremos funciones para generar valores aleatorios.
- 🟥 «CSS no es un lenguaje de programación porque no tiene funciones». Incorrecto.
Se encuentran aún en fase de desarrollo, pero existe una propuesta para añadir funciones próximamente mediante la regla @function. Además, también existirá una regla @mixin que permitirá crear funciones reutilizables.
- 🟨 «CSS no es un lenguaje de programación porque no tiene bucles». Debatible.
Es cierto que el concepto de bucle tradicional de programación no existe en CSS, pero si que existen ciertos bucles orientados a diseño, como por ejemplo los contadores CSS, que permiten crear bucles, iterar, incrementar valores y mostrarlos por pantalla, e incluso personalizarlos. También tenemos selectores especializados como :nth-child() o :nth-of-type() que permiten recorrer elementos y aplicar estilos como si de un bucle se tratase. Si bien no existen bucles clásicos, existen formas alternativas de crear ciclos u operaciones iterativas.
- 🟥 «CSS no es un lenguaje de programación, sólo sirve para páginas webs». Incorrecto.
Al contrario de lo que mucha gente piensa, CSS no sólo se utiliza para páginas webs. Obviamente, su uso principal es crear páginas webs o, junto a frameworks de Javascript, aplicaciones web (alternativa a apps de escritorio), pero también se pueden crear apps o juegos móviles o incluso definir la presentación de documentos impresos. Mucha gente lo desconoce, pero el formato de ebooks .epub, realmente es un fichero comprimido con documentos XML y CSS en su interior, entre otros. CSS también se utiliza incluso para definir widgets o interfaces de sistemas operativos, etc.
- 🟥 «CSS no es Turing-computable, no es un lenguaje de programación». Incorrecto.
Un sistema es Turing-completo si puede realizar cualquier cálculo que una máquina de Turing puede hacer. La regla 110 es un autómata muy simple que es capaz de simular cualquier cálculo complejo. Esto significa que si un sistema puede simular la Regla 110, es un sistema Turing-completo. Hace algunos años, se presentaron algunos trabajos donde se demostró que la Regla 110 es capaz de hacerse con HTML, CSS y la interacción del usuario, por lo que formalmente HTML y CSS es Turing-completo, al contrario de lo que mucha gente piensa. Aún así, recuerda que estrictamente Excel, Minecraft o un Buscaminas con grid infinito también son Turing-completos.
- 🟨 «CSS no es programar porque no estás escribiendo un programa». Debatible.
Es cierto que no es imprescindible saber programar para escribir líneas de CSS. Sin embargo, lo cierto es que para escribir bien CSS se requieren muchos y diversos conocimientos: matemáticas, lógica, conocimientos estéticos y visuales, organización y escritura de código, usabilidad y accesibilidad, e incluso aspectos de programación para anticiparte a como será la estructura de la página y como funcionará, etc. No olvidemos que realmente al diseñar una página estamos realmente creando una interfaz de usuario (aplicación o programa) que el usuario tendrá que utilizar.
- 🟩 «Realmente no importa si CSS es o no un lenguaje de programación». Correcto.
En general, los intentos de determinar si CSS es o no un lenguaje de programación no tienen mucho sentido. Normalmente se hacen por personas que buscan denostar o despreciar un lenguaje en favor de otro, probablemente para quitarle importancia o disimular sus carencias personales. El objetivo de CSS no es desarrollar funcionalidades como un lenguaje de propósito general, sino mejorar en lo posible la presentación, el aspecto visual, la interacción o la funcionalidad de los elementos de una interfaz de usuario, sea a través de una página web, aplicación web o cualquier otro medio.
En los siguientes artículos, explicaremos algunas de las características modernas que nos ofrece CSS y que se escapan del CSS tradicional y se acercan peligrosamente a los límites del desarrollo y la programación.
