SlideShare una empresa de Scribd logo
1 de 8
Ya tengo el diseño,
   y ahora qué?
       Por Eric Menjívar
¿Qué es el modelo de caja?
    El modelo de caja de CSS describe las cajas
rectangulares que son generadas por los elementos
  en la esructura del documento y compuestas de
        acuerdo al modelo de formato visual.
¿Cómo Funciona?
Herramientas a Utilizar
- Komodo Edit
  http://www.activestate.com/komodo_edit/

- Mozilla Firefox
  http://www.mozilla.com

- Web Developer Tool
  https://addons.mozilla.org/en-US/firefox/addon/60

- Firebug
  http://getfirebug.com/
- http://www.toienlinea.com/taller.zip

- http://www.toienlinea.com/taller2.zip

- http://www.toienlinea.com/taller3.zip
Manos a la Obra!!!
¿Preguntas?
Gracias!!! :)



       Twitter: twitter.com/teufelgt
                     Toienlinea.com
                toi@toienlinea.com

Más contenido relacionado

Destacado

Los 7 hábitos para el éxito del erp
Los 7 hábitos para el  éxito del erpLos 7 hábitos para el  éxito del erp
Los 7 hábitos para el éxito del erpEvaluandoSoftware
 
The Role of Intangibles in the Public Sector -A Preliminary Study in Japan
The Role of Intangibles in the Public Sector-A Preliminary Study in JapanThe Role of Intangibles in the Public Sector-A Preliminary Study in Japan
The Role of Intangibles in the Public Sector -A Preliminary Study in JapanSPINTAN
 
111126 0100 accueil cmb_spl_s2_odp 110304 ss i cyr 111129
111126 0100 accueil cmb_spl_s2_odp 110304 ss i cyr 111129111126 0100 accueil cmb_spl_s2_odp 110304 ss i cyr 111129
111126 0100 accueil cmb_spl_s2_odp 110304 ss i cyr 111129epmsite
 
120408千里ニュータウンの近年の年齢階級別人口の推移
120408千里ニュータウンの近年の年齢階級別人口の推移120408千里ニュータウンの近年の年齢階級別人口の推移
120408千里ニュータウンの近年の年齢階級別人口の推移t-yasuhiro
 
Nathaniel isaac f. carvajal
Nathaniel isaac f. carvajalNathaniel isaac f. carvajal
Nathaniel isaac f. carvajalNathan06
 
акция «барнаул читает льва толстого»
акция «барнаул читает льва толстого»акция «барнаул читает льва толстого»
акция «барнаул читает льва толстого»Anna Milyukova
 
Spirit of Macon a christmas gift for the beloved of Sugar Grove Church
Spirit of Macon a christmas gift for the beloved of Sugar Grove ChurchSpirit of Macon a christmas gift for the beloved of Sugar Grove Church
Spirit of Macon a christmas gift for the beloved of Sugar Grove ChurchJohn Mahoney
 
Reward Challenges 2010 2020
Reward Challenges 2010 2020Reward Challenges 2010 2020
Reward Challenges 2010 2020JB-assistance
 
Woonhuis/house, Dronten
Woonhuis/house, Dronten Woonhuis/house, Dronten
Woonhuis/house, Dronten alanocu
 
Admindeproy ii gestión_rh_part1
Admindeproy ii gestión_rh_part1Admindeproy ii gestión_rh_part1
Admindeproy ii gestión_rh_part1climas y edificios
 
Talento_Estefania Navas
Talento_Estefania NavasTalento_Estefania Navas
Talento_Estefania Navasguest662b5b
 

Destacado (17)

Los 7 hábitos para el éxito del erp
Los 7 hábitos para el  éxito del erpLos 7 hábitos para el  éxito del erp
Los 7 hábitos para el éxito del erp
 
Mitosis Flipbook
Mitosis FlipbookMitosis Flipbook
Mitosis Flipbook
 
The Role of Intangibles in the Public Sector -A Preliminary Study in Japan
The Role of Intangibles in the Public Sector-A Preliminary Study in JapanThe Role of Intangibles in the Public Sector-A Preliminary Study in Japan
The Role of Intangibles in the Public Sector -A Preliminary Study in Japan
 
