• Ir a navegación principal
  • Ir al contenido principal
  • Ir a la barra lateral primaria

Montando Sites

Recursos y Tutoriales de Desarrollo Web con WordPress y Genesis Framework

  • Empieza aquí
  • Tutoriales

Como Optimizar las Imágenes para Mejorar el SEO de tu WordPress en 2019

14 noviembre, 2018 por Gerber Cucurell

Optimizar las imágenes de tu página web es un factor muy importante para mejorar el posicionamiento. Google cada vez lo tiene mas en cuenta y es una de las razones principales por las que nos penalizan herramientas cómo Google Page Speed Insights. En este artículo veremos algunos trucos sobre cómo hacerlo para WordPress.

Contenidos:
· Que hay que tener en cuenta para optimizar las imágenes para SEO
· Peso de una imagen, conceptos básicos. 
· Como comprimir y reducir imágenes en WordPress
· Photoshop para casos específicos
· Comprimir sin Photoshop
· Optimizar palabras clave


1. Que hay que tener en cuenta para optimizar las imágenes para SEO

Se trabajan dos niveles:

  1. Comprimir y ajustar tamaño de la imagen para reducir la velocidad de carga de la web. De esta forma se evitan fugas de visitas por lentos, cosa que Google valora cada vez mas. 
  2. Trabajar las palabras clave de la imagen para optimizar su indexación en los resultados de imágenes en Google, cosa que también acaba repercutiendo positivamente en el SEO en general de tu web.

2. Peso de una imagen, conceptos básicos. 

2.1. Tamaño de la imagen

El tamaño nunca debe superar los 1920 pixeles de ancho ni los 1080 pixeles de alto. Aún así, estas medias son para reproducir imágenes en una pantalla completa de Full HD, que la mayoría de usuarios no utiliza. Las imágenes se pueden reducir mucho mas dependiendo de las cajas contenedoras de tu página web.  Si estas tienen una anchura máxima de 1080 pixeles, debes reducir tus imágenes a este tamaño.

2.2. Resolución de la imagen

Todas las imágenes de una web tienen que tener la resolución a 72, ni mas ni menos, esto es así y no hay vuelta de hoja.

2.3. Compresión de la imagen

Hay que comprimir al máximo intentando no perder calidad gráfica, pues de cara al usuario, tampoco nos interesa que nuestras imágenes se vean mal.

2.4. Formato

Las imágenes deberían estar en uno de los siguientes formatos: JPG, JPEG, PNG para transparencias o JPEG 2000. Próximamente parece que la tendencia será la de utilizar WebP, que es más ligero, pero por ahora muchos navegadores no tienen soporte para reproducir este formato. Por otro lado el WordPress nativo tampoco acepta este tipo de archivo sin plugins. De momento hay que esperar a ver cómo evoluciona.

INFO: En cualquier caso, para que te hagas una idea, las imágenes no deberían superar los 300 kb (aprox) si tienen mucho color, o los 100 kb (aprox) si tienen fondos blancos uniformes.


3. Qué hay que hacer para comprimir y reducir imágenes en WordPress

En realidad no hay que hacer mucho. Cada vez que se sube una imagen, WordPres crea automáticamente 3 tamaños nuevos ya comprimidos y nos ofrece 4 opciones para seleccionar.  

  • Miniatura
  • Medio
  • Grande
  • Original

Si el theme de tu WordPress está bien programado, el tamaño “Grande” es el que corresponde con el ancho máximo del contenedor de la plantilla y es el que debemos utilizar en la mayoría de casos. WordPress 5.0 selecciona este tamaño automáticamente. 

El tamaño original suele ser mas grande que el tamaño del contenedor de la página web, así que, mejor no utilizarlo, pues estaríamos sobrecargando el sitio web inútilmente.


4. Comprimiendo y reduciendo las imágenes con Photoshop para casos específicos.

