Framework CSS para crear estructuras perfectas

Nunca fui fanático de usar Frameworks, aunque hay algunos como jQuery que me parecen imprescindibles, pienso constantemente que utilizar un Framework termina siendo más una desventaja que una ventaja, especialmente cuando nos referimos a Frameworks CSS, CSS no es complicado para nada y no veo la necesidad de contar con una ayuda tan grande sobrecargando una aplicación con esquemas que nunca utilizaremos, no obstante me llamo mucho la atención uno en particular, estoy hablando de The Square Grid.

The Square Grid es un pequeño Frameworks CSS que esta orientado a emplear uno de los aspectos más importantes y que lamentablemente no se piensan demasiado, me refiero a las proporciones.  Como su nombre lo indica, este Framework trabaja sobre una grilla con la particularidad de contar con 35 columnas de idéntico ancho, para que luego nosotros podamos jugar con ellas disponiendo elementos o agrupandolas según nuestras necesidades.

Para crear nuestras columnas según nuestras necesidades solo bastara con asignar una clase al div indicando el numero de columnas a utilizar, o bien, si la columna en cuestión tendrá bordes.

Ejemplo de utilización, en negro el nombre de la clase de la columna:

columnas css framework

Otro excelente ejemplo de la potencia de utilizar este simple framework es el citado como ejemplo en la web oficial en donde se utilizan las columnas guardando la proporción áurea:

columnas numero oro

The Square Grid es un excelente complemento para nuestros diseños, en mi opinión es muy practico para probar distintas estructuras rápidamente, para luego ya seleccionada la definitiva traducirla a CSS simple y duro, sin utilizar el Framework como soporte definitivo, solamente a modo de guía.

Para finalizar y para mostrar un ejemplo de lo importante que es la utilización de buenas proporciones, les dejo la captura del rediseño de Twitter que utiliza la proporción áurea, que encontré hace unos días en Microsiervos.

twitter aureo

Web oficial Framework: The Square Grid

Categorizado en: