SlideShare une entreprise Scribd logo
1  sur  11
In

ceS
r fa
te

David Ramos Valcárcel david@uvigo.es
Diseño web adaptativo – Responsive design
Uso de HTML y CSS para obtener una
versión que cubre todas las resoluciones

Sacrifica información a favor de diseño
Compleja transición gráfica a código
Prima la importancia de la tipografía
Tendencias: skeumorfismo o diseño plano
Tendencias: formas básicas y minimalistas



Toman importancia formas básicas: cuadrados, círculos, polígonos
Monocromáticos y textos con contraste
https://2012.twitter.com/

https://2012.twitter.com/
Tendencias: colores intensos




Asociados a formas básicas
Pequeñas sombras pueden mejorar usabilidad sin afectar a simplicidad
Sin biselados, degradados, brillos…
Tendencias: Alta resolución HiDPI



Necesidad de adaptarse a altas resoluciones (Retina)
Uso de tipografías, elementos básicos y colores sólidos

http://metaphiziks.com/
Tendencias: Altos contrastes mejora usabilidad


Especial atención a personas con limitaciones visuales
Tendencias: Simplicidad mejora rendimiento


Uso de SVG y Canvas con diseños planos

http://www.aaugh.it/
Tendencias: la tipografía importa

Contenu connexe

En vedette

Ariadna y Perseo
Ariadna y PerseoAriadna y Perseo
Ariadna y Perseo
jerrymont
 
Historia Sistemas Operativos
Historia Sistemas OperativosHistoria Sistemas Operativos
Historia Sistemas Operativos
ramos866
 
CAPITVLVM IX - El perro en la antigüedad
CAPITVLVM IX - El perro en la antigüedadCAPITVLVM IX - El perro en la antigüedad
CAPITVLVM IX - El perro en la antigüedad
Germán González
 
De grammaticis exercitamentis de substantivis cum adiectivis
De grammaticis exercitamentis de substantivis cum adiectivisDe grammaticis exercitamentis de substantivis cum adiectivis
De grammaticis exercitamentis de substantivis cum adiectivis
Óscar Ramos
 
Grammatica de pronomine demonstrativo
Grammatica de pronomine demonstrativoGrammatica de pronomine demonstrativo
Grammatica de pronomine demonstrativo
Óscar Ramos
 
Familiae Romanae Vocabula (II)
Familiae Romanae Vocabula (II)Familiae Romanae Vocabula (II)
Familiae Romanae Vocabula (II)
Óscar Ramos
 
Minimalismo
MinimalismoMinimalismo
Minimalismo
laksmy
 
Teorías del Diseño
Teorías del DiseñoTeorías del Diseño
Teorías del Diseño
karina154
 

En vedette (20)

Latina Proverbia Comenico More Illustrata
Latina Proverbia Comenico More IllustrataLatina Proverbia Comenico More Illustrata
Latina Proverbia Comenico More Illustrata
 
Diseño de formatos
Diseño de formatosDiseño de formatos
Diseño de formatos
 
Tarjetas para Taller Twinspace
Tarjetas para Taller TwinspaceTarjetas para Taller Twinspace
Tarjetas para Taller Twinspace
 
Taller de movie maker live
Taller de movie maker liveTaller de movie maker live
Taller de movie maker live
 
Ariadna y Perseo
Ariadna y PerseoAriadna y Perseo
Ariadna y Perseo
 
Historia Sistemas Operativos
Historia Sistemas OperativosHistoria Sistemas Operativos
Historia Sistemas Operativos
 
Revista minimalismo jenniffer ramos
Revista minimalismo jenniffer ramosRevista minimalismo jenniffer ramos
Revista minimalismo jenniffer ramos
 
Atlas
AtlasAtlas
Atlas
 
Minimalismo
MinimalismoMinimalismo
Minimalismo
 
CAPITVLVM IX - El perro en la antigüedad
CAPITVLVM IX - El perro en la antigüedadCAPITVLVM IX - El perro en la antigüedad
CAPITVLVM IX - El perro en la antigüedad
 
Caps xxvii xxxiii
Caps xxvii xxxiiiCaps xxvii xxxiii
Caps xxvii xxxiii
 
De grammaticis exercitamentis de substantivis cum adiectivis
De grammaticis exercitamentis de substantivis cum adiectivisDe grammaticis exercitamentis de substantivis cum adiectivis
De grammaticis exercitamentis de substantivis cum adiectivis
 
Grammatica de pronomine demonstrativo
Grammatica de pronomine demonstrativoGrammatica de pronomine demonstrativo
Grammatica de pronomine demonstrativo
 
Familiae Romanae Vocabula (II)
Familiae Romanae Vocabula (II)Familiae Romanae Vocabula (II)
Familiae Romanae Vocabula (II)
 
