¿Qué tienen en cuenta los buscadores para valorar la relevancia de las imágenes? Está claro que ni Google ni Bing tienen gente dedicándose a evaluar qué imágenes de tu sitio son más relevantes… ¿Entonces qué es lo que miran?
Básicamente, dos cosas:
- Cómo afectan las imágenes a la velocidad de carga de la web, y
- Si el texto de la imagen es relevante para el contenido de la entrada o página.
Veamos, a continuación, cómo trabajar más eficientemente con las imágenes para sacar el máximo provecho de estas:
Modificar el tamaño de las imágenes
Debido a la facilidad con la que WordPress te permite insertar imágenes en las entradas, es muy tentador arrastrar y soltar las imágenes en la librería multimedia y, luego, seleccionar el tamaño de la imágen en el menú desplegable de Ajustes de Visualización de Adjuntos.
Sin embargo, esta acción no cambia el tamaño de las imágenes, ya que simplemente lo que hace es establecer el tamaño en el que se muestran en la página o entrada correspondiente.
Para el usuario final, el resultado es el mismo, ya que el no cambiar el tamaño de tus imágenes correctamente puede ser la causa de algunos problemas, tales como:
- Debido al uso de tamaños de archivo más grandes de lo necesario, disminución de la velocidad del tiempo de carga del sitio.
- Aumento del ancho de banda consumido, que es un recurso finito.
Afortunadamente WordPress ahora incluye algunas opciones de edición de imágenes que son útiles al insertar imágenes en tus entradas.
Escalar Imagen
Supongamos que tu imagen tiene 1.024 píxeles de ancho, y el tema muestra las entradas con un ancho máximo de 600 píxeles. En este caso esta claro que la imagen que has subido es demasiado grande.
La mejor solución, para asegurarnos que no disminuimos innecesariamente la velocidad de carga y no molestamos a nuestros visitantes con imágenes de calidad pésima, es cambiar el tamaño de la imagen de forma permanente al ancho que toque. Y además no necesitas una herramienta externa para conseguir esto.
Para ello, tras seleccionar o cargar una imagen en la Librería multimedia, haz clic en el enlace Editar para esa imagen en particular.
En la pantalla de edición de imagen, en la opción de Escalar Imagen, simplemente introduce un valor que coincida con el ancho máximo en el que se muestran tus entradas, o algo más pequeño.
WordPress reducirá la imagen de forma proporcionada manteniendo la relación de aspecto intacta.
Recuerda hacer clic en el botón Escala y luego en el botón Guardar para guardar los cambios. Ahora ya puedes insertar de forma segura tu imagen redimensionada en tu entrada sin ralentizar innecesariamente el sitio.
Si prefieres no reducir la imagen, pero cortar una porción de la misma, entonces tienes la opción de recortar la imagén.
Nelio Popups
¡Un plugin fantástico! Es muy fácil crear ventanas emergentes con el editor que ya conoces y las opciones que ofrece están muy bien diseñadas.
Juan Hernando
Recortar Imagen
Si prefieres únicamente mostrar cierto detalle de una imagen en vez de reducirla, también puedes cortarla desde WordPress sin necesidad de hacerlo con una herramienta adicional.
Para recortar una imagen en WordPress, tras subir la imagen, haz otra vez clic en el botón de editar de la imagen y selecciona la parte de imagen que quieres conservar.
Fíjate que además, si mantienes presionada la tecla Mayúsc mientras seleccionas el trozo a conservar, la relación de aspecto de la imagen se mantiene.
Para conservar los cambios, has de hacer clic en el icono de recortar imagen que se encuentra encima de la imagen a la izquierda y, luego, guardar.
Mejorar las Miniaturas
Si está utilizando en tus posts miniaturas (una versión más pequeña de una imagen que enlaza con la versión de tamaño completo) te habrás dado cuenta de que WordPress a veces no las muestra cómo te gustaría. WordPress simplemente utiliza el centro de la imagen de la miniatura, pero no siempre lo más interesante es lo que hay en el centro.
Si quieres mejorar la forma en que WordPress genera miniaturas de las imágenes, tienes la opción de recortar la imagen sólo de Miniatura.
En este caso, asegúrate que has marcado Aplicar cambios a Miniatura antes de hacer clic en el icono de recortar imagen.
De esta forma, al cargar las imágenes, puedes ajustar fácilmente el punto focal de cualquier imagen en miniatura. Es muy fácil de usar y es una funcionalidad que cualquier persona que utiliza miniaturas en WordPress debería aprovechar.
Carga diferida de imágenes
La carga diferida de imágenes consiste en cargar solamente las imágenes o elementos de la página que el visitante puede ver. Si estableces que tus imágenes se carguen de forma diferida, las imágenes restantes se irán cargando automáticamente a medida que el visitante se desplace por la página (habitualmente haciendo scroll vertical).
La principal ventaja de esto es que las webs se cargan más rápido, ya que sólo se cargan las imágenes de la página inmediatamente visibles. Además, se utilizan menos recursos del servidor en tu sitio ya que no se tienen por qué cargar todas las imágenes cuando un usuario llega a una página.
Lo cierto es que hace unos años esta funcionalidad se consideraba un poco molesta para la experiencia del usuario, y en la práctica, las imágenes no solían cargarse con la suficiente rapidez, provocando saltos de página y mostrando titulares de página en blanco. Sin embargo, actualmente esta funcionalidad ha mejorado mucho y es una forma popular para acelerar los tiempos de carga de las webs. En especial, es muy importante tenerlo presente para imágenes animadas o vídeos.
En caso de que te interesase cargar imágenes de forma diferida en tu web, puedes utilizar los siguientes plugins:
Optimización de Imágenes
Adicionalmente, también puedes instalar algún plugin que te ayude a optimizar las imágenes en WordPress. Algunos ejemplos:
Si subes las imágenes a la Librería multimedia, WP Smush reducirá el tamaño del archivo automáticamente. De esta forma ya mejoras los tiempos de carga de la web.
Este plugin incluso te permite optimizar las imágenes que ya tienes en tu Librería multimedia.
Imsanity redimensiona automáticamente las fotos que se carguen o ya estén cargadas que superen las medidas que se hayan indicado.
Cómo describir tus imágenes
Como ya hemos comentado al principio, los buscadores considerarán que una imagen es más o menos relevante si el texto de la imagen es relevante para el contenido de la entrada o página.
Cada vez que cargamos una imagen nos hemos de asegurar que rellenamos los campos descriptivos de dicha imagen.
Por ejemplo, voy a insertar una foto de la WordCamp Europe que se celebró en Sevilla publicada en el artículo Así fue la WordCamp Europa 2015 #WCEU por @DarioBF. Por cierto, aprovecho para recomendaros el artículo Tres Días de WordCamp Europa 2015 de David Aguilera sobre la experiencia.
Tras cargar la imagen, en la Librería de Medios vemos que en Detalles de Adjuntos, tenemos un conjunto de campos por rellenar.
- Título
- Leyenda
- Texto alternativo
- Descripción
Por defecto WordPress rellena el campo Título con el nombre del archivo de la imagen. Este campo sirve para que cuando alguien pasa el ratón sobre la imagen se muestre el texto de ayuda que contiene el título. Aunque este campo no se utiliza directamente para fines de SEO, es una buena idea poblarlo con un texto descriptivo sobre la imagen.
En el ejemplo podríamos poner: «Foto de David Aguilera presentando en la WCEU 2015″.
El siguiente campo es el de Leyenda. El texto introducido aquí se mostrará en la entrada justo debajo de la imagen. Este campo es opcional y tiene sentido cuando uno quiere mostrar información adicional sobre la imagen a los lectores del artículo.
En nuestro ejemplo, podríamos poner «David Aguilera presentando en la WordCamp Europe 2015″.
El texto Alt, o campo de texto alternativo es el más importante aquí y es esencial en términos de buenas prácticas. Este texto es utilizado por Google para determinar lo que representa la imagen. Adicionalmente, este texto es el que se muestra en los navegadores en los que se haya desactivado mostrar imágenes al navegar. Por ejemplo en dispositivos de pantalla pequeña o con conexiones a internet lentas. Pero sobre todo, para todos aquellos que dependen de los lectores de pantalla como los discapacitados visuales. Éste es el texto que escucharán (si, sus navegadores leen) para tener una idea de lo que hay en la imagen. El texto de aquí no debería ser tan elaborado como el título.
Por ejemplo, podríamos poner «David Aguilera en WCEU».
Finalmente, el campo Descripción te brinda la oportunidad de profundizar en el título y proporcionar información más detallada sobre la foto o imagen. Esto puede ser útil para el lector, los motores de búsqueda y cualquier otro servicio de tu web.
Automatización del proceso
Los pasos anteriores son bastante sencillos, pero en algunas ocasiones y cuando se han de cargar muchas imágenes, el proceso ya es un poco más laborioso. Y en especial, cuando en un blog contribuyen varios autores y quieres asegurarte de que todos rellenan los campos, existe un plugin que te puede facilitar el trabajo.
SEO Friendly Images rellena automáticamente el texto alternativo y el título a todas tus imágenes, sobre la base en la que lo hayas configurado.
Las opciones son muy fáciles de configurar y el plugin puede autocompletar las etiquetas de texto alternativo y del título usando el nombre del archivo de la imagen, la categoria de la entrada o las etiquetas de la entrada.
Si bien esto no es tan eficaz como introducir la información a mano, siempre será mejor que dejar los campos vacíos y puede suponer un ahorro de tiempo.
Conclusión
No hay ninguna duda de que añadir imágenes a tus entradas puede realmente mejorar su contenido escrito. Incluso el artículo más interesante y atractivo puede ser enriquecido con fotos o imágenes relevantes. Por lo que vale la pena tomarse el tiempo para incluirlas.
Pero no olvides que siguiendo los consejos descritos en esta entrada, podrás beneficiarte en términos de SEO y rendimiento de la web.
Deja una respuesta