111126 0100 accueil cmb_spl_s2_odp 110304 ss i cyr 111129
111126 0100 accueil cmb_spl_s2_odp 110304 ss i cyr 111129111126 0100 accueil cmb_spl_s2_odp 110304 ss i cyr 111129
111126 0100 accueil cmb_spl_s2_odp 110304 ss i cyr 111129
 
Trabajo
TrabajoTrabajo
Trabajo
 
120408千里ニュータウンの近年の年齢階級別人口の推移
120408千里ニュータウンの近年の年齢階級別人口の推移120408千里ニュータウンの近年の年齢階級別人口の推移
120408千里ニュータウンの近年の年齢階級別人口の推移
 
Nathaniel isaac f. carvajal
Nathaniel isaac f. carvajalNathaniel isaac f. carvajal
Nathaniel isaac f. carvajal
 
акция «барнаул читает льва толстого»
акция «барнаул читает льва толстого»акция «барнаул читает льва толстого»
акция «барнаул читает льва толстого»
 
Diversidad
DiversidadDiversidad
Diversidad
 
Powerpoint
PowerpointPowerpoint
Powerpoint
 
Spirit of Macon a christmas gift for the beloved of Sugar Grove Church
Spirit of Macon a christmas gift for the beloved of Sugar Grove ChurchSpirit of Macon a christmas gift for the beloved of Sugar Grove Church
Spirit of Macon a christmas gift for the beloved of Sugar Grove Church
 
Reward Challenges 2010 2020
Reward Challenges 2010 2020Reward Challenges 2010 2020
Reward Challenges 2010 2020
 
Pat 06-003
Pat 06-003Pat 06-003
Pat 06-003
 
Woonhuis/house, Dronten
Woonhuis/house, Dronten Woonhuis/house, Dronten
Woonhuis/house, Dronten
 
Admindeproy ii gestión_rh_part1
Admindeproy ii gestión_rh_part1Admindeproy ii gestión_rh_part1
Admindeproy ii gestión_rh_part1
 
Garner c12
Garner c12Garner c12
Garner c12
 
Talento_Estefania Navas
Talento_Estefania NavasTalento_Estefania Navas
Talento_Estefania Navas
 

Similar a Presentacion Taller - Ya tengo el diseño y ahora que?

Tecnologías para hacer Arquitectura de Información
Tecnologías para hacer Arquitectura de InformaciónTecnologías para hacer Arquitectura de Información
Tecnologías para hacer Arquitectura de InformaciónRodrigo Ronda
 
Herramientas Educativas
Herramientas EducativasHerramientas Educativas
Herramientas EducativasMiguel Angel
 
Primeros pasos Symfony PHPVigo
Primeros pasos Symfony PHPVigoPrimeros pasos Symfony PHPVigo
Primeros pasos Symfony PHPVigoPHP Vigo
 
Seminario 2+parte wickets
Seminario 2+parte wicketsSeminario 2+parte wickets
Seminario 2+parte wicketsJorge Mahecha
 
Presentacion diseño web con jquery
Presentacion diseño web con jqueryPresentacion diseño web con jquery
Presentacion diseño web con jqueryEutobar
 
Presentacion diseño web con jquery
Presentacion diseño web con jqueryPresentacion diseño web con jquery
Presentacion diseño web con jqueryMejorandola
 
Introducción a Foundation 5
Introducción a Foundation 5Introducción a Foundation 5
Introducción a Foundation 5Cycle-IT
 
Introducción a Foundation 5
Introducción a Foundation 5Introducción a Foundation 5
Introducción a Foundation 5Cycle-IT
 
Guía Practica conexión BD 2021
Guía Practica conexión BD  2021Guía Practica conexión BD  2021
Guía Practica conexión BD 2021lissette_torrealba
 
Uso y aplicacion de herramientas web 2+1 1
Uso y aplicacion de herramientas web 2+1 1Uso y aplicacion de herramientas web 2+1 1
Uso y aplicacion de herramientas web 2+1 1Jefferson-y
 