Atridas
AtridasAtridas
Atridas
 
La indumentaria infantil romana
La indumentaria infantil romanaLa indumentaria infantil romana
La indumentaria infantil romana
 
Minimalismo
MinimalismoMinimalismo
Minimalismo
 
Cap 25 gramm
Cap 25 gramm  Cap 25 gramm
Cap 25 gramm
 
Teorías del Diseño
Teorías del DiseñoTeorías del Diseño
Teorías del Diseño
 
Teoria del diseño
Teoria del diseñoTeoria del diseño
Teoria del diseño
 

Plus de ramos866

Presentacion impress v1
Presentacion impress v1Presentacion impress v1
Presentacion impress v1
ramos866
 
Seguridad Web
Seguridad WebSeguridad Web
Seguridad Web
ramos866
 
Presentacion Tm
Presentacion TmPresentacion Tm
Presentacion Tm
ramos866
 
Videodixital Sesion 5 Accesorios
Videodixital Sesion 5 AccesoriosVideodixital Sesion 5 Accesorios
Videodixital Sesion 5 Accesorios
ramos866
 
Videodixital Sesion 6 Herramientas Video Internet
Videodixital Sesion 6 Herramientas Video InternetVideodixital Sesion 6 Herramientas Video Internet
Videodixital Sesion 6 Herramientas Video Internet
ramos866
 
Videodixital Sesion 4 Camaras
Videodixital Sesion 4 CamarasVideodixital Sesion 4 Camaras
Videodixital Sesion 4 Camaras
ramos866
 
Videodixital Sesion 3 Formatos
Videodixital Sesion 3 FormatosVideodixital Sesion 3 Formatos
Videodixital Sesion 3 Formatos
ramos866
 
Videodixital Sesion 2 Conceptos
Videodixital Sesion 2 ConceptosVideodixital Sesion 2 Conceptos
Videodixital Sesion 2 Conceptos
ramos866
 
Videodixital Sesion 1 Introduccion
Videodixital Sesion 1 IntroduccionVideodixital Sesion 1 Introduccion
Videodixital Sesion 1 Introduccion
ramos866
 
Rez Libris
Rez LibrisRez Libris
Rez Libris
ramos866
 
Object Oriented Programming Course
Object Oriented Programming CourseObject Oriented Programming Course
Object Oriented Programming Course
ramos866
 
Cooperative Extension System
Cooperative Extension SystemCooperative Extension System
Cooperative Extension System
ramos866
 
Timeline Of Earth
Timeline Of EarthTimeline Of Earth
Timeline Of Earth
ramos866
 
Prueba Evaluacion Xp 01
Prueba Evaluacion Xp 01Prueba Evaluacion Xp 01
Prueba Evaluacion Xp 01
ramos866
 
Ejercicios Word 01
Ejercicios Word 01Ejercicios Word 01
Ejercicios Word 01
ramos866
 
Ejercicios Word 02
Ejercicios Word 02Ejercicios Word 02
Ejercicios Word 02
ramos866
 
Partes Ordenador
Partes OrdenadorPartes Ordenador
Partes Ordenador
ramos866
 

Plus de ramos866 (20)

Comic2
Comic2Comic2
Comic2
 
Presentacion impress v1
Presentacion impress v1Presentacion impress v1
Presentacion impress v1
 
Seguridad Web
Seguridad WebSeguridad Web
Seguridad Web
 
Presentacion Tm
Presentacion TmPresentacion Tm
Presentacion Tm
 
Videodixital Sesion 5 Accesorios
Videodixital Sesion 5 AccesoriosVideodixital Sesion 5 Accesorios
Videodixital Sesion 5 Accesorios
 
Videodixital Sesion 6 Herramientas Video Internet
Videodixital Sesion 6 Herramientas Video InternetVideodixital Sesion 6 Herramientas Video Internet
Videodixital Sesion 6 Herramientas Video Internet
 
Videodixital Sesion 4 Camaras
Videodixital Sesion 4 CamarasVideodixital Sesion 4 Camaras
Videodixital Sesion 4 Camaras
 
Videodixital Sesion 3 Formatos
Videodixital Sesion 3 FormatosVideodixital Sesion 3 Formatos
Videodixital Sesion 3 Formatos
 
Videodixital Sesion 2 Conceptos
Videodixital Sesion 2 ConceptosVideodixital Sesion 2 Conceptos
Videodixital Sesion 2 Conceptos
 
Videodixital Sesion 1 Introduccion
Videodixital Sesion 1 IntroduccionVideodixital Sesion 1 Introduccion
Videodixital Sesion 1 Introduccion
 
Rez Libris
Rez LibrisRez Libris
Rez Libris
 
Object Oriented Programming Course
Object Oriented Programming CourseObject Oriented Programming Course
Object Oriented Programming Course
 
