Optimizaci n de im genes para la web
This presentation is the property of its rightful owner.
Sponsored Links
1 / 15

Optimización de imágenes para la Web PowerPoint PPT Presentation


  • 86 Views
  • Uploaded on
  • Presentation posted in: General

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

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.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


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


Introducci n1

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?


Por qu optimizar mis im genes1

¿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?


Qu impacto tiene en mis usuarios la optimizaci n de im genes de mi sitio1

¿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?


C mo puedo optimizar mis im genes1

¿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

Portal UV


Proceso de optimizaci n photoshop

Proceso de optimizaciónPhotoshop


Proceso de optimizaci n gimp

Proceso de optimizaciónGimp


Medidas y peso de im genes

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

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 web1

Optimización de imágenes para la Web

Dirección General de Tecnología de Información


  • Login