View
216
Download
0
Category
Preview:
Citation preview
+
Optimización de imágenes para la WebDirección General de Tecnología de Información
+Introducción
+Introducción
Creación de una jerarquía visual clara
“Lo más importante es lo más prominente”
División en zonas claramente delimitadas
Se aprovechan las convenciones de lectura
La Web es visual, 40% de las personas que navegan en Internet, responden mejor a la información visual que al texto
http://www.webmarketinggroup.co.uk/Blog/why-every-seo-strategy-needs-infographics-1764.aspx
+
¿Por qué optimizar mis imágenes?
+¿Por qué optimizar mis imágenes?
¿Cuánto tiempo espera el usuario a que cargue la página antes de abandonarla? = 2 segundos
http://www.akamai.com/html/about/press/releases/2009/press_091409.html
http://www.nytimes.com/2012/03/01/technology/impatient-web-users-flee-slow-loading-sites.html
Se contribuye a la usabilidad del sitio y se maximiza la experiencia de uso de las personas
Se apoya el ahorro de ancho de banda
+
¿Qué impacto tiene en mis usuarios la optimización de imágenes de mi sitio?
+¿Qué impacto tiene en mis usuarios la optimización de imágenes de mi sitio? Sitios Web lentos generan una percepción de credibilidad
baja en los usuarios
Aplicaciones lentas generan frustración en las personas
Sitios Web rápidos tienen una tasa alta de conversión por parte de usuarios
Sitios Web rápidos generan una percepción de calidad, despiertan mayor interés y atracción por parte de los usuarios
http://www.websiteoptimization.com/speed/tweak/psychology-web-performance/
+
¿Cómo puedo optimizar mis imágenes?
+¿Cómo puedo optimizar mis imágenes?
Utilizando programas como Adobe Photoshop o GIMP
Utilizando herramientas en línea como http://www.splashup.com/splashup/ http://pixlr.com/editor/?loc=es
Configuración de imágenes recomendada 72 dpi, óptimo para Web Calidad a 60% (revisar la pérdida de calidad) Utilizar formatos adecuados de imagen lossless vs lossy(.jpg, .png, .gif) Se recomienda el guardado progresivo de imágenes para la Web
+Portal UV
+Proceso de optimizaciónPhotoshop
+Proceso de optimizaciónGimp
+Medidas y peso de imágenes Photoshop
925 x 320 px 233x320 px
52.9kb 26.3Kb
Gimp
925 x 320 px 233x320 px
26.5kb 14.3Kb
+Recomendaciones
No bajar imágenes o fotografías de Internet
Tomar fotografías con cámaras de buena resolución
Observar que la foto o imagen este enfocada, con buena luz y a cuadro
Verificar que la imagen no tenga alguna marca registrada
Que la imagen logre el objetivo deseado cuidando la composición
+
Optimización de imágenes para la WebDirección General de Tecnología de Información
Recommended