Si bien es cierto que WordPress hace muy bien su trabajo, también es verdad que en algunos casos necesitaremos subir las imágenes ya comprimidas, como por ejemplo, cuando utilizamos algún tipo de page builder o cuando estemos trabajando con algún plugin que no nos permite seleccionar las imágenes comprimidas de WordPress. Para hacer esta compresión / reducción lo ideal es utilizar un software de edición de imagen tipo Photoshop.

Para reducir el tamaño: vamos al menú Image -> Image Size, primero ponemos la resolución a 72 y luego definimos el ancho o alto de la imagen. 

Para comprimir de forma rápida: vamos a Guardar Como (formato JPG) y rellenamos el cuadro de diálogo exactamente con los siguientes parámetros (existen otras formas de comprimir en Photoshop, pero esta es la más sencilla y los resultados son suficientes).


5. Comprimir imágenes sin Photoshop

Para los que no tengan Photoshop, existe un plugin de WordPress llamado Smush que comprime todas las imágenes de la página web. Aunque si puedes evitar el uso de plugins para todo, mejor, tendrás menos caos en el panel de administración. Adjunto captura de pantalla de los ajustes aproximados que hay que poner en Smush:

  • En reducción automática, lo ideal es adquirir la versión pro para comprimir las imágenes originales.
  • En redimensionado de imagen, lo ideal es poner el ancho máximo del contenedor de la página web, que es el que coincide con el tamaño “grande” de nuestra plantilla.

6. Mejorar la indexación de las imágenes para Google

Para mejorar la indexación de las imágenes en el buscador hay que tener en cuenta dos parámetros:

6.1. Nombre de la imagen

El nombre de la imagen tiene que ser una descripción de lo que se ve en la foto, utilizando tres o cuatro palabras clave. Hay que tener en cuenta que este nombre será una URL, así que estas palabras tienen que estar separadas por guiones, en minúsculas y sin utilizar preposiciones, ni artículos, ni tildes, ni “ñ”, ni puntos, ni símbolos extraños. 

Por ejemplo: hotel-cinco-estrellas-barcelona.jpeg 

6.2. Atributo alt de la imagen

Es el texto descriptivo que tiene que aparecer si la imagen no puede cargar. También sirve para optimizar la accesibilidad web.

Hay que poner lo mismo que con el nombre de la imagen, es decir, una descripción de qué contiene la foto, pero escribiendo normal: no hacen falta los guiones para separar palabras ni obligación de utilizar minúsculas, etc.

En WordPress 5.0, des del editor Gutenberg, hay que hacer click en la imagen y añadir el texto del Atributo “alt” situado en “Ajustes de imagen”.

En el panel antiguo de WordPress el atributo “alt” se encuentra en el siguiente campo: “Texto Alternativo”

Esto es todo. En verdad son sólo dos cosas que cuando tienes el hábito se hacen muy rápido y los resultados en el posicionamiento se notan. Compruébalo tu mismo.


Contenidos relacionados
100 en Google PageSpeed Insights con WordPress

Archivado en:Imágenes, Optimización Web, SEO, WordPress

Acerca de Gerber Cucurell

Desarrollador Web especializado en WordPress + Genesis Framework, Director de Arte y Técnico Superior en Multimedia Interactiva. Más info…

Barra lateral primaria

Categorías

  • CSS
    • Iconos
    • Menus
    • Retículas y Columnas
  • Genesis Framework
    • Custom Posts
    • Footer
    • Header
    • Imágenes Destacadas
    • Page Template
    • Widgets
  • Javascript
  • SEO
    • 404
    • Imágenes
    • Optimización Web
  • WordPress
    • Admin
    • Campos personalizados
    • Clases CSS
    • Google Fonts
    • Gutenberg
    • PHP
    • Plugins
    • Search
    • Shortcodes
    • Temas de WordPress
    • Traducciones
    • WPML
  • Recursos rápidos
  • Info
  • Aviso Legal
  • Contacto

Usamos cookies para asegurar que te damos la mejor experiencia en nuestra web. Si continúas usando este sitio, asumiremos que estás de acuerdo con ello.Aceptar