Zimit Framework: Framework para Responsive Web

Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedIn

Awesome, solid, responsive and complete front-end prototyping framework for web developers.

Zimit  Framework es un proyecto de código abierto creado originalmente por Jorge Garrido Oval, también conocido como FireZenk, con la intención de proporcionar una base sólida y completa para creación rápida de prototipos de páginas web adaptables basadas en HTML5 con un uso intensivo de CSS mediante el uso del lenguaje de precompilador LESS, relegando a un segundo plano el uso de javascript.

2013-01-29 14.40.19

Zimit es un framework para prototipado web que implementa el 100% de las nuevas etiquetas HTML5, siendo el único en este campo. Por ello solo es compatible con los navegadores modernos, siendo posible ampliar su compatibilidad mediante javascripts externos.

El framework está diseñado para crear una interfaz uniforme y con un estilo unificado, cada componente sigue el mismo estilo agradable que se consolida en una interfaz ligera y agradable, altamente personalizable mediante la modificación del archivo de variables escrito en less, escalable y mantenible.

Construido con la idea de crear una base sólida, Zimit proporciona un esqueleto completo de diseño y un amplio conjunto de componentes totalmente estilizados. Gracias a la modularidad proporcionada por el uso de LESS, Zimit es un framework flexible y modular, puede ser desde sólo un esqueleto de diseño a una solución completa. El uso intensivo de CSS hace de Zimit un framework ligero y sencillo de implementar, el archivo compilado y minificado solo pesa 84kb! Además Zimit incorpora una librería externa de iconos tipográficos y una de resaltado de código.

Como novedad añadida, Zimit implementa sus propias etiquetas HTML5 para dotar de mayor semántica a la hora de crear el prototipo, siendo estas etiquetas propias totalmente opcionales.

Datos técnicos adicionales:
– Basado en una grid fluida de 12 columnas y de 320 a 1200px
– Definición del contenedor principal: <div>
– Definición de filas: <div class=”row”></div>
– Definición de columnas: c1 a c12
– Definición de offsets para columnas: o1 a o11
– Ver más en la documentación oficial: http://firezenk.github.com/zimit/started.html

Ejemplo definición de fila con 2 columnas:

1
2
3
4
<div class="row">
<div class="c4">...</div>
<div class="c8">...</div>
</div>

Ejemplo definición de fila con offset:

1
2
3
4
<div class="row">
<div class="c4">...</div>
<div class="c4 o4">...</div>
</div>

 

Este es el primer proyecto que ADWE apoya oficialmente en su esfuerzo de generar unos estándares, una metodología de trabajo y una serie de buenas prácticas para el crecimiento general de la industria española del desarrollo web. Si queréis que os ayudemos con la difusión de vuestro proyecto, tanto como para conseguir colaboradores como para que llegue al máximo público posible. Enviad un e-mail contacto[a]adwe.es

Proyecto Apoyado por ADWE

Estos artículos están escritos por todos nuestros managers de ADWE, y por nuestros colaboradores habituales.

Comentarios arrow

Escribe un comentario

Tu e-mail no será publicado. Los campos marcados con un asterisco son obligatorios.