Maquetacion en los nuevos medios
-
Upload
comunica2-campus-gandia -
Category
Documents
-
view
338 -
download
1
description
Transcript of Maquetacion en los nuevos medios
![Page 1: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/1.jpg)
MAQUETACIÓN
EN LOS NUEVOS MEDIOS
BLAS HERNÁNDEZ PERIS
![Page 2: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/2.jpg)
ANTECEDENTES
01
![Page 3: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/3.jpg)
1ª ETAPA LOS INICIOS
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 4: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/4.jpg)
1993 - 1995
GRANDES
LIMITACIONES
DE VELOCIDAD
SIN
EXPERIENCIA
PREVIA
FALTA DE
CULTURA
GRÁFICA
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 5: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/5.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
RESULTADO
NULA
LEGIBILIDAD
FALTA DE
JERARQUÍAS
POCO
PROFESIONAL
![Page 6: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/6.jpg)
2ª ETAPA EN BUSCA DEL ORDEN
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 7: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/7.jpg)
APARICIÓN DE LAS PRIMERAS RETÍCULAS
ASIMILADAS POR LOS USUARIOS
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 8: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/8.jpg)
ESTANDARIZACIÓN DE LA RESOLUCIÓN
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 9: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/9.jpg)
USO DE ICONOGRAFÍA
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 10: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/10.jpg)
CONTINÚAN LAS
LIMITACIONES
DE VELOCIDAD
CONCEPTO DE USABILIDAD
APARECE LA FIGURA DEL
DISEÑADOR/MAQUETADOR
MULTIMEDIA
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 11: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/11.jpg)
3ª ETAPA INTERACTIVIDAD
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 12: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/12.jpg)
AUMENTA LA VELOCIDAD
DE CONEXIÓN
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 13: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/13.jpg)
MACROMEDIA LANZA FLASH
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 14: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/14.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
EXPLOSIÓN CREATIVA
![Page 15: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/15.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
NUEVOS SISTEMAS DE NAVEGACIÓN
![Page 16: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/16.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
¿ES ACCESIBLE NUESTRO CONTENIDO?
![Page 17: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/17.jpg)
ACCESIBILIDAD / USABILIDAD
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 18: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/18.jpg)
PERFECCIONAMIENTO DE LAS
TÉCNICAS DE MAQUETACIÓN
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 19: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/19.jpg)
2007 APPLE LANZA
EL IPHONE ORIGINAL
Y TODO CAMBIA…
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 20: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/20.jpg)
2008 GOOGLE
LANZA ANDROID
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 21: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/21.jpg)
MOVIL PC
2%
98%
AUMENTAN LOS ACCESOS
DESDE
DISPOSITIVOS
MÓVILES
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 22: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/22.jpg)
COMIENZAN A
APARECER EN
LAS ESTADÍSTICAS
DE NAVEGACIÓN
NUEVAS
RESOLUCIONES
LAS WEBSITES
NO ESTÁN
PREPARADAS
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 23: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/23.jpg)
ERROR EN LA
VISUALIZACIÓN
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 24: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/24.jpg)
ERROR DE USABILIDAD
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 25: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/25.jpg)
ERROR EN LA
ADAPTACIÓN DE
LOS CONTENIDOS
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 26: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/26.jpg)
APP SOLUCIÓN
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 27: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/27.jpg)
DISEÑO DE APLICACIONES OPTIMIZADAS PARA SMARTPHONES
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 28: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/28.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
ALTOS COSTES + DIVERSIDAD
![Page 29: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/29.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 30: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/30.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
.MOBI
SOLUCIÓN
![Page 31: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/31.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
DESARROLLOS ALTERNATIVOS PARA MÓVILES
WWW.URL.COM
WWW.URL.MOBI
![Page 32: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/32.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
ELPAIS.COM/M ELPAIS.COM
![Page 33: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/33.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
2011 COMIENZAN A
APARECER LAS
PRIMERAS
TABLETS
![Page 34: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/34.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
MÁS
FORMATOS
![Page 35: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/35.jpg)
APARICIÓN DE MÚLTIPLES FORMATOS
EN LAS ESTADÍSTICAS DE NAVEGACIÓN
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 36: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/36.jpg)
SITUACIÓN
ACTUAL
02
![Page 37: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/37.jpg)
MÓVIL
TABLET PC
14%
90%
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
MÓVIL
TABLET PC
70%
30%
2012 2015
ESTADÍSTICAS
ACCESO A INTERNET
![Page 38: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/38.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
RESPONSIVE
NUEVA SOLUCIÓN
DESIGN
![Page 39: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/39.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
¿QUÉ ES EL RESPONSIVE DESIGN?
WWW
DISEÑO ADAPTADO
![Page 40: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/40.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
¿CÓMO FUNCIONA?
@media query
![Page 41: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/41.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
@MEDIA QUERY
@media (min-width: xxx px)
![Page 42: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/42.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
¿QUÉ RESULTADOS DA?
![Page 43: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/43.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
¿QUÉ RESULTADOS DA?
http://foodsense.is/
![Page 44: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/44.jpg)
COMPARATIVA
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
Contenidos
a medida
Altos coste
de
producción
Versión por
sistema
operativo
Contenidos
a medida
Altos coste
de producción
y
mantenimiento
Versión por
dispositivo
(resolución)
Contenidos
adaptados
bajos costes
de
producción
Adaptación a
dispositivos
APP WEB MOBILE RESPONSIVE
![Page 45: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/45.jpg)
PLANIFICACIÓN
Y EJECUCIÓN
03
![Page 46: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/46.jpg)
¿QUÉ DEBEMOS TENER
EN CUENTA?
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
USUARIO ACCESO TECNOLOGÍA TARGET DEL USUARIO COMO LOGRARLO
![Page 47: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/47.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
WIREFRAMES LA PLANIFICACIÓN
![Page 48: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/48.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 49: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/49.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
¿CÓMO PODEMOS REALIZAR UN WIRE FRAME?
Procedimiento
manual
Lapiz y papel Cartulinas Posits
Herramientas de
Edición
Photoshop Illustrator Freehand Power point
Aplicaciones para
Wireframes
www.wireframe.cc www.cacoo.com www.powermockup.com www.axure.com
![Page 50: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/50.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
PLANIFICANDO UNA
MAQUETACIÓN MULTIDISPOSITIVO
![Page 51: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/51.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
EJECUCIÓN IMPORTANCIA DE LA
PRESENTACIÓN
![Page 52: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/52.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 53: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/53.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
¿CÓMO MANTENER EL ÁREA
DE PRESENTACIÓN?
![Page 54: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/54.jpg)
http://www.buildwindows.co
m/
ADAPTACIÓN ELÁSTICA
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 55: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/55.jpg)
http://builtwithmomentum.c
om/
RE-ESCALADO
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 56: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/56.jpg)
http://moderngreenhome.com/
ADAPTACIÓN AL ESPACIO
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 57: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/57.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://www.luciopiunti.it/
RE-UBICACIÓN
![Page 58: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/58.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://shinydemos.com/
CAMBIO DE PRESENTACIÓN
![Page 59: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/59.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://www.it.eku.edu/
SIMPLIFICACIÓN
![Page 60: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/60.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
OPTIMIZACIÓN
DE
LA RESOLUCIÓN
![Page 61: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/61.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
![Page 64: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/64.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://www.stoppress.co.nz/
![Page 65: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/65.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
DIFERENCIAS EN
LA NAVEGACIÓN INTERACCIÓN
![Page 66: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/66.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
¿CUÁNTO MIDE UN DEDO? 24X24 PX
32X32 PX
![Page 67: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/67.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
¿CÓMO OPTIMIZAR
LA NAVEGACIÓN?
![Page 68: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/68.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://www.regent-
college.edu/
ADAPTACIÓN
![Page 69: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/69.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://www.williamcsete.com
/
RE-UBICACIÓN
![Page 70: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/70.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://www.bostonglobe.com/
AGRUPACIÓN
![Page 71: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/71.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://cabinetguerin.eu/
RE-DISEÑO DE LA NAVEGACIÓN
![Page 72: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/72.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
ADAPTACIÓN DE LA
INFORMACIÓN EL CONTENIDO
![Page 73: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/73.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
¿CÓMO ADAPTAR EL CONTENIDO?
![Page 74: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/74.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
FUENTE/TIPOGRAFÍA
![Page 75: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/75.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
SELECCIÓN DE LA FUENTE
Elige una fuente
diseñada
para leer en pantalla
![Page 76: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/76.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
SELECCIÓN DE LA FUENTE
No utilices más de tres tipos
de
letra en una misma página
![Page 77: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/77.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
USO DE LA TIPOGRAFÍA
No abuses de las mayúsculas:
dificultan la lectura
![Page 78: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/78.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
USO DE LA TIPOGRAFÍA
Emplea un tamaño de
letra adecuado mínimo 14px
![Page 79: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/79.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
USO DE LA TIPOGRAFÍA
Añade títulos, negritas y
destacados al texto
![Page 80: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/80.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
USO DE LA TIPOGRAFÍA
No justifiques el texto
![Page 81: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/81.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
USO DE IMÁGENES
FACTORES A TENER EN
CUENTA
![Page 82: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/82.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
TAMAÑO DE LA PANTALLA
![Page 83: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/83.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
TAMAÑO DE LA PANTALLA
![Page 84: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/84.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
100% 150% 200% 225%
MDPI NO-RETINA
HDPI RETINA XHDPI
20 PX 30 PX 40 PX 45 PX
DENSIDAD DE LA PANTALLA
![Page 85: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/85.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
REPRESENTACIÓN
IMAGEN DE A 300PX
NO-RETINA RETINA 300PX 300PX
![Page 86: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/86.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
300PX 600 PX
REPRESENTACIÓN
IMAGEN DE A 300 PX
NO-RETINA RETINA
![Page 87: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/87.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
CONVERSORES
http://teehanlax.com.s3.amazonaws.com/files/teehanlax_density_converter.html
![Page 88: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/88.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
CONTENIDOS
MULTIMEDIA FACTORES A TENER EN
CUENTA
![Page 89: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/89.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
TECNOLOGÍA
NO FLASH
SI HTML5
MP4
M4V
WEBM
OGG
OGV
SWF
FLV
![Page 90: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/90.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
CONTROL
DE LA REPRODUCCIÓN
![Page 91: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/91.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
EVITAR LA
REPRODUCCIÓN
INSTANTÁNEA
PERMITIR
EL CONTROL DE
LA REPRODUCCIÓN
![Page 92: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/92.jpg)
TESTEO
04
![Page 93: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/93.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
PRUEBA TU WEB EN TODOS
LOS NAVEGADORES
http://browsershots.org/
http://www.browserling.com/
![Page 94: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/94.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://resizemybrowser.com/
http://mattkersley.com/responsive/
http://www.responsinator.com/
http://screenqueri.es/
REVISA LA
REPRESENTACIÓN
EN MÚLTIPLES
DISPOSITIVOS
![Page 95: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/95.jpg)
INSPIRACIÓN
05
![Page 96: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/96.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://us.illyissimo.com/
![Page 97: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/97.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://www.westerscheldetunn
el.nl/
![Page 98: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/98.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://www.vogue.co.uk
/
![Page 100: Maquetacion en los nuevos medios](https://reader034.fdocuments.co/reader034/viewer/2022050920/548fb5f6b479598d718b4a7a/html5/thumbnails/100.jpg)
Maquetación en los nuevos medios BLAS HERNÁNDEZ PERIS
http://traveloregon.com/