Tutorial: Añadir Atributo ALT en todas tus imágenes

Marketing Caribe

Épsilon
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Desde
6 Ene 2020
Mensajes
917
Alt, el atributo HTML que sirve para que la máquina entienda la imagen.
Alt, es el atributo que podemos añadir como etiqueta HTML a las imágenes de nuestras páginas web introduciendo texto de cualquier tipo. Si lo que te estas preguntando es por que extraño motivo habría que añadir a nuestras imágenes contenido, la pregunta es razonable, y la respuesta muy sencilla: para lo único que debe preocuparte el hecho de indicar contenido en el atributo alt de las imágenes de tu web es en el caso de que quieras optimizar las imágenes para posicionamiento, y por tanto, incrementes las posibilidades de que al gente acceda a tu web.

Con ALT ayudamos a Google a posicionar nuestras imágenes
Pero, ¿por que el simple hecho de rellenar los atributos «alt» de nuestras imágenes conseguimos posicionarlas? La explicación es la siguiente. El todopoderoso Señor Google, en según que aspectos no lo es tanto, y hoy por hoy, a pesar de que su inteligencia artificial es capaz de reconocer ciertos aspectos de imágenes y fotos, también es cierto que no puede, aún, descifrar el contenido visual de una imagen. Como seguramente sabrás, Google tiene una pestaña en su buscador de «Imágenes», el principio de dicha pestaña es proporcionar al usuario lo mismo que en el buscador tradicional pero de una forma gráfica y visual. Luego, si introduces en el buscador el nombre de un actor famoso y accedes a la pestaña «imágenes» el buscador semidiós te lo muestra, pero ¿cómo es posible que lo haga si AÚN no puede reconocer las imágenes? pues, efectivamente, lo hace gracias a una etiqueta HTML que hoy nos viene al caso y que se hace llamar «ALT».

Implementando el atributo ALT
El atributo ALT como íbamos diciendo, es un fragmento de código HTML que se introduce dentro de la etiqueta de imagen tradicional [ <img > ] y que se llama así por que es la abreviatura de «alternative text» o «texto alternativo». Como es un atributo se debe de indicar después de la etiqueta principal y su sintaxis es la siguiente: [«alt=contenido» ]. Por tanto lo más habitual es encontrarnos con la siguiente fórmula: [ <img src=»mi imagen» alt=»Una imagen que vale más que mil palabras»> ]. Como veis en el atributo «alt» introducimos contenido explicativo de la imagen y lo bueno es que sea lo más aproximado posible pero tampoco con demasiadas palabras. Lo bueno, si breve, dos veces bueno. En el ejemplo, hemos introducido otro atributo, el «src» que es un elemento obligatorio cuando queremos mostrar imágenes en nuestra web, ya que ahí, entrecomillado, ponemos la ruta digital donde se encuentra la imagen para que los navegadores puedan enseñarlas una vez la web está publicada.

La importancia del atruibuto ALT
Pese a que es un elemento que siempre ha existido no siempre ha tenido la importancia que se lo otorga ahora. Hoy en día que la web disponga de atributos «alt» perfectamente codificados e indexados en el sitio web es un punto indispensable a tener en cuenta en cualquier auditoría de indexabilidad y en caso de encontrar imágenes con los atruibutos «alt» inexistentes o mal codificados, es preciso proceder a su arreglo cuanto antes mejor. El el arte del posicionamiento alberga cantidad de técnicas y el SEO no es hacer algo 100% mejor que los demás, sino hacer 100 cosas un 1% mejor que ellos. En el listado de procedimientos a realizar para optimizar la página web pensando en el posicionamiento, tener bien estructurados los atributos «alt» debe ser de los primeros a tachar.

Si no tienes atributos alt, Google te penaliza
Es una de esas frases que de vez en cuando se oyen de labios de algún iluminado que piensa que Google penaliza hasta por mojar una gamba en un café solo. Pues ¡NO! amigo mío, Google no penaliza si encuentra que los atributos alt de las imágenes de tu página no se han puesto.

Yo que a veces también me creo un SEO le digo a las personas que se encuentran en esa tesitura de equivocación supina, que para que lo entiendan, el hecho de no introducir «alts» en las imágenes no es un error, es un «warning» y hasta parece que se algo y todo.

Cuando digo «warning», me refiero a que las herramientas que nos ayudan a detectar carencias técnicas en nuestras webs para de esta manera poder corregirlas como Semrush, Varvy o Woorank, indican la introducción de los atributos en las imágenes como una recomendación y no como un error grave. Resumiendo, si no pones «alts» en tus imágenes ni subes ni bajas en posicionamiento, pero si por otro lado, sí que lo indicas notarás como la web sube posiciones en los resultados de búsqueda.

Herramientas para saber como están los atributos «alt» de tus imágenes
Como decía antes y como te puedes imaginar existen muchas herramientas que te ayudan a tener al día los atributos de tus imágenes. Las hay gratuitas y de pago y casi todas ofrecen un listado de todas las imágenes que no tienen definido el atributo «alt». Si el presupuesto del proyeto te lo permite, yo soy partidario del uso de Semrush que es una suite online que te lo dice todo del estado de tu web y prácticamente todo, también, del estado de la web de la competencia. Dentro de los warnings de Semrush, podemos encontrar un listado de todas las imágenes que no tienen atributos «alt» con la ruta para saber exactamente de que imagen se trata.