Webinar interlat apps_2012_carlos_a-perez_españa
Webinar interlat apps_2012_carlos_a-perez_españaWebinar interlat apps_2012_carlos_a-perez_españa
Webinar interlat apps_2012_carlos_a-perez_españaJerilee Dueñas Rengifo
 
Webinar interlat apps_2012_carlos_a-perez_españa
Webinar interlat apps_2012_carlos_a-perez_españaWebinar interlat apps_2012_carlos_a-perez_españa
Webinar interlat apps_2012_carlos_a-perez_españaCommunity Managers Latam
 
APPS Aplicaciones móviles: Construyendo y publicando nuestro primera APPS mul...
APPS Aplicaciones móviles: Construyendo y publicando nuestro primera APPS mul...APPS Aplicaciones móviles: Construyendo y publicando nuestro primera APPS mul...
APPS Aplicaciones móviles: Construyendo y publicando nuestro primera APPS mul...Interlat
 
Herramientas a usar en los Entornos Virtuales de Aprendizajes
Herramientas  a usar en los Entornos Virtuales de AprendizajesHerramientas  a usar en los Entornos Virtuales de Aprendizajes
Herramientas a usar en los Entornos Virtuales de Aprendizajesxcrc
 
Edición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvilEdición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvilMarta Armada
 
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 CSSAlberto Portolés Coscojuela
 

Similar a Presentacion Taller - Ya tengo el diseño y ahora que? (20)

Tecnologías para hacer Arquitectura de Información
Tecnologías para hacer Arquitectura de InformaciónTecnologías para hacer Arquitectura de Información
Tecnologías para hacer Arquitectura de Información
 
Herramientas Educativas
Herramientas EducativasHerramientas Educativas
Herramientas Educativas
 
Primeros pasos Symfony PHPVigo
Primeros pasos Symfony PHPVigoPrimeros pasos Symfony PHPVigo
Primeros pasos Symfony PHPVigo
 
HTML5 y CSS3 ¿Imprescindibles?
HTML5 y CSS3 ¿Imprescindibles?HTML5 y CSS3 ¿Imprescindibles?
HTML5 y CSS3 ¿Imprescindibles?
 
Seminario 2+parte wickets
Seminario 2+parte wicketsSeminario 2+parte wickets
Seminario 2+parte wickets
 
Presentacion diseño web con jquery
Presentacion diseño web con jqueryPresentacion diseño web con jquery
Presentacion diseño web con jquery
 
Presentacion diseño web con jquery
Presentacion diseño web con jqueryPresentacion diseño web con jquery
Presentacion diseño web con jquery
 
Introducción a Foundation 5
Introducción a Foundation 5Introducción a Foundation 5
Introducción a Foundation 5
 
Introducción a Foundation 5
Introducción a Foundation 5Introducción a Foundation 5
Introducción a Foundation 5
 
Guía Practica conexión BD 2021
Guía Practica conexión BD  2021Guía Practica conexión BD  2021
Guía Practica conexión BD 2021
 
HTML5 Warm up!
HTML5 Warm up!HTML5 Warm up!
HTML5 Warm up!
 
Uso y aplicacion de herramientas web 2+1 1
Uso y aplicacion de herramientas web 2+1 1Uso y aplicacion de herramientas web 2+1 1
Uso y aplicacion de herramientas web 2+1 1
 
Webinar interlat apps_2012_carlos_a-perez_españa
Webinar interlat apps_2012_carlos_a-perez_españaWebinar interlat apps_2012_carlos_a-perez_españa
Webinar interlat apps_2012_carlos_a-perez_españa
 
Webinar interlat apps_2012_carlos_a-perez_españa
Webinar interlat apps_2012_carlos_a-perez_españaWebinar interlat apps_2012_carlos_a-perez_españa
Webinar interlat apps_2012_carlos_a-perez_españa
 
