SlideShare a Scribd company logo
1 of 15
Blueprint CSS framework ,[object Object]
Agenda ,[object Object],[object Object],[object Object],[object Object]
 
Propósito  de Blueprint CSS de Blueprint CSS ,[object Object]
Objetivos de Blueprint ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Retículas Blueprint
 
 
 
Implementación de principios tipográficos expertos ,[object Object],[object Object],[object Object]
Arquitectura modular ,[object Object],[object Object]
Herramientas extensiones y plantillas ,[object Object],[object Object]
desventajas ,[object Object],[object Object]
Ventajas ,[object Object],[object Object],[object Object],[object Object]
@ganarce

More Related Content

Similar to Blueprint CSS framework

Herramienta case
Herramienta caseHerramienta case
Herramienta case
wlady512
 
Desarrollo De Software Para Internet
Desarrollo De Software Para InternetDesarrollo De Software Para Internet
Desarrollo De Software Para Internet
samgeo
 
DEBER HOJA DE ESTILO (CSS) blog blogger blogspot
DEBER HOJA DE ESTILO (CSS) blog blogger blogspotDEBER HOJA DE ESTILO (CSS) blog blogger blogspot
DEBER HOJA DE ESTILO (CSS) blog blogger blogspot
LISSYCE
 
Control de Versiones - Uso de CVS en proyectos .NET
Control de Versiones - Uso de CVS en proyectos .NETControl de Versiones - Uso de CVS en proyectos .NET
Control de Versiones - Uso de CVS en proyectos .NET
La Red DBAccess
 
NVU Emilia de León t4_ex1
NVU Emilia de León t4_ex1NVU Emilia de León t4_ex1
NVU Emilia de León t4_ex1
restauracio
 

Similar to Blueprint CSS framework (20)

Framework
FrameworkFramework
Framework
 
Framework
FrameworkFramework
Framework
 
Framework de programacion de paginas web
Framework de programacion de paginas webFramework de programacion de paginas web
Framework de programacion de paginas web
 
Hojas de estilo css
Hojas de estilo cssHojas de estilo css
Hojas de estilo css
 
Framework deber
Framework deberFramework deber
Framework deber
 
Arquitectura frontend para proyectos con preprocesadores CSS
Arquitectura frontend para proyectos con preprocesadores CSSArquitectura frontend para proyectos con preprocesadores CSS
Arquitectura frontend para proyectos con preprocesadores CSS
 
Herramienta case
Herramienta caseHerramienta case
Herramienta case
 
III Meetup WordPress Almería | Framework themes
III Meetup WordPress Almería | Framework themesIII Meetup WordPress Almería | Framework themes
III Meetup WordPress Almería | Framework themes
 
Herramientas del Ciclo de Vida de Prototipos
Herramientas del Ciclo de Vida de PrototiposHerramientas del Ciclo de Vida de Prototipos
Herramientas del Ciclo de Vida de Prototipos
 
Estilos CSS en React.pdf
Estilos CSS en React.pdfEstilos CSS en React.pdf
Estilos CSS en React.pdf
 
Desarrollo De Software Para Internet
Desarrollo De Software Para InternetDesarrollo De Software Para Internet
Desarrollo De Software Para Internet
 
Lanzamiento Visual Studio 2008
Lanzamiento Visual Studio 2008Lanzamiento Visual Studio 2008
Lanzamiento Visual Studio 2008
 
DEBER HOJA DE ESTILO (CSS) blog blogger blogspot
DEBER HOJA DE ESTILO (CSS) blog blogger blogspotDEBER HOJA DE ESTILO (CSS) blog blogger blogspot
DEBER HOJA DE ESTILO (CSS) blog blogger blogspot
 
Manual css-hojas-estilo
Manual css-hojas-estiloManual css-hojas-estilo
Manual css-hojas-estilo
 
"MENUS CSS"
"MENUS CSS""MENUS CSS"
"MENUS CSS"
 
Herramientas case
Herramientas caseHerramientas case
Herramientas case
 
Taller de informatica
Taller de informaticaTaller de informatica
Taller de informatica
 
Control de Versiones - Uso de CVS en proyectos .NET
Control de Versiones - Uso de CVS en proyectos .NETControl de Versiones - Uso de CVS en proyectos .NET
Control de Versiones - Uso de CVS en proyectos .NET
 
NVU Emilia de León t4_ex1
NVU Emilia de León t4_ex1NVU Emilia de León t4_ex1
NVU Emilia de León t4_ex1
 
DISEÑO DE SISTEMAS.pptx
DISEÑO DE SISTEMAS.pptxDISEÑO DE SISTEMAS.pptx
DISEÑO DE SISTEMAS.pptx
 

