#109 Trucos para optimizar imágenes para la web

¿Qué tal la semana?

Semana esther

No tan tranquila como la anterior… pero bastante buena.
Webinar NED Pro

Contenido esther

Plantilla para listado de custom post types con campos personalizados y paginación

Semana Nahuai

Reunión Genesis Shapers: desaparición de las cookies y el posible impacto, global styles para Genesis Custom Blocks… sin fecha para el bloque para listar CPTs.

Contenido Nahuai

 3 tutoriales nuevos en Código Genesis de los cuales destaca:

Mostrar los posts favoritos de los suscriptores en WordPress

Tema de la semana:

Nociones básicas:

• Redimensionar 
  • No subir imágenes directamente de cámara de fotos o máxima calidad
• Comprimir
  • Ajustar el nivel de calidad (70-80%)

¿Cuál es el peso ideal de una fotografía para la web?

Formatos:

• JPG
• PNG -> transparencias, escala de grises y pocos colores
• GIF -> escala de grises y animaciones
• WebP -> Reducción de un 30% respecto JPG / soporte del 93% de navegadores
• AVIF -> Reducción de un 50% respecto JPG / soporte del 63% de navegadores

PNG no solo para escala de grises y transparencias. Cualquier imagen con pocos colores es candidata a pesar menos que su contrapartida en JPG (Antonio Laguna)

Programas:

• Photoshop/Lightroom
• Affinity
• Automator (Mac)
• https://squoosh.app/

Plugins de WordPress:

• ShortPixel -> crea una versión WebP que muestra en navegadores compatibles
• EWWW IO
• Smush WP

También hay soluciones por parte de algunos hostings (Siteground, Webempresa…)

Más artículos relacionados:

• https://nbadiola.com/mejores-plugins-wordpress-optimizar-fotografias/

• https://nbadiola.com/15-herramientas-para-optimizar-fotos-web/
  

Novedades

El grupo WP Media (WP Rocket, Imagify y RocketCDN) es adquirido por group.ONE (empresa de hosting).

Tip de la semana

Recursos de diseños creados con CSS:

https://csslayout.io/