Uno de los problemas que me encuentro a diario trabajando con webs de clientes son las imágenes. Es muy habitual encontrarme con:

  • Imágenes con demasiada calidad y tamaño
  • Imágenes con caracteres en el nombre que pueden causar problemas como tildes, eñes, puntos.
  • Nombres de imágenes demasiado largas
  • Nombres de imágenes no optimizadas para SEO

Vamos a ver unos cuantos plugins y herramientas para resolver estos problemas de forma rápida.

Renombrar imágenes en masa

Debes dar un nombre a cada foto que tenga que ver con el contenido de cada post o página para que te ayude con el SEO. Lo óptimo sería dar un nombre diferente a cada imágen, pero también puedes cambiar el nombre de varias fotos a la vez.

  • Si utilizas Windows puedes seleccionar varias imágenes y con el botón derecho seleccionar “Cambiar nombre”.
  • Si utilizas Mac OS existen herramientas como NameChanger que te pueden ayudar con esta tarea.

Ten en cuenta que los nombres solo deben contener, números, letras del alfabeto inglés en minúscula y guiones medios. Cualquier otro caracter no es recomendable.

Renombrar imágenes en WordPress

Media Rename permite renombrar las imágenes una vez que ya están subidas a la web. Esto lo hace sin generar ningún problema ya que también se actualiza el enlace en cada post.

Media File Rename cambia el nombre de las fotografías basándose en el título del post en el que están enlazadas.

WP Sanitize file name Plus esta maravilla de plugin se encarga de quitar todos los caracteres no recomendados al nombre de las imágenes. Por desgracia solo funciona al subir una imagen nueva.

Reducir el tamaño de las imágenes

Las imágenes demasiado grandes generan muchos problemas, el primero y más importante es que van a ralentizar la carga de la web de forma drástica.

Además van a hacer más difícil hacer copias de seguridad de tu web y van a ocupar mucho espacio en tu hosting, espacio que muchas veces es limitado.

Existen varias herramientas para redimensionar las imágenes en masa antes de subirlas a la web, por ejemplo:

Image Resize para equipos con Windows

OSX Image Resizer para equipos con Mac OS

¿Qué tamaño deben tener las imágenes?

Si quieres afinar al máximo, puedes medir el tamaño que van a ocupar en la web utilizando herramientas como Page Ruler (para el navegador Chrome).

Por lo tanto si el ancho máximo de las imágenes es de 600 píxeles puedes redimensionarlas a ese ancho.

Como siempre hay una excepción, las pantallas llamadas “retina” presentes en muchas tablets muestran el doble de píxeles para un mismo ancho. Si quieres que las imágenes se vean perfectas en esas pantallas deberías redimensionarlas al doble del ancho que van a ocupar.

Reducir la calidad de las imágenes

No solo el tamaño importa, también la calidad de la imagen va a repercutir en su “peso”. Se puede reducir la calidad de una imagen sin que lleguemos a percibir esa perdida.

TinyPNG es una herramienta online que permite reducir la calidad de imágenes jpg y png sin que se perciba pérdida de calidad.

Imsanity es un plugin para WordPress que permite establecer un ancho y alto máximo y además permite establecer un porcentaje de compresión. WordPress lo establece en un 90% pero un 60% o un 50% son más recomendables.

WP Smush reduce la calidad de forma segura por lo que es imposible percibir alguna pérdida de calidad.

Acelerar la descarga de imágenes en WordPress

Jetpack contiene una herramienta llamada Photon que se encarga de almacenar todas las imágenes de tu web en un CDN, una red de servidores que mejorará enormemente la velocidad de carga de tu sitio.

Eso es todo, como ves cuesta bastante trabajo que las imágenes estén en perfectas condiciones, pero si de verdad quieres que tu web funcione correctamente es algo que no puedes pasar por alto.

Saludos.