INSTITUTO TECNOLOGICO DE DURANGO

Nombre del Alumno: Cesar Daniel Rodrguez Hernndez

Nombre de la Maestra: Cristabel Armstrong Aramburo
Materia: Tpicos Avanzados De Programacin Web
No.de Control: 12040442
Grupo: 7Q
Carrera: Ingeniera en Informtica
Fecha: 11 de septiembre de 2015

ndice

INTRODUCCION 3
Qu son los Frameworks CSS?
Clasificacin

Tabla comparativa de Frameworks de CSS

Conclusin
..8
Bibliografa
.8

INTRODUCCION
En este trabajo se dispondr de que es un framework de css, los tipos de
frameworks que hay y de una tabla comparativa de algunos frameworks con una
descripcin y sus ventajas y desventajas para saber cul es el mejor que podemos
utilizar y que cubra las necesidades.
Hay gran cantidad de Frameworks que se pueden utilizar y ya depender de cada
desarrollador utilizar lo que necesite para obtener la mejor pagina web

Qu son los Frameworks de CSS?

Marcos de estilo CSS son bibliotecas pre-preparados que estn destinados a
permitir una ms fcil, ms estndares estilo compatible de pginas web utilizando
el lenguaje CSS. Marcos CSS construida de manera eficiente puede agilizar el
proceso de diseo, acortar el tiempo de desarrollo, y garantizar que sus escalas
de sitios web correctamente en todos los dispositivos. En este informe, voy a
explorar muchos marcos de estilo CSS que se utilizan para crear sitios web de
respuesta rpida y eficaz.

Clasificacion
Podemos clasificar los frameworks de css en dos tipos:

Multipropsito.- Proporcionan un conjunto de utilidades variadas tiles para

distintos aspectos del desarrollo de un diseo web. Ej Cascade Framework.

Propsito especfico.- Estn orientados a proporcionar herramientas para

un propsito determinado. Por ejemplo, hay frameworks de CSS orientados a
proporcionar herramientas para el desarrollo de rejillas (Ej. Responsive Grid
System, Skeleton, Semantic Grid System), orientadas al control de la parte
grfica del interfaz de usuario (Ej. Accordion, tabs, slideshow), orientados a
la tipografa, etc.

Tabla Comparativa de Frameworks de CSS

Frameworks

Blueprint CSS

Descripcin
Blueprint es un
marco CSS que
sirve de apoyo en
el
diseo
y
maquetacin
de
webs
2.0,
que
apunta a reducir
tiempo
de
desarrollo
ofreciendo
una
base slida para
construccin de un
proyecto, con una
tabla fcil de usar,
tipografa sensible,
plugins tiles y una
hoja de estilo para
la impresin.

Ventajas

Desventajas

La curva de aprendizaje es En un principio

corta.
se
puede
percibir como un
Muy robusto.
sistema rgido.
Se integra bien con otros nfasis en la
frameworks.
estructura
por
encima
del
Su nivel de Cross-browser contenido de los
es del 99%.
objetos.
No es restrictivo.

960 Grid
System

Ivory

960 Grid es un
framework de CSS
que se cre por la
necesidad de tener
un estndar en el
ancho de los sitios
web, el cual facilita
la maquetacin a
un estndar de
960px de ancho,
tiene
configuraciones de
12 y 16 columnas
para
poder
combinar entre s y
as crear layout de
una forma simple y
rpida.

IVORY,
una
respuesta
a
Bootstrap
mucho
ms ligera, ya que
este framework pes
a
menos
de
30kb (que
comprimido
con
GZip probablemente
sea menos de10kb)
e
incorpora
el
sistema
de
cuadrculas, estilos
de
formularios,
listas, tipografas y
an ms cosas, y
aunque
le
falta
mucho para llegar a
Bootstrap es sin
duda una buena
alternativa
(por
supuesto
es
compatible
con
todos
los

Estructura
previa,
el Es
una
sistema
ofrece
una estructura
estructura
para
la rgida,
el
diagramacin de los sitios sistema ofrece
web.
una
retcula
rgida para la
Experiencia visual, ofrece diagramacin de
una retcula que mejora el los sitios web
balance, la alineacin y el que no permite
espacio para lograr una variantes para
mejor experiencia visual.
lograr
otras
formas
de
mostrar
el
contenido.
Limita
la
creatividad,
el
uso continuo de
una
retcula,
limita
la
creatividad en el
diseo
y
la
diagramacin de
sitios web.
Disposicin flexible
Rejilla de Fluidos

Se deben tener
conocimientos
previos en CSS

Movilidad Dispositivo
Multi
Peso ligero

navegadores
actuales).
skeleton

YAML

Base

Pure

