Saltar al contenido

Cómo agregar fácilmente el atributo de título a las imágenes en WordPress

¿Quieres agregar el atributo de título a las imágenes en WordPress? El atributo de título hace que las imágenes en su sitio de WordPress sean más accesibles y amigables con el SEO.

De manera similar al texto alternativo , la etiqueta de título le permite proporcionar información adicional sobre su imagen. Esto ayuda a los lectores de pantalla y a los motores de búsqueda a comprender el contexto de la imagen dentro de su artículo.

En este artículo, le mostraremos cómo agregar fácilmente atributos de título a imágenes en WordPress.

¿Qué es el atributo de título en imágenes?

El atributo de título en imágenes le permite agregar una descripción de texto de su imagen. Esto facilita que los lectores de pantalla y los robots de los motores de búsqueda comprendan la imagen y su contexto.

Le mostraremos algunos ejemplos de código para explicar cómo se usa el atributo de título en HTML. Pero no se preocupe, no necesitaría agregar ningún código HTML a su sitio web.

Normalmente, puede mostrar imágenes con la etiqueta HTML como esta:

<img src = "/ ruta / a / imagen / frutas.jpg" ancho = "100" alto = "100" />

Sin embargo, los rastreadores web, los bots y los dispositivos de lectura de pantalla no pueden ver sus imágenes. Para ayudar a esos dispositivos, puede usar el texto alternativo y el atributo de texto del título en sus imágenes.

Por lo tanto, para ayudar a los motores de búsqueda y a los bots a saber cuáles son sus imágenes, puede agregar un atributo de texto alternativo a su etiqueta de imagen.

El atributo de etiqueta alternativo describe cuál es su imagen y es más importante que el atributo de título. Así es como se ve:

<img src = "/ ruta / a / imagen / frutas.jpg" ancho = "100" alto = "100" alt = "Una canasta de frutas" />

La etiqueta alternativa también se muestra cuando un enlace de imagen está roto, no se encuentra o cuando un navegador no puede cargar imágenes. Verá el pequeño icono de imagen con la etiqueta alternativa al lado.

Leer más  Cómo poner imágenes una al lado de la otra en WordPress (fácilmente)
20201205 6

Para que sea más fácil para los usuarios con lectores de pantalla y necesidades de accesibilidad, también puede agregar un atributo de título a la imagen, como este:

<img src = "/ ruta / a / imagen / frutas.jpg" ancho = "100" alto = "100" alt = "Una canasta de frutas" title = "Canasta de frutas" />

Este atributo de título aparece en una ventana emergente cuando pasa el mouse sobre la imagen. Aquellos que usan software de lectura de pantalla pueden configurar su software para leer este título.

20201205 7

Usar tanto el texto alternativo como el atributo de título ayuda al SEO de su imagen , por lo que puede atraer más tráfico a su sitio desde los motores de búsqueda.

Agregar atributo de título a imágenes en WordPress

WordPress le permite agregar fácilmente texto alternativo y atributos de título dentro del editor de contenido . Primero, vaya a Publicaciones »Agregar nuevo y cree una publicación.

Haga clic en el icono ‘+’ y seleccione el bloque ‘imagen’ para insertar una imagen en su publicación o página.

20201205 8

Se le pedirá que cargue o seleccione una imagen de su biblioteca de medios. Cuando selecciones tu imagen, tendrás la opción de darle un título e ingresar tu texto alternativo.

20201205 9

Importante: este título no es el atributo de título utilizado en HTML. Este es utilizado por WordPress internamente para mostrar sus imágenes en la Biblioteca de medios.

Para agregar el atributo de título real, deberá hacer clic en su imagen para ver la configuración de la imagen en la columna de la derecha.

Ahora haga clic para expandir la pestaña ‘Avanzado’ e ingrese el texto que desea usar para el atributo de título. Escribimos ‘Fruit Basket’ porque eso le dice a Internet cuál es la imagen.

Leer más  Guía para diseñar el complemento de WordPress WP-PageNavi
20201205 10

Ahora, cuando vea su sitio y coloque el mouse sobre la imagen, verá la ventana emergente que dice “Canasta de frutas”.

20201205 7

Agregar atributo de título a las imágenes en el editor clásico de WordPress

Si todavía está utilizando el editor clásico anterior en WordPress, aún puede agregar el atributo de título siguiendo pasos similares.

En el editor clásico , haga clic en el botón ‘Agregar medios’ y luego seleccione su imagen.

20201205 12

Ahora, seleccione la imagen que desea agregar a su publicación o página y complete el campo Texto alternativo y el campo Título.

Tenga en cuenta que WordPress usa este título internamente y no es el atributo del título de la imagen.

20201205 13

Haga clic en el botón ‘Insertar en la publicación’ en la parte inferior de la pantalla y luego verá su imagen en su editor de publicaciones clásico.

20201205 14

Desde allí, haga clic para seleccionar su imagen y luego haga clic en el pequeño icono de lápiz. Esto abrirá la ventana emergente ‘Detalles de la imagen’. Desde aquí, debe hacer clic en el menú desplegable Opciones avanzadas para ingresar su atributo de título de imagen.

20201205 15

No olvide hacer clic en el botón ‘Actualizar’ en la parte inferior, luego guarde su publicación y verifíquela en su navegador. Verá la ventana emergente que muestra el atributo de título de su imagen cuando pase el mouse sobre la imagen.

20201205 16