APPS Aplicaciones móviles: Construyendo y publicando nuestro primera APPS mul...
APPS Aplicaciones móviles: Construyendo y publicando nuestro primera APPS mul...APPS Aplicaciones móviles: Construyendo y publicando nuestro primera APPS mul...
APPS Aplicaciones móviles: Construyendo y publicando nuestro primera APPS mul...
 
Protostar como framework
Protostar como frameworkProtostar como framework
Protostar como framework
 
Herramientas a usar en los Entornos Virtuales de Aprendizajes
Herramientas  a usar en los Entornos Virtuales de AprendizajesHerramientas  a usar en los Entornos Virtuales de Aprendizajes
Herramientas a usar en los Entornos Virtuales de Aprendizajes
 
Edición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvilEdición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvil
 
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
 
Bootstrap 3.
Bootstrap 3.Bootstrap 3.
Bootstrap 3.
 

Último

Arquitectura moderna nazareth bermudez PSM
Arquitectura moderna nazareth bermudez PSMArquitectura moderna nazareth bermudez PSM
Arquitectura moderna nazareth bermudez PSMNaza59
 
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura ModernaLe Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Modernasofpaolpz
 
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfPresentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfAdrianaCarolinaMoral2
 
diseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddiseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddabuitragoi
 
Espacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesEspacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesespejosflorida
 
Guía de actividades y rúbrica de evaluación - Unidad 3 - Escenario 4 - Rol de...
Guía de actividades y rúbrica de evaluación - Unidad 3 - Escenario 4 - Rol de...Guía de actividades y rúbrica de evaluación - Unidad 3 - Escenario 4 - Rol de...
Guía de actividades y rúbrica de evaluación - Unidad 3 - Escenario 4 - Rol de...MayerlyAscanioNavarr
 
TIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoTIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoWilsonChambi4
 
Normas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratisNormas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratisbrasilyamile
 
Torre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificioTorre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificio2021ArqROLDANBERNALD
 
Diseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasDiseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasRiegosVeracruz
 
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHEAPORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHEgonzalezdfidelibus
 
Geometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de QuerétaroGeometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de QuerétaroJuan Carlos Fonseca Mata
 
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfCERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfasnsdt
 
Proceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoProceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoJorge Fernandez
 
plantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especialplantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especialAndreaMlaga1
 
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfSlaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfslaimenbarakat
 
Brochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdfBrochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdfhellotunahaus
 
Presentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxPresentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxbarbaracantuflr
 

Último (20)

Arquitectura moderna nazareth bermudez PSM
Arquitectura moderna nazareth bermudez PSMArquitectura moderna nazareth bermudez PSM
Arquitectura moderna nazareth bermudez PSM
 
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura ModernaLe Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
 
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfPresentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
 
diseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddiseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidad
 
Espacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesEspacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientes
 
Guía de actividades y rúbrica de evaluación - Unidad 3 - Escenario 4 - Rol de...
Guía de actividades y rúbrica de evaluación - Unidad 3 - Escenario 4 - Rol de...Guía de actividades y rúbrica de evaluación - Unidad 3 - Escenario 4 - Rol de...
Guía de actividades y rúbrica de evaluación - Unidad 3 - Escenario 4 - Rol de...
 
TIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoTIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánico
 
Arte textil: Tejidos artesanos en la frontera hispano-lusa
Arte textil: Tejidos artesanos en la frontera hispano-lusaArte textil: Tejidos artesanos en la frontera hispano-lusa
Arte textil: Tejidos artesanos en la frontera hispano-lusa
 
Normas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratisNormas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratis
 
Torre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificioTorre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificio
 
Diseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasDiseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicas
 
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHEAPORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
 
Geometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de QuerétaroGeometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de Querétaro
 
1.La locomoción de los seres vivos diseño
1.La locomoción de los seres vivos diseño1.La locomoción de los seres vivos diseño
1.La locomoción de los seres vivos diseño
 
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfCERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
 
Proceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoProceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimiento
 
plantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especialplantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especial
 
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfSlaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
 
Brochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdfBrochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdf
 
Presentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxPresentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptx
 

Presentacion Taller - Ya tengo el diseño y ahora que?

Notas del editor