Recently uploaded

redes informaticas en una oficina administrativa
redes informaticas en una oficina administrativaredes informaticas en una oficina administrativa
redes informaticas en una oficina administrativa
nicho110
 

Recently uploaded (10)

EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptxEVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
 
How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.
 
Buenos_Aires_Meetup_Redis_20240430_.pptx
Buenos_Aires_Meetup_Redis_20240430_.pptxBuenos_Aires_Meetup_Redis_20240430_.pptx
Buenos_Aires_Meetup_Redis_20240430_.pptx
 
investigación de los Avances tecnológicos del siglo XXI
investigación de los Avances tecnológicos del siglo XXIinvestigación de los Avances tecnológicos del siglo XXI
investigación de los Avances tecnológicos del siglo XXI
 
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
 
Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21
 
redes informaticas en una oficina administrativa
redes informaticas en una oficina administrativaredes informaticas en una oficina administrativa
redes informaticas en una oficina administrativa
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 
Guia Basica para bachillerato de Circuitos Basicos
Guia Basica para bachillerato de Circuitos BasicosGuia Basica para bachillerato de Circuitos Basicos
Guia Basica para bachillerato de Circuitos Basicos
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 

Blueprint CSS framework

Editor's Notes

  1. Trabajo con CSS desde el año 1988, cuando comenzamos a implementar CSS en proyectos realizados con DHTML 4, desde entonces nos hemos dado cuenta de la dificultad de mantener y aumentar el código de presentación para adaptarlo a los proyectos que hacemos, manteniendo la documentación del mismo para todos los miembros. Los frameworks son el resultado de la exploración de soluciones más unificadas a este problema, que permitan reunir el conocimiento generado desde la creación de CSS y hacer del proceso inicial de creación del diseño algo mucho más sencillo
  2. -para eliminar las diferencias de interpretación entre los distintos navegadores - este es uno de los aspectos más importantes de blueprint - Producto de la investigación realizada durante muchos años para tratar de conseguir buena tipografía a pesar de las limitaciones del medio - esta es una buena base para crear sistemas de planillas más complejos - pues aunque es un aspecto al que se le presta poca atención es importante es cantidad de casos transaccionales - Un sistema de desarrollo CSS no serviría de nada si no puedes adaptarlo a tu diseño de manera sencilla e integrarlo a tu proceso - Este es un aspecto muy importante de Blueprint, pues generar el CSS con el nivel de adaptabilidad requerido solo es posible porque funciona como un programa que corre bajo RoR
  3. Mucho del trabajo que hacemos comienza por una retícula
  4. La cual refinamos y adaptamos a medida que pasamos por el proceso de arquitectura, diseño e implementación.
  5. La retícula es flexible y permite diseñar de acuerdo al contenido y no limitarse símplemente a llenar una plantilla
  6. - Donde la organización por columnas permite la alineación vertical de elmentos la alineación a una retícula horizontal base permite la coincidencia de todas las lineas de texto y los objetos e sin importar que estén en distintos contenedores. - Herramientas básicas para crear diseños tipográficos más avanzados - Marcado de texto en amarillo, errores de aplicación, notificaciones, todos vienen standard en blueprint y son de facil aplicación
  7. - blueprint realmente no serviría de mucho si no se puediesen agregar estilos adaptados al diseño que se está creando. Su utilidad principal es proveer una base sólida donde construir la programación del look and feel del diseño del proyecto permitiendo dedicarse solo a la programación necesaria especíica al mismo - Hay ejemplos de buenos módulos que se pueden bajar de internet para usar en blueprint. Hay un módulo de tabs, otro de botones y uno de íconos.
  8. - El generador de retículas es un programa Rubi pequeño que permite especificar las características el número de columnas, el ancho y el corondel o espacio entre las mismas. Adicionalmente es aquí donde se pueden incluir CSS adicionales en forma de plugins. La herramienta está muy bien documentada y es fácil de usar. En internet hay páginas donde es posible generar la retícula blueprint sin necesidad de usar rubi, pero este método es más flexible. -La extensiones permiten modificar BLueprint para saltarse algunas limitaciones que ciertos usuarios perciben: su necesidad de trabajar en medidas absolutas (px) y su modo de trabajo no semántico
  9. -Esto ocurre con muchos sistemas que permiten la creación rápida de plantillas , la única forma de evitarlo es inciar la creación fuera de Blueprint, no bosquejar en HTML - Es posible solucionar este tema agregando clases o Id’s semánticos en el código, adicionales a los de blueprint