Una herramienta gratuita que me gusta mucho es Varvy SEO Tool. Es rápida y concreta y después de un escaneo de la url que le indiques muestra un informe de del estado básico de la página web donde uno de los puntos son las imágenes y sus atributos «alt».

Una vez identificadas las imágenes que no están bien configuradas podemos ponernos manos a la obra y empezar a realizar las acciones pertinentes para la corrección de las mismas.

Dependiendo de la tecnología utilizada a la hora de crear el sitio web, las tareas de corrección pueden resultar más o menos complejas. Si tu web esta hecha en HTML puro, no te queda otro remedio que ir allí donde se encuentra el código de la etiqueta de la imagen y realizar la corrección pertinente siguiendo la sintaxis que he indicado en este post un poco más arriba.

Si lo que estas utilizando para la gestión de tu página web es un gestor de contenidos como Wordperss, Prestashop o Magento, el método cambia según la herramienta pero el principio es el mismo. Normalmente en el panel de administración de los gestores de contenido existe una sección de «Media» donde podemos indicar los atributos de la imágenes en formato formulario. Uno de los campos, suele ser el de «texto alternativo» y es ahí donde debemos indicar el contenido «alt» de las imágenes de nuestra web.

Como poner atributos ALT en WordPress
Si lo que tienes es una web realizada en WordPress, para poner las atributos «alt» en las imágenes, debes ir al apartado «Medios». Cuando pinchas encima de una imagen, aparecen en la parte derecha de la pantalla una serie de campos que podemos rellenar. Bien, uno de esos campos es el de «Texto Alternativo». Debemos rellenar todas y cada una de las imágenes que tenemos en nuestra biblioteca de medios para que las imágenes de la web estén perfectamente configuradas. Recuerda, intenta ser explicativo de lo que aparece en la imagen, breve, y si puedes añadir alguna palabra clave que te interese para tu proyecto SEO, pues mejor que mejor.

Poner atributos alt automáticamente en woocomerce

El plugin que yo uso en casos excepcionales como éste se llama Auto Image Attributes From Filename With Bulk Updater. Éste sencillo plugin te salvará de tener que ir entrando en todas la imágenes una a una para introducir el atributo «alt».

Añadir atributo alt


Una vez instalado te recomienda que hagas una copia de seguridad, y te permite hacer un escaneo de prueba. Una vez lo tengas claro y ejecutes el escaneo de verdad verás como todos los productos de tu tienda tienen imágenes con «alt» implementado. Bueno, en realidad, todas las imágenes. Te da la opción de respetar los «alt» que ya existan o contrariamente a substituirlos por el nombre del archivo.

El único «pero» que le podemos dar al plugin, es que a veces el escaneo falla y se queda haciendo de forma indeterminada en cualquier momento del proceso. No te preocupes, si te ocurre eso, refresca el navegador (F5) y veras que el escaneo sigue su curso sin necesidad de hacer nada más.

Alt atrbutes from filename


Si las imágenes de tu proyecto no tienen un nombre de archivo identificativo, quizás deberías buscar otro método, pero también es cierto que para Google es mucho mejor que exista algo en el atributo «alt», que nada.

Conclusiones
El atributo «alt» es imprescindible tenerlo bien implementado en todas las imágenes de tu página web si lo que queremos es ganar en posicionamiento. Google no penaliza en absoluto si tenemos imágenes sin atributo «alt» pero si lo tiene en cuenta positivamente si sí que las tiene.

Ten siempre en cuenta mientras estás desarrollando tu web o realizando actualizaciones de ir definiendo los atributos «alt». No cometas el error de irlo dejando por que en menos que canta un gallo te verás en la tesitura de tener que rellenar cientos de «alts» de imagen.

Si te ocurre algo así en un gestor de contenidos como WordPress, ten en cuenta que existe algún plugin y, seguramente, funciones que te permiten automatizar la implantación de los «alt» de imagen de una web en un suspiro.

No olvides que el SEO es la unión de muchas pequeñas acciones para conseguir una única, ser los primeros en Google.
 

Kounde

Beta
Verificación en dos pasos desactivada
¡Usuario con pocos negocios!
Desde
3 Abr 2020
Mensajes
138
Lo ideal es que coja el título de la entrada, no el nombre de la imagen, es decir, si la imagen se llama 597 y el título de la entrada es "Plátanos canarios", no me ayuda en nada.
 

pedro56

Delta
Verificación en dos pasos desactivada
Verificado por Whatsapp
Desde
18 Jun 2013
Mensajes
595
Buen aporte compañero.

No olvides que el SEO es la unión de muchas pequeñas acciones para conseguir una única, ser los primeros en Google.
Correcto!!! hay muchos otros factores importantes a tener en cuenta para posicionar un sitio web.

Saludos!!!
 

Tintex

Curioso
Verificación en dos pasos desactivada
Desde
6 Nov 2014
Mensajes
4
Muchas gracias, me llevo el plugin ya que utilizo varias imagenes en mi web!
 

webo

VIP
Gamma
Diseñador
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
7 Dic 2019
Mensajes
320
Gran aporte con información de mucho valor, probare el plugin... se agradece
 

Arriba