InSLed
InSLedInSLed
InSLed
 
Cooperative Extension System
Cooperative Extension SystemCooperative Extension System
Cooperative Extension System
 
Timeline Of Earth
Timeline Of EarthTimeline Of Earth
Timeline Of Earth
 
Prueba Evaluacion Xp 01
Prueba Evaluacion Xp 01Prueba Evaluacion Xp 01
Prueba Evaluacion Xp 01
 
Ejercicios PHP
Ejercicios PHPEjercicios PHP
Ejercicios PHP
 
Ejercicios Word 01
Ejercicios Word 01Ejercicios Word 01
Ejercicios Word 01
 
Ejercicios Word 02
Ejercicios Word 02Ejercicios Word 02
Ejercicios Word 02
 
Partes Ordenador
Partes OrdenadorPartes Ordenador
Partes Ordenador
 

Dernier

2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
RigoTito
 
PLAN DE REFUERZO ESCOLAR primaria (1).docx
PLAN DE REFUERZO ESCOLAR primaria (1).docxPLAN DE REFUERZO ESCOLAR primaria (1).docx
PLAN DE REFUERZO ESCOLAR primaria (1).docx
lupitavic
 

Dernier (20)

Sesión de clase: Fe contra todo pronóstico
Sesión de clase: Fe contra todo pronósticoSesión de clase: Fe contra todo pronóstico
Sesión de clase: Fe contra todo pronóstico
 
Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024
 
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docxPLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
 
SEPTIMO SEGUNDO PERIODO EMPRENDIMIENTO VS
SEPTIMO SEGUNDO PERIODO EMPRENDIMIENTO VSSEPTIMO SEGUNDO PERIODO EMPRENDIMIENTO VS
SEPTIMO SEGUNDO PERIODO EMPRENDIMIENTO VS
 
Unidad 3 | Metodología de la Investigación
Unidad 3 | Metodología de la InvestigaciónUnidad 3 | Metodología de la Investigación
Unidad 3 | Metodología de la Investigación
 
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICABIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
 
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptxLA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
 
SELECCIÓN DE LA MUESTRA Y MUESTREO EN INVESTIGACIÓN CUALITATIVA.pdf
SELECCIÓN DE LA MUESTRA Y MUESTREO EN INVESTIGACIÓN CUALITATIVA.pdfSELECCIÓN DE LA MUESTRA Y MUESTREO EN INVESTIGACIÓN CUALITATIVA.pdf
SELECCIÓN DE LA MUESTRA Y MUESTREO EN INVESTIGACIÓN CUALITATIVA.pdf
 
Prueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESOPrueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESO
 
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
 
Tema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdf
Tema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdfTema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdf
Tema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdf
 
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
 
LABERINTOS DE DISCIPLINAS DEL PENTATLÓN OLÍMPICO MODERNO. Por JAVIER SOLIS NO...
LABERINTOS DE DISCIPLINAS DEL PENTATLÓN OLÍMPICO MODERNO. Por JAVIER SOLIS NO...LABERINTOS DE DISCIPLINAS DEL PENTATLÓN OLÍMPICO MODERNO. Por JAVIER SOLIS NO...
LABERINTOS DE DISCIPLINAS DEL PENTATLÓN OLÍMPICO MODERNO. Por JAVIER SOLIS NO...
 
origen y desarrollo del ensayo literario
origen y desarrollo del ensayo literarioorigen y desarrollo del ensayo literario
origen y desarrollo del ensayo literario
 
Feliz Día de la Madre - 5 de Mayo, 2024.pdf
Feliz Día de la Madre - 5 de Mayo, 2024.pdfFeliz Día de la Madre - 5 de Mayo, 2024.pdf
Feliz Día de la Madre - 5 de Mayo, 2024.pdf
 
Interpretación de cortes geológicos 2024
Interpretación de cortes geológicos 2024Interpretación de cortes geológicos 2024
Interpretación de cortes geológicos 2024
 
Power Point: Fe contra todo pronóstico.pptx
Power Point: Fe contra todo pronóstico.pptxPower Point: Fe contra todo pronóstico.pptx
Power Point: Fe contra todo pronóstico.pptx
 
PLAN DE REFUERZO ESCOLAR primaria (1).docx
PLAN DE REFUERZO ESCOLAR primaria (1).docxPLAN DE REFUERZO ESCOLAR primaria (1).docx
PLAN DE REFUERZO ESCOLAR primaria (1).docx
 
PIAR v 015. 2024 Plan Individual de ajustes razonables
PIAR v 015. 2024 Plan Individual de ajustes razonablesPIAR v 015. 2024 Plan Individual de ajustes razonables
PIAR v 015. 2024 Plan Individual de ajustes razonables
 
SEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptx
SEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptxSEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptx
SEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptx
 

Presentacion sonido