Un
puado
de
elementos
HTML
estndar e incluye
una rejilla, pero eso
es a menudo ms
que suficiente para
empezar. De
hecho, este
sitio
est
construido
sobre Esqueleto y
tiene ~ 200 lneas
de
CSS
personalizado (la
mitad de los cuales
es
el
de
navegacin
de
acoplamiento).
Un
completo
conjunto de bloques
de
construccin
emparejados
para
crear pginas web
complejas. Rejas,
navegacin,
formularios, mdulos
de la tipografa y
todos
los
complementos
previstos
trabajan
juntos sin problemas
Base es un marco
sencillo,
sensible
construido
para
funcionar
en
dispositivos mviles,
tabletas, netbooks, y
las computadoras de
escritorio.

Ligero como una pluma en

~ 400 lneas y construida El uso de la
con el mvil en mente.
retcula limita la
creatividad
Estilos diseados para ser
un punto de partida, no un
marco de interfaz de
usuario.

Sistema de red flexibles a

prueba de balas
Formas kit de herramientas
flexible con el tema de
soporte
Centrado en los estndares
web y accesibilidad
Tipografa Optimizado para
todos
los
elementos
estndar

Conocimientos
previos en CSS

Base se desarrolla con

menos, que es un CSSpreprocesador
que
le
ayudar escribir cdigo ms
limpio, ms organizado y
fcil de mantener.
Esta hoja de estilo incluye
estilos
de
tipografa,
blockquotes,
tablas
y
ms. Este marco tambin
incluye una plantilla bsica
con HTML5, JQuery, que le
ayudar a iniciar su proyecto
rpidamente.

Dimensiones de
Pantalla
mayores a 1024
Pixeles

Estancias
camino.

Diseo sencillo
Estilos mnimos

fuera

de

su

Crear diseos sensibles.

Cree su propia apariencia.
Compass

Sass es
una
extensin de CSS3
que aade reglas
anidadas,
variables, mixins,
herencia
del
selector,
y
ms. Sass genera
CSS buen formato
y hace que sus
hojas de estilo ms
fcil de organizar y
mantener.

Experimenta marcado ms Problema con

limpio
sin
clases
de reutilizar los web
presentacin.
patrones.
Est repleto de las mejores
de
la
web patrones
reutilizables.
Hace que la creacin
de sprites una brisa.
Mixins
Compass
hacen CSS3 fcil.
Cree
hermosos ritmos tipogrficos
.
Descargar
y
crear
extensiones con facilidad.

Toast

Conocido por ser un

marco CSS
simple. Este marco
tiene una cuadrcula
de respuesta 12
columnas.
Esto permite que los
diseos para crear
fcilmente

Este marco incluye dos

estados principales. Se trata
de diseo de columna nica
para la pantalla estrecha y
dispositivos mviles.
El otro es un diseo de
varias columnas hasta un
ancho predeterminado de
960
px. Todas
las
caractersticas
de
este
marco es en su propio
archivo CSS.

Toast slo es
compatible con
Internet Explorer
8 o superior

Gumby

Gumby es un marco
de
rejilla
CSS
sensible y 960px de
la red. Sistema de
red
de
Gumby
puede
ser
personalizado con el
fin de satisfacer sus
necesidades. Cuent
a con un diseo
fluido
fijo
que
optimiza la autocontenido para el
escritorio, tableta, y
las
resoluciones
mviles.

Cuenta con un diseo fluido

fijo que optimiza la autocontenido para el escritorio,
tableta, y las resoluciones
mviles.
Gumby incluye un kit de
interfaz de usuario Web, que
consta de los botones,
formas, la navegacin, y
mucho ms.
Adems, cuenta con un
archivo JavaScript que trae
el kit de interfaz de usuario
web a la vida. Esta
marco es gratis, tiene demos
para
todas
sus
caractersticas, y est muy
bien documentado

No es fcil de
implementar por
cualquier
diseador web,
se deben tener
conocimientos
de HTML y CSS

CONCLUSION
HAY GRAN VARIEDAD DE FRAMEWORKS PARA PODER TRABAJAR EN EL
DESARROLLO DE PAGINAS WEB UNOS SON MS FACILES DE USAR Y OTRA
UN POCO MAS COMPLICADO Y TODOS TIENE CARACTERISTICAS
DIFERENTES PARA QUE S IMPLEMENTEN EN LA PAGINA WEB Y QUEDE LO
MEJOR QUE SE PUEDA

Bibliografa
(Compass)
Compass. (s.f.). Obtenido de Compass: http://compass-style.org/
(gumby)
gumby. (s.f.). Obtenido de gumby: http://www.webdesigncuba.net/gumbyframework
(Pure)
Pure. (s.f.). Obtenido de Pure: http://purecss.io/
(Toast)
Toast. (s.f.). Obtenido de Toast: http://www.impressivewebs.com/toast-a-simplecss-framework/