Curso de Optimización de Imágenes para la Web

Diseño web

Aprende a optimizar las imágenes de una web o aplicación y mejora rápidamente los resultados del proyecto

Intermedio Medio (de 8 a 20 horas) Precio en promoción 89€ 69€

El Curso de Optimización de Imágenes para la Web te permitirá mejorar rápidamente los resultados de tu proyecto mediante la optimización de las imágenes incluidas en una web o aplicación.

Esta iniciativa está dirigida a todos los que de cualquier manera participen en un proyecto web. Para sacar el máximo provecho de este curso es suficiente con un conocimiento básico en HTML.

Indice de sesiones

Sesión 1 -> Imágenes en la web - El mejor formato según el caso de uso

Sesión 2 -> ¿Mis imágenes necesitan optimización? - Vale!, necesito optimizar mis imágenes

Sesión 3 -> ¿Me puedo fiar de la optimización automatizada? - Optimización y validación de imágenes

Sesión 4 -> Velocidad de carga: Percepción vs Realidad

Sesión 5 -> Mejorar tus conocimientos en Optimización de Imágenes

Imágenes en la web

Las imágenes representan más de un 60% del contenido del tráfico web. Desde los inicios de Internet las hemos tenido presentes, lo curioso es que año tras año el porcentaje y peso está creciendo. También las tenemos presentes en las apps que instalamos en nuestros dispositivos móviles. En esta sesión conoceremos con detalle la importancia que tienen las imágenes para los contenidos de nuestras webs y apps.

El mejor formato según el caso de uso

Una vez tenemos claras las imágenes (y cantidad) para nuestro contenido, debemos poner atención en el formato correcto según el dispositivo. Hay más formatos de lo que creemos, así que vamos a conocerlos e identificar cual es mejor para nuestro caso de uso.

¿Mis imágenes necesitan optimización?

La respuesta corta y rápida es: Sí. Hay varias herramientas para comprobar si nuestras imágenes deben pasar por un proceso de optimización. Veremos herramientas online, las que tenemos disponibles en el navegador. Como las imágenes no sólo son para la web, también veremos herramientas CLI (para poder analizar la imágenes desde la consola) para nuestros proyectos de apps nativas o juegos.

Vale!, necesito optimizar mis imágenes

Ahora que tenemos claro que debemos reducir el peso de las imágenes, vamos a conocer los diferentes codificadores, sus ventajas, inconvenientes, configuración e integración. En esta ocasión veremos cómo crear un workflow de optimización en nuestro entorno de desarrollo, cómo montar nuestro propio optimizador de imágenes en el lado del servidor con soluciones Open Source como Imageflow o Thumbor, y ver los diferentes servicios online que nos ofrecen una API para integrar la optimización de una forma sencilla y transparente.

¿Me puedo fiar de la optimización automatizada?

El equipo de diseño, en cuanto oigan hablar de optimización de imágenes de forma automática, seguro que se van a oponer por miedo a que las imágenes no cumplan con la calidad deseada. Tenemos disponibles herramientas que nos permiten poder implementar tests para poder validar esas compresiones. Conoceremos los diferentes algoritmos de validación, cuales son los que utilizan los compresores más utilizados y cómo integrarlos en nuestros desarrollos.

Optimización y validación de imágenes

Crearemos un entorno de desarrollo para automatizar la optimización de imágenes y su validación. Trabajaremos con un package de node para poder integrarlo con varios de los workflows que utilizamos en el desarrolo de webs modernas. Aprovecharemos esta sesión para crear un bechmark y elegir el optimizador que más se adapte a nuestro desarrollo o producto.

Velocidad de carga: Percepción vs Realidad en la web

Este tema va más allá de la optimización de las imágenes... la percepción del usuario es muy complicada de medir, pero analizaremos diferentes estudios y soluciones para mejorar esa percepción. Vamos a ver las soluciones implementadas por Facebook, Pinterest y Google, así como algunas herramientas que han aparecido con este enfoque, como LQIP loader.

Mejorar tus conocimientos en Optimización de Imágenes

Por último vamos a dedicar una sesión de la formación a ver los diferentes trucos, recursos, documentación y herramientas que debemos conocer para mejorar nuestros conocimientos en optimización de imágenes.

CONTENIDO

Análisis de Rendimiento Web I

Gratis !
Joan León
29:52

Análisis de Rendimiento Web II

Gratis !
Joan León
26:32

Análisis de Rendimiento Web III

Gratis !
Joan León
1:05:37
1:57:56
Este curso está en marcha
En breve deben aparecer más clases en este espacio

CONTENIDO

Análisis de Rendimiento Web I

Gratis !
Joan León
29:52

Análisis de Rendimiento Web II

Gratis !
Joan León
26:32

Análisis de Rendimiento Web III

Gratis !
Joan León
1:05:37
1:57:56
Este curso está en marcha
En breve deben aparecer más clases en este espacio