Ingeniería web

B R U N O P É R E Z G O Z Á L E Z

A L B E R T O S E R N A M A R T Í N

Diseño responsivo y adaptativo

Ingeniería del Software

Grado en Ingeniería de Sonido e Imagen en Telecomunicación

Contenidos

• ¿Por qué es necesario?▫ ¿Qué es la web?

▫ ¿Cuál es el problema?

▫ One web.

• ¿Qué los diferencia?

• Ejemplos.

B . P É R E Z Y A . S E R N A

2

¿Por qué es necesario?• Pregunta clave: ¿Qué es la web?

La web es…

B . P É R E Z Y A . S E R N A

3

¿Por qué es necesario?• Pregunta clave: ¿Qué es la web?

La web será…

B . P É R E Z Y A . S E R N A

4

¿Por qué es necesario?•

B . P É R E Z Y A . S E R N A

5

¿Por qué es necesario?•

B . P É R E Z Y A . S E R N A

6

¿Por qué es necesario?•

B . P É R E Z Y A . S E R N A

7

¿Qué los diferencia?• Diseño responsivo.

▫ Configuraciones predefinidas.

▫ Límites previstos.

▫ <meta name="viewport" content="width=device-width, initial-scale=1.0" />

• Diseño Adaptativo.▫ Se adapta continuamente según la resolución o

tamaño de la ventana.

B . P É R E Z Y A . S E R N A

8

Diseño responsivo y adaptativo

Ejemplos

B . P É R E Z Y A . S E R N A

9

Referencias• Curso Online iDESWEB: «Introducción al Desarrollo

Web».▫ Sergio Luján Mora, Universidad de Alicante.

▫ www.idesweb.es

• W3C: World Wide Web Consorctium.▫ Tim Berners-Lee, Massachusetts Institute of

Technology.

▫ www.w3c.org

B . P É R E Z Y A . S E R N A

10