SlideShare una empresa de Scribd logo
1 de 8
DISEÑO WEB ADAPTATIVO O
RESPONSIVO
David Stiven Mendieta Barajas
Desarrollo web con Adobe Dreamweaver
Profesora: Luisa Fernanda Franco Pineda
Año 2021
QUE ES EL DISEÑO WEB
RESPONSIVE?
• Se trata de una técnica de diseño web que mediante su el uso de estructuras e
imágenes fluidas, así como de mediaqueries en la hoja de estilos CSS
DISEÑO WEB Y RESPONSIVE
• Consigue adaptar el sitio web para poder visualizarlo en cualquier dispositivo, ya se
trate de ordenadores, portátiles con diferentes resoluciones de pantalla como
tablets smartphones etc.…
IDEA Y PROPÓSITO
• La idea y el propósito del diseño web responsive fue previamente discutida y
descrita por el consorcio W3C en julio del 2008 en su recomendación “Mobile Web
Best Practices” bajo el subtitulo “One Web” …
ORIGEN
• Dicha recomendación, aunque especifica para dispositivos móviles, puntualiza que
esta hecha en el contexto de “One Web”, y que por lo tanto engloba no solo la
experiencia de navegación en dispositivos móviles sino también en dispositivos de
mayor resolución de pantalla como dispositivos de sobremesa
VENTAJAS
• Con solo una versión de HTML y CSS se cubren todas las resoluciones de pantalla ,
es decir, el sitio web creado estará optimizado para todo tipo de dispositivos :
• Pc
• Tablets
• Teléfonos móviles
• Portátiles
MOTIVO DESIGN WEB RESPONSIVE
• Con motivo de la cada vez a tener mayor demanda de dispositivos móviles, la mayor
utilización de estos por parte del usuario medio para visitar todo tipo de sitios web
APARTADOS
• Y sobre todo las expectativas de los motores de búsquedas y los navegadores de
que esto suceda de forma natural, a día de hoy se hace no solo recomendable si no
mas bien impredecible la creación o renovación de sitios web para hacerlos
adaptables

Más contenido relacionado

La actualidad más candente

Mobile inclusive: básicos del responsive design y HTML5
Mobile inclusive: básicos del responsive design y HTML5Mobile inclusive: básicos del responsive design y HTML5
Mobile inclusive: básicos del responsive design y HTML5Carina Novarese
 
Front End & Responsive Web Design | DevFest Merida
Front End & Responsive Web Design | DevFest MeridaFront End & Responsive Web Design | DevFest Merida
Front End & Responsive Web Design | DevFest MeridaLuis Felipe Perez
 
Responsive Web Design: Reinventando el diseño web
Responsive Web Design: Reinventando el diseño webResponsive Web Design: Reinventando el diseño web
Responsive Web Design: Reinventando el diseño webJavier Usobiaga
 
Estandares Web, Accesibilidad y Usabilidad
Estandares Web, Accesibilidad y UsabilidadEstandares Web, Accesibilidad y Usabilidad
Estandares Web, Accesibilidad y Usabilidadricardogil
 
Dreamweaver cnt.tr
Dreamweaver cnt.trDreamweaver cnt.tr
Dreamweaver cnt.trdisseny2d1
 
Mapa conceptual de Diseños Web
Mapa conceptual de Diseños WebMapa conceptual de Diseños Web
Mapa conceptual de Diseños WebEdisonq0891
 
Presentación Multimedia - Responsive vs Adaptive
Presentación Multimedia - Responsive vs AdaptivePresentación Multimedia - Responsive vs Adaptive
Presentación Multimedia - Responsive vs AdaptiveViviana Trujillo
 
Introducción Responsive design
Introducción Responsive designIntroducción Responsive design
Introducción Responsive designEduard Zora
 
Que es un blog
Que es un blogQue es un blog
Que es un blogpitufina02
 
ENSAYO DREANWAVER
ENSAYO DREANWAVERENSAYO DREANWAVER
ENSAYO DREANWAVERguest803786
 

La actualidad más candente (20)

El diseño web
El diseño webEl diseño web
El diseño web
 
Mobile inclusive: básicos del responsive design y HTML5
Mobile inclusive: básicos del responsive design y HTML5Mobile inclusive: básicos del responsive design y HTML5
Mobile inclusive: básicos del responsive design y HTML5
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
Front End & Responsive Web Design | DevFest Merida
Front End & Responsive Web Design | DevFest MeridaFront End & Responsive Web Design | DevFest Merida
Front End & Responsive Web Design | DevFest Merida
 
Responsive Web Design: Reinventando el diseño web
Responsive Web Design: Reinventando el diseño webResponsive Web Design: Reinventando el diseño web
Responsive Web Design: Reinventando el diseño web
 
Estandares Web, Accesibilidad y Usabilidad
Estandares Web, Accesibilidad y UsabilidadEstandares Web, Accesibilidad y Usabilidad
Estandares Web, Accesibilidad y Usabilidad
 
Native vsweb
Native vswebNative vsweb
Native vsweb
 
Dreamweaver cnt.tr
Dreamweaver cnt.trDreamweaver cnt.tr
Dreamweaver cnt.tr
 
Mapa conceptual de Diseños Web
Mapa conceptual de Diseños WebMapa conceptual de Diseños Web
Mapa conceptual de Diseños Web
 
Presentación Multimedia - Responsive vs Adaptive
Presentación Multimedia - Responsive vs AdaptivePresentación Multimedia - Responsive vs Adaptive
Presentación Multimedia - Responsive vs Adaptive
 
Usabilidad
UsabilidadUsabilidad
Usabilidad
 
Taller diseño web responsivo
Taller diseño web responsivoTaller diseño web responsivo
Taller diseño web responsivo
 
Introducción Responsive design
Introducción Responsive designIntroducción Responsive design
Introducción Responsive design
 
Que es un blog
Que es un blogQue es un blog
Que es un blog
 
Tipos de plataforma web
Tipos de plataforma webTipos de plataforma web
Tipos de plataforma web
 
Páginas web (1)
Páginas web (1)Páginas web (1)
Páginas web (1)
 
Word press
Word pressWord press
Word press
 
ENSAYO DREANWAVER
ENSAYO DREANWAVERENSAYO DREANWAVER
ENSAYO DREANWAVER
 
Hist. diseño web
Hist. diseño webHist. diseño web
Hist. diseño web
 
04 Adobe CS Conceptos minimos
04 Adobe CS Conceptos minimos04 Adobe CS Conceptos minimos
04 Adobe CS Conceptos minimos
 

Similar a Video animado diseño web adaptativo o responsivo

Similar a Video animado diseño web adaptativo o responsivo (20)

Que es un diseño web
Que es un diseño webQue es un diseño web
Que es un diseño web
 
Que es un diseño web
Que es un diseño webQue es un diseño web
Que es un diseño web
 
Responsive Design
Responsive Design Responsive Design
Responsive Design
 
Responsive Design - Taller de Diseño av
Responsive Design - Taller de Diseño avResponsive Design - Taller de Diseño av
Responsive Design - Taller de Diseño av
 
Diseño web
Diseño webDiseño web
Diseño web
 
Diseño web
Diseño webDiseño web
Diseño web
 
Diseño Web Adaptativo
Diseño Web AdaptativoDiseño Web Adaptativo
Diseño Web Adaptativo
 
Diferencias Entre El Diseño Web Adaptativo Y Responsive
Diferencias Entre El Diseño Web Adaptativo Y Responsive
Diferencias Entre El Diseño Web Adaptativo Y Responsive
Diferencias Entre El Diseño Web Adaptativo Y Responsive
 
Responsive Design
Responsive DesignResponsive Design
Responsive Design
 
Diseño de web
Diseño de webDiseño de web
Diseño de web
 
desarrolo web adaptativo
desarrolo web adaptativodesarrolo web adaptativo
desarrolo web adaptativo
 
PATRONES DE DISEÑO WEB
PATRONES DE DISEÑO WEBPATRONES DE DISEÑO WEB
PATRONES DE DISEÑO WEB
 
Consejos Prácticos para Mejorar tu Web y Vender Más
Consejos Prácticos para Mejorar tu Web y Vender MásConsejos Prácticos para Mejorar tu Web y Vender Más
Consejos Prácticos para Mejorar tu Web y Vender Más
 
9.aplicaciones web responsive gene xus
9.aplicaciones web responsive gene xus9.aplicaciones web responsive gene xus
9.aplicaciones web responsive gene xus
 
Pdf
PdfPdf
Pdf
 
Presentación Web 2.0 y Estandares
Presentación Web 2.0 y EstandaresPresentación Web 2.0 y Estandares
Presentación Web 2.0 y Estandares
 
Articulo (Responsive Web Desing)
Articulo (Responsive Web Desing)Articulo (Responsive Web Desing)
Articulo (Responsive Web Desing)
 
El diseño responsivo
El diseño responsivoEl diseño responsivo
El diseño responsivo
 
ing.software
ing.softwareing.software
ing.software
 
Trabajo 6
Trabajo 6Trabajo 6
Trabajo 6
 

Video animado diseño web adaptativo o responsivo

  • 1. DISEÑO WEB ADAPTATIVO O RESPONSIVO David Stiven Mendieta Barajas Desarrollo web con Adobe Dreamweaver Profesora: Luisa Fernanda Franco Pineda Año 2021
  • 2. QUE ES EL DISEÑO WEB RESPONSIVE? • Se trata de una técnica de diseño web que mediante su el uso de estructuras e imágenes fluidas, así como de mediaqueries en la hoja de estilos CSS
  • 3. DISEÑO WEB Y RESPONSIVE • Consigue adaptar el sitio web para poder visualizarlo en cualquier dispositivo, ya se trate de ordenadores, portátiles con diferentes resoluciones de pantalla como tablets smartphones etc.…
  • 4. IDEA Y PROPÓSITO • La idea y el propósito del diseño web responsive fue previamente discutida y descrita por el consorcio W3C en julio del 2008 en su recomendación “Mobile Web Best Practices” bajo el subtitulo “One Web” …
  • 5. ORIGEN • Dicha recomendación, aunque especifica para dispositivos móviles, puntualiza que esta hecha en el contexto de “One Web”, y que por lo tanto engloba no solo la experiencia de navegación en dispositivos móviles sino también en dispositivos de mayor resolución de pantalla como dispositivos de sobremesa
  • 6. VENTAJAS • Con solo una versión de HTML y CSS se cubren todas las resoluciones de pantalla , es decir, el sitio web creado estará optimizado para todo tipo de dispositivos : • Pc • Tablets • Teléfonos móviles • Portátiles
  • 7. MOTIVO DESIGN WEB RESPONSIVE • Con motivo de la cada vez a tener mayor demanda de dispositivos móviles, la mayor utilización de estos por parte del usuario medio para visitar todo tipo de sitios web
  • 8. APARTADOS • Y sobre todo las expectativas de los motores de búsquedas y los navegadores de que esto suceda de forma natural, a día de hoy se hace no solo recomendable si no mas bien impredecible la creación o renovación de sitios web para hacerlos adaptables