UNIVERSIDAD METROPOLITANA

Aplicaciones Distribuidas

Nombre: Reynaldo Gurumendi Fecha: 26 de julio de 2016

Justificacin:
La conveniencia de uso, o no, de los frameworks siempre es un tema polmico. No ocurre slo
con los frameworks CSS, sino tambin con los frameworks de otros lenguajes o tecnologas,
aunque quizs en el caso de las libreras CSS todava se acenta ms la discusin.
Entender que la utilizacin de estos nos ayuda en la gran mayora, a tener una rapidez en lo que
queremos hacer, son cosas que algunas personas no entienden o no estn al tanto de que existen.

Objetivo General:

Explicar que los frameworks se utilizan en el mbito de la programacin de aplicaciones desde

hace dcadas. Recientemente han comenzado a utilizarse para programar y disear aplicaciones
web, por lo que ya existen decenas de frameworks para CSS.

Objetivos Especficos:

Demostrar dos frameworks css y explicar lo que son.

Explicar ejemplos sobre cmo utilizarlos.

Marco Terico

Qu son los framework?

Genricamente, un framework es un conjunto de herramientas, libreras, convenciones y

buenas prcticas que pretenden encapsular las tareas repetitivas en mdulos genricos
fcilmente reutilizables.

De la misma forma, un framework CSS es un conjunto de herramientas, hojas de estilos

y buenas prcticas que permiten al diseador web olvidarse de las tareas repetitivas para
centrarse en los elementos nicos de cada diseo en los que puede aportar valor.

Tipos de frameworks

En este caso listaremos dos framewoks ms utilizados en CSS.

Bootstrap

Bootstrap es un framework CSS desarrollado inicialmente (en el ao 2011) por Twitter

que permite dar forma a un sitio web mediante libreras CSS que incluyen tipografas,
botones, cuadros, mens y otros elementos que pueden ser utilizados en cualquier sitio
web.
Aunque el desarrollo del framework Bootstrap fue iniciado por Twitter, fue liberado
bajo licencia MIT en el ao 2011 y su desarrollo continua en un repositorio de GitHub.

Bootstrap es una excelente herramienta para crear interfaces de usuario limpias y

totalmente adaptables a todo tipo de dispositivos y pantallas, sea cual sea su tamao.
Adems, Bootstrap ofrece las herramientas necesarias para crear cualquier tipo de sitio
web utilizando los estilos y elementos de sus libreras.

Desde la aparicin de Bootstrap 3 el framework se ha vuelto bastante ms compatible

con desarrollo web responsive, entre otras caractersticas se han reforzado las
siguientes:
Soporte bastante bueno (casi completo) con HTML5 y CSS3, permitiendo ser usado de
forma muy flexible para desarrollo web con unos excelentes resultados.
Se ha aadido un sistema GRID que permite disear usando un GRID de 12 columnas
donde se debe plasmar el contenido, con esto podemos desarrollar responsive de forma
mucho ms fcil e intuitiva.
Boostrap 3 establece Media Queries para 4 tamaos de dispositivos diferentes variando
dependiendo del tamao de su pantalla, estas Media Queries permiten desarrollar para
dispositivos mviles y tablets de forma mucho ms fcil.
Boostrap 3 tambin permite insertar imgenes responsive, es decir, con solo insertar la
imagen con la clase img-responsive las imgenes se adaptaran al tamao.
Todas estas caractersticas hacen que Boostrap sea una excelente opcin para
desarrollar webs y aplicaciones web totalmente adaptables a cualquier tipo de
dispositivo.
Boostrap es compatible con la mayora de navegadores web del mercado, y ms desde
la versin 3, actualmente es totalmente compatible con los siguientes navegadores:

Google Chrome (en todas las plataformas).

Safari (tanto en iOS como en Mac).
Mozilla Firefox (en Mac y en Windows).
Internet Explorer (en Windows y Windows Phone).
Opera (en Windows y Mac).
Actualmente existen muchsimos themes para WordPress que tienen una base Bootstrap
o estn desarrollados con Bootstrap, es ms, podemos decir que actualmente el 80% de
los themes para WordPress que son responsive estn desarrollados con una base
Bootstrap.

Ejemplo
Blueprint

Blueprint es un complemento para desarrolladores de webs que aumentar la

productividad en las tareas de diseo y maquetacin de pginas. Se trata de una serie de
libreras de Hojas de Estilo en Cascada que contienen cdigo til para maquetar una
pgina web y aplicar otros tipos de estilos tipogrficos o de impresin, algo que
comnmente conocemos como Framework CSS.
Este sistema nos ofrece una serie de archivos con cdigo CSS que podremos incluir en
las pginas web para aplicar estilos de una manera rpida, y solucionar tambin muchos
de los problemas de compatibilidad entre navegadores que pueden surgir durante la
etapa de maquetacin.
Existen diversos Framework CSS disponibles de manera gratuita en Internet, creados
por varios desarrolladores distintos. Blueprint es quizs el ms conocido, o por lo
menos uno de los ms populares y prueba de ello es que se han creado incluso algunas
variantes o productos derivados para ajustar Blueprint a las distintas necesidades de los
desarrolladores.

Ejemplo
 Conclusiones:
Si hay algo por lo que se puede destacar estas herramientas es por su velocidad
al momento de implementarlas. Basta con importar las libreras que se necesita
en las pginas HTML con un simple link y luego saber que etiquetas y clases
usar.
Normalmente vienen preparados con un buen set de componentes para no
preocupase por armar los uno mismo, y eso es otra gran ventaja, puesto que casi
siempre estn armados para seguir los estndares, evitando as que el diseo se
rompa en otros navegadores.
En general la mayor ventaja de estos elementos es que realmente quitan muchos
dolores de cabeza de encima, sobre todo si uno no es un front-end developer
experto y si uno no tiene como afrontar los retos de crear tus propios
componentes.

Bibliografa:

http://getbootstrap.com/2.3.2/examples/hero.html
https://raiolanetworks.es/blog/que-es-bootstrap/
http://www.blueprintcss.org/
http://freakcode.info/por-que-y-porque-no-usar-frameworks-css/
https://codeline.wordpress.com/2008/07/03/blueprintcss-un-framework-css/