Cuando se habla de diseño web, muchas veces hacemos referencia a framework CSS que nos facilitan esta tarea de maquetar y construir sitios o aplicaciones web, ya que la programación necesaria para diseñarlos ya esta construida. Con esto ya no necesitamos volver a construir la rueda porque ya partimos de una base que nos permitirá agilizar el trabajo.
En este articulo te mostraremos 10 framework CSS que agilizan el trabajo de diseño y maquetación.
1. Pure CSS
Pure CSS es un proyecto enfocado a la velocidad de carga de los sitios para mejorar el SEO de los sitios, ya que es relativamente pequeño. Solamente pesa 3.8 KB minificado y comprimido. Pensado para la mayoría de dispositivos, para los creadores de este proyecto es importante mantener los archivos lo menos pesado y cada linea de CSS se consideró cuidadosamente.
Info & Descarga: URL del Sitio Pure.CSS
2. Bulma
Bulma es un Framework de código abierto basado en Flexbox muy usado, es 100% responsive, modular y moderno. Con 21 KB minificado y comprimido, no es de los mas ligero de la lista pero su marco es muy interesante, ya que esta optimizado para la lectura vertical y su cuadrícula totalmente construido con Flexbox. Su utilizado es muy cómodo, ya que su curva de aprendizaje es muy rápida.
Info & Descarga: Bulma
3. Mini.CSS
Este es uno de los más ligeros de la lista porque esta enfocado a mejorar la rapidez de carga de los sitios con tan solo ~7KB minificado y comprimido. Mini.css está pensado para el soporte a largo plazo, así que es compatible con todo los navegadores modernos pero hay cierta funcionalidad que no sera reflejada en algunos navegadores como lo son Internet Explorer, Opera Mini, IE Mobile.
Info & Descarga: Mini.css
4. Ulkit
Ulkit es un marco de front-end ligero y modular para desarrollar interfaces web rápidas y potentes. Su implementación es rápida y se puede ir agregando nuevas funcionalidades al framework y hacerlo mas escalable en tus sitios o aplicaciones web.
Info & Descarga: Ulkit
5. Skeleton
Con tan solo 400 lineas de código, Skeleton es liviano. Sin embargo, tiene muchas funciones integradas con poco código como lo son grid, tipografías, formularios, consulta de medios. Si tu proyecto de sitio o aplicación web no requiere de marcos grandes que te proporcionan por ejemplo Bootstrap, puedes utilizar Skeleton que con tan pocas lineas de código te crea un marco estándar de diseño.
Info & Descarga: Skeleton
6. Base
Base es un framework CSS muy simple pero robusto. Construida con un código ligero y minimo, Base esta diseñado para proporcionar a los desarrolladores y diseñadores una forma fácil de crear sitios web y aplicaciones para múltiples navegadores y dispositivos móviles. Con ello dedicas mas tiempo a crear aplicaciones web escalables en su estructura y diseño.
Info & Descarga: Base
7. Spectre
Como punto de partida hacia este framework, su tamaño es de (~10 KB), como se observa es ligero para incluirlo en sus proyectos, Spectre proporciona elementos de diseño elegantes, así como un diseño basado en Flexbox, sensible y fácil de usar para dispositivos móviles.
Info & Descarga: Spectre
8. Miligram
Miligram proporciona una configuración mínima de estilos para un punto de partida rápido y limpio. Con solo ~2KB, este marco pequeño pero poderoso se encuentra entre los tres primeros lugares de los mas ligero disponibles. Esta diseñado para un mejor rendimiento y una mejor productividad con menos propiedades para restablecer, lo que resulta en un código mas limpio.
Info & Descarga: Miligram
9. Dead Simple Grid
Dead Simple Grid es un micro framework CSS simple y pequeño con alrededor de 250 bytes de CSS y sin dependencias, tiene solo dos clases .row y .col para utilizarlas. Abarca los conceptos de mejora progresiva y de dispositivos móviles y ofrece un diseño móvil de una columna para los navegadores antiguos.
Info & Descarga: Dead Simple Grid
10. Picnic CSS
Con un tamaño de solo ~3KB cuando está comprimido, Picnic es seguro de peso ligero, pero también tiene todo lo que necesita para crear un sitio web atractivo y funcional.
Info & Descarga: Picnic CSS
@Happy Code
0 comentarios