Los mejores frameworks para diseño web
El mundo web se ha extendido a pasos agigantados haciendo que podamos disfrutar y aprovechar innumerables experiencias a través de internet, ya sea en materia educativa, de entretenimiento, política, democracia, conectividad social y prácticamente cada rincón o aspecto de nuestras vidas.
Este crecimiento es factible gracias a los aportes que se van generando de forma modular y en capas. Esto implica que sobre un desarrollo pueden darse otros aportes haciéndolo más complejo y diverso. Aquí es donde entra el rol de los frameworks, pero seguiremos una línea lógica desde lo más básico a lo más complejo.
Bases de un sitio web
Un sitio web es algo bastante complejo que damos por sentado, incluso cuando generamos contenido para la web podemos desconocer mucha de la tecnología que la hace posible funcionar. No es el objetivo de este artículo abarcar toda esta tecnología (para eso necesitamos miles de páginas) pero sí podemos entender las bases para poder tomar mejores decisiones en base a diferentes criterios.
Para ello, diremos que un sitio web se compone de páginas que se visualizan de a una en un programa especial: el navegador, que puede ser (Google Chrome, Microsoft Edge, Mozilla Firefox, Opera, etc.) El cual se accede a través de un nombre de dominio único.
Estas páginas web son archivos de texto plano, que tienen instrucciones que los navegadores utilizan para crear elementos visuales como sombras, texto, colores, transparencias, entre otros. Además, tienen referencias o enlaces para mostrar otros elementos en otros archivos como: imágenes, videos y otros elementos multimedia.
El tan nombrado lenguaje de marcado HTML es el que define la estructura del sitio web, mientras que el CSS define la apariencia visual de los elementos creados con HTML.
Crear páginas web complejas simplemente escribiendo este código es algo completamente engorroso e infructífero, porque demandaría una cantidad de tiempo exagerada crear varios tipos de experiencias que actualmente existen.
Los frameworks son marcos de referencia que permiten desarrollar y diseñar de forma más sencilla. Estos brindan una variedad de clases CSS y funciones algorítmicas en JavaScript ya creadas que nos permitirán aplicarlas directamente a nuestra web sin tener que empezar desde cero.
Además del ahorro obvio en materia temporal, estos frameworks nos benefician con otras características:
Responsividad o adaptabilidad:
Muchos frameworks permiten un diseño adaptativo para cualquier tamaño de pantalla, lo que ahorra tiempo al no necesitar de un diseño específico para cada tamaño. Este único diseño dinámico cambiará la ubicación de sus elementos, tamaño y otras variables para ser visto de forma óptima sin importar el dispositivo. Es sumamente importante por la relevancia que tienen hoy en día los dispositivos móviles.
Reutilización y edición:
Cuando ya creamos un sitio web puede que necesitemos editarlo, añadir nuevas páginas y otras modificaciones. A través de un framework, no necesitaremos escribir código CSS de nuevo, porque podemos aplicar el existente a las nuevas páginas.
Más estabilidad:
Al ser utilizado por una gran cantidad de usuarios, estos reportan errores a lo largo del ciclo de vida útil de la versión del framework, y así las siguientes versiones van mejorando notablemente.
A continuación, exploraremos los frameworks más utilizados y las razones que los hicieron tan populares:
#1: Bootstrap:
El número 1 indiscutible. Este poderoso framework se define a sí mismo como: elegante, intuitivo y poderoso para un desarrollo web más rápido y fácil.
El factor que lo convierte en el más popular es la versatilidad en sus componentes, que te permiten crear cualquier estilo con menos limitaciones que otros frameworks. Aunque esta característica es probablemente la misma desventaja para usuarios principiantes, los cuales deben conocer bien este sistema antes de usarlo.
#2: Foundation:
Se define a sí mismo como: El framework más avanzado y responsivo del mundo. Centrado en la adaptabilidad, permite crear independientemente del tamaño de pantalla. Foundation es en realidad una familia de frameworks que hacen fácil el diseño de sitios web adaptables y de estética destacable. Es semántico, legible, flexible y completamente personalizable. Es dinámico porque está en permanente actualización, donde se agregan plantillas y otros recursos.
#3: Milligram:
La idea de este framework es visible ya desde su propio nombre. Su objetivo es ser liviano en respuesta a un problema conocido de los frameworks usuales. Sucede que, a medida que los sitios web se vuelven complejos, se sobrecargan de recursos. Esta sobrecarga se ve reflejada en velocidad, puesto que el navegador debe descargarlos primero para poder utilizarlos y requieren mayor tiempo de procesamiento.
En contrapartida, este framework se jacta de ocupar solo 2KB de espacio en disco (cuando está comprimido) y es minimalista hasta el extremo, lo cual puede beneficiarte por partida doble: al ser el minimalismo una de las tendencias del diseño y mejorar la velocidad de carga de tus páginas web.
#4: Pure.CSS:
Un conjunto de módulos CSS pequeños y adaptables que puedes usar en todo proyecto web. La idea de este framework es ser exageradamente pequeño. Pensado para dispositivos móviles donde la liviandad es clave, tiene cada línea de código CSS pensada cuidadosamente. Puedes usar solo un subconjunto de los módulos que incluye para ahorrar aún más espacio y tiempo de carga.
Te brinda distribuciones predeterminadas o layouts que funcionan como plantillas para hacer diseño web mucho más rápido y asegurarte de que sea estéticamente asertivo. Estos layouts no requieren Javascript.
Ten en cuenta que esos son solo algunas opciones de la enorme cantidad de frameworks disponible. Lo importante es que puedas evaluar las ventajas y desventajas en referencia a tu propio proyecto web. Y si tu idea es simplemente iniciarte en estas prácticas, la mejor recomendación es que te inicies en alguno de propósito más general, para que luego tus conocimientos puedan ser aplicados a una mayor cantidad de proyectos.
