1 / 15

Optimización de imágenes para la Web

Optimización de imágenes para la Web. Direcci ó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

daria
Download Presentation

Optimización de imágenes para la Web

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Optimización de imágenes para la Web Dirección General de Tecnología de Información

  2. Introducción

  3. 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

  4. ¿Por qué optimizar mis imágenes?

  5. ¿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

  6. ¿Qué impacto tiene en mis usuarios la optimización de imágenes de mi sitio?

  7. ¿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/

  8. ¿Cómo puedo optimizar mis imágenes?

  9. ¿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

  10. Portal UV

  11. Proceso de optimizaciónPhotoshop

  12. Proceso de optimizaciónGimp

  13. 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

  14. 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

  15. Optimización de imágenes para la Web Dirección General de Tecnología de Información

More Related