Qué se debe incluir en el atributo alt. ¿Qué son los atributos alt y title en WordPress y para qué sirven? Agregar una etiqueta alt

Hola queridos amigos. Hoy, a petición de uno de mis suscriptores, les hablaré sobre la etiqueta ALT (atributo), que debe estar presente en los parámetros de cada imagen del sitio.

La ausencia del atributo alt no aparece externamente en la propia imagen. Pero, internamente, en el código fuente, la ausencia de una etiqueta alt es un error. Y los robots de búsqueda cuentan cada uno de esos errores. Y cosas tan aparentemente pequeñas se ralentizan promoción en buscadores cualquier sitio.

Y si al colocar imágenes en un artículo puedes indicar inmediatamente lo deseado Texto alternativo, luego con imágenes (elementos) de diseño será más difícil. Sucede que estos elementos de diseño particulares carecen de una etiqueta alt. Y muchos principiantes ni siquiera saben de la presencia de estos errores en sus sitios web.

¿Por qué se necesita el atributo alt?

Se trata del mecanismo mediante el cual el navegador carga una página web. Cuando se carga una página, el texto del atributo alt se carga primero y luego el texto se cambia a una imagen. Si la carga de imágenes está deshabilitada en el navegador, en lugar de la imagen habrá texto alternativo (del atributo alt).

Los robots de búsqueda ven la página solo en calidad. código fuente, y la presencia de una etiqueta alt les informa sobre el contenido de la imagen. Por cierto, incluso la presencia de una etiqueta alt sin texto será aceptada por el motor de búsqueda como señal de buena forma. Es decir, la presencia del atributo en sí es obligatoria, pero su valor es opcional.

Alt="valor" !}

Cómo verificar imágenes para el atributo alt

La forma más fácil y accesible para todos es verificar el código fuente de la página (validación de código) en busca de errores.

Para hacer esto, debe abrir el servicio de verificación de código. W3C e ingrese la URL de la página.

Después de verificar el código fuente, página especificada, se abrirá en la pantalla un informe de disponibilidad e información de error (si corresponde). Y si al menos a una imagen de la página le falta una etiqueta alt, verá este error:

Nota: si hay muchos errores, le aconsejo que utilice CTRL+F búsqueda para búsqueda rápida la información necesaria.

Aquí tienes otra forma que te permitirá conocer errores en el código fuente de tu sitio. Pero, para utilizar esta herramienta, es necesario registrarse en la cuenta de webmaster de Bing. Y en esta misma oficina hay una herramienta "Herramientas de análisis SEO".

Donde también ingresa la dirección de la página del sitio para su análisis y recibir un informe. Y si falta una etiqueta en alguna parte alternativo, lo verás.

También puede consultar el código fuente de la página para ver exactamente dónde buscar. Para hacer esto necesitas ir al marcador. "Código de página" y encontrar dónde se cometió el error. Hazlo facil código requerido se resaltará en amarillo.

Cómo encontrar el fragmento de código fuente deseado y agregar el atributo alt

En primer lugar, debe observar de cerca los datos que recibió de las herramientas de análisis. Nota:

- al nombre del archivo de imagen,

— el nombre de la clase, el bloque en el que se encuentra la imagen,

- a elementos adyacentes.

Todos estos elementos ayudarán en el futuro a encontrar el archivo y, en él, el fragmento de código fuente deseado.

Como ejemplo, mire la captura de pantalla de arriba. El código que necesitamos no tiene nada de especial. Sí, sabemos en qué está este banner. nuevo libro gratis azamáta. Además, sabemos que el banner se encuentra en la barra del sitio. Pero imaginemos que no le presté atención. Entonces, ¿qué puedes aprender de este código?

En primer lugar, sabemos el nombre del archivo de imagen. Y no importa que la imagen esté ubicada en otro sitio. También vemos un bloque DIV con una clase.

. Y el hecho de que este bloque está ubicado dentro de una lista, cuyo elemento tiene el identificador id=”text-10″.

Y ya desde la clase "textwidget" queda claro que el código que necesitamos se encuentra en Widgets. Y si es así, entonces de nada sirve buscar todos estos elementos a los que prestamos atención. Ya que en la mayoría temas de WordPress Los widgets en la barra del sitio se generan dinámicamente. Esto significa que en el código del archivo responsable de la barra del sitio ( barra lateral.php) será predominantemente codigo php. Lo cual no apunta a un widget específico de ninguna manera.

Por tanto, vayamos a panel administrativo WordPress- « Apariencia» "Aparatos" y busque el widget deseado.

Y aquí agregamos el atributo alt a los parámetros de la imagen.

Antes Después alt="Infomarketing 20/80" !}/>

Eso es todo. Todo está listo.

Pero con el widget todo está claro, cualquiera puede manejarlo. Qué pasa elementos específicos¿diseño?

Como ejemplo, mostraré la plantilla que estoy usando ahora, solo en su Versión original. Es decir, en la etapa de instalación ya hubo 21 errores (falta el atributo alt).

Abre la pestaña "Código de página" y analizar el código. Buscamos elementos a los que podamos aferrarnos, mediante los cuales podamos encontrar archivo requerido y código.

En los parámetros de búsqueda, debes seleccionar buscar todos los archivos cuyo código contenga una mención del elemento que estás buscando. En nuestro caso, el nombre del archivo de imagen.

A continuación, es mejor hacer Copia de respaldo archivo (cópielo por separado a su computadora) y podrá comenzar a editar. EN Comandante total Simplemente seleccione el archivo y presione F4. O puede copiar el archivo a su computadora y abrirlo usando Notepad++. Bueno, o al menos, a través del Bloc de notas.

Entonces, abra el archivo y busque el código requerido. Puede utilizar CTRL+F para buscar.

Lo encontramos y lo pusimos atributo requerido alt. Así con todas las imágenes que no lo tienen.

Una vez realizados los cambios, guarde el archivo y compruébelo nuevamente con las herramientas de análisis.

Amigos, así es como se agregan los atributos alt a las imágenes. Como ejemplo claro mira el videotutorial. Y recuerda que es mejor hacer todas estas modificaciones de plantilla en

Y por supuesto, lee el artículo al respecto en general. Descubrirás que muchas imágenes de plantilla no sólo no tienen etiquetas alt, sino que no están optimizadas en absoluto.

Y eso es todo para mí hoy. Espero tus comentarios. todo éxito y Que tengas buen humor! Nos vemos en nuevos vídeos y artículos.

Hola gente. Para no hacerle perder el tiempo, seamos breves y directos.

El título de la imagen es la inscripción que aparece cuando pasas el cursor sobre la imagen. Esto es necesario para dar una pista al visitante. Di lo que se muestra en la imagen o dónde buscar.

Imágenes alternativas – desde palabra inglesa alternativa. Es como esto cosa útil, que a los motores de búsqueda les encanta indexar para determinar lo que se muestra. Además, será visible si el usuario desactiva la visualización de imágenes en el navegador. Lo cual no tiene sentido y se hace en casos raros.

Sin embargo, si el usuario desactiva la visualización de contenido gráfico o si ocurre algún tipo de falla por parte de alguien, en lugar de la imagen aparecerá un pequeño ícono con texto. Este texto es el alt de la imagen.

Imágenes alternativas y de título para SEO

Para la imagen del título tiene valor mínimo. No se indexa fácilmente, pero puede favorecerle en términos de factores de comportamiento. Estamos en 2018, SEO ahora significa usabilidad y contenido de calidad. Por tanto, atraer la atención del usuario de cualquier forma.

Piénselo, es más agradable cuando aparece información sobre herramientas en una imagen.

Y aquí fotos alternativas- esto es un tesoro. En primer lugar, GoogleBot considera que su ausencia es un error; Yandex es más leal. En segundo lugar, se indexa fácilmente y dicha imagen termina en la sección "Imágenes" de la búsqueda. Esto significa que de esta manera puedes atraer tráfico adicional a su sitio web.

En tercer lugar, al estar indexado, es posible utilizarlo para aumentar el valor de la página. Sería bueno si escribieras uno extra en alt. solicitud de baja frecuencia. Pero aquí hay que tener cuidado.

Cómo completar correctamente alt y título de las imágenes

Con título todo es mucho más sencillo. No existen reglas para un motor de búsqueda, pero esto no significa que escriba aquí ninguna herejía. Arriba resumimos los factores de comportamiento. Es recomendable que no moleste al usuario, sino que le resulte útil.

1) No debería pasar mucho tiempo. De acuerdo, una pista de 4 líneas provocará rechazo.

2) Debe relacionarse con la imagen de alguna manera.

3) No debe duplicarse con el título principal, los encabezados h1-h5 o los atributos alternativos.

Las imágenes alternativas tienen peso en el motor de búsqueda, por lo que existen restricciones con reglas, pero también hay posibilidades.

1) Una palabra no es suficiente, es recomendable mantenerse dentro del límite de 3 palabras. El número máximo de caracteres es 250.

2) Debe coincidir con el contenido de la imagen.

4) Preferiblemente no se debe repetir con otras alternativas de la página.

Entonces, cuando agregues otra imagen a tu blog, piensa. ¿Quizás alguna persona querrá encontrarla? Intente convertirlo en tráfico adicional.

Dónde completar el alt y el título de las imágenes usando WordPress como ejemplo

Por ejemplo, en WordPress solo necesitas ir desde el panel de control (consola) a la sección "Medios de comunicación""Biblioteca". A continuación, seleccione cualquier imagen.

O, al editar un artículo, simplemente haga clic en cualquier imagen insertada y luego en el lápiz.

Por supuesto, en ejemplo de wordpress Es más fácil de mostrar, pero muchos CMS populares brindan esta oportunidad. Aquí, por ejemplo, está Joomla. ellos tienen su propio rocas submarinas, pero para la mayoría del contenido gráfico puedes configurar alt si presionas "Editar imagen"

Eso es todo. Realmente esperamos haberte sido útiles. Si es así, por favor dale me gusta. ¡Esto nos motiva a crear más contenido interesante y de alta calidad!

Atentamente, Tu Esencia.

Ingrese alt y título

A la hora de promocionar un artículo en un blog o un producto en una tienda online con SEO, las imágenes juegan un papel importante. hay usuarios buscando bienes según el cuadro. Y para que tus productos o blog sean más altos en Resultados de la búsqueda, vale la pena prestar atención a las etiquetas de imágenes. Se trata de sobre alt y título. El éxito en los resultados de búsqueda depende de cómo escribimos alt y title.

¿Qué son las etiquetas? En términos generales, cuando , el motor de búsqueda ve que la imagen del artículo refleja su título y tema. El atributo está dirigido a robots y afecta directamente la clasificación del sitio. Y cuando ingresamos el título, al pasar el cursor sobre la foto, aparece una información sobre herramientas con texto. Si alt está dirigido a los robots del sistema, entonces el título mejora la usabilidad (facilidad de uso del sitio). Si escribimos cuidadosamente el título, es mejor que revelemos el tema tratado en el artículo.

Agregar una etiqueta alt

caracteristica principal de este atributo- influencia significativa en los motores de búsqueda y asistencia para llevar un artículo a la cima de Yandex o Google. leyendo la etiqueta buscador Entiende lo que se muestra en la imagen. Si ingresa alt correctamente, de acuerdo con el tema del artículo, su relevancia aumentará significativamente. Buen bono– los usuarios de la sección Búsqueda de imágenes accederán al sitio. Por eso el uso de la etiqueta alt es especialmente beneficioso para las tiendas online.

¿Para qué más sirve una etiqueta? El caso es que no todos los usuarios disponen de un navegador que carga imágenes. Por varias razones: por ahorro de tráfico, por baja velocidad de conexión o si el propio usuario ha desactivado la visualización de imágenes. En este caso, en lugar de una foto, se muestra descripción del texto, especificado por etiqueta. Ingresar alt es útil para los visitantes sentados con dispositivos móviles tratando de ahorrar tráfico. Su sitio se cargará muchas veces más rápido. Pero es la velocidad de carga del recurso lo que influye significativamente en los factores de comportamiento y en el número de visitantes habituales.

Veamos un ejemplo de reflexión optimización SEO. Elegimos un sitio sobre flores. La siguiente captura de pantalla muestra un atributo de título bien completo, que se analizará en un párrafo aparte.

Cuando pasas el cursor sobre la imagen, aparece un texto emergente: qué flores regalar. Veamos cómo se escribe alt. Presione la combinación de teclas Ctrl+U. Se abre el código del sitio. Ahora presione Ctrl+F para buscar la página. Cuando escribes la frase qué flores comprar, verás una etiqueta alt correctamente completada.

Aquellos. el administrador del sitio se encargó de completar ambas etiquetas, mejorando así tanto la posición en los resultados de búsqueda como los factores de comportamiento. ¿Qué pasa con las clasificaciones? Vayamos a la búsqueda de imágenes de Google. Ingresamos una solicitud sobre qué flores regalar y la primera imagen es del sitio que estamos revisando.

Como puede ver, la optimización de etiquetas funciona muy bien. lo suficientemente informado ingresa alt. ¿Cómo hacerlo?

  • La brevedad es el alma del ingenio. Y bueno Promoción SEO. El número aceptable de palabras es de 3 a 5. El límite de etiquetas es de 250 caracteres.
  • Disponibilidad frase de búsqueda o palabras. Si la frase del título en el texto emergente tiene un mayor impacto en el usuario, entonces la frase alternativa tiene un mayor impacto en el motor de búsqueda. Pero no te excedas con las palabras clave, de lo contrario el robot lo identificará como spam.
  • Como en el caso del título, alt debe escribirse de acuerdo con la imagen de la página.

Cómo escribir una etiqueta de título

El atributo del título no afecta directamente la promoción. Los robots de búsqueda no lo tienen en cuenta a la hora de clasificar un artículo o producto en los resultados de búsqueda. Esencialmente nosotros escribe el titulo opcional. Pero su papel entre los visitantes del sitio es importante, porque mejora la usabilidad del sitio. Cuando pasa el cursor sobre una imagen en un artículo, aparece una información sobre herramientas que revela la esencia de la imagen; de hecho, así es como funciona la etiqueta de título.

¿Cómo escribir el título correctamente?


Este es un ejemplo de buena optimización, ya que la etiqueta alt, de la que hablamos anteriormente, está bien ubicada en el sitio. Si escribes el título correctamente, mejorará el artículo en términos de factores de comportamiento y será una agradable adición a la utilidad del artículo.

Resumamos. La etiqueta alt está diseñada para influir directamente en las clasificaciones de búsqueda y atraer a los robots. La etiqueta de título es opcional, pero es una buena ventaja para la calidad del artículo. Está creado para visitantes.

Para lograr el máximo efecto en la optimización del artículo, recomendamos recurrir a profesionales. Los especialistas en promoción conocen bien el tema y trabajan hábilmente con programas de búsqueda. palabras clave. La amplia experiencia en resolución de problemas juega un papel importante. Como resultado, obtendrá un resultado funcional y su sitio podrá llegar a la cima en los motores de búsqueda.

No sé si usas la búsqueda de imágenes de Google o Yandex, pero puedo decir una cosa: incluso si no la usas, cientos de millones de usuarios de RuNet la usan. considerando lo que figurón tráfico que hemos formado, es recomendable aumentar el número de visitantes del proyecto de Internet aumentando también los visitantes procedentes de búsquedas de imágenes.

Si hablamos de usuarios de motores de búsqueda, normalmente tienen intenciones tanto informativas como comerciales. Independientemente del tipo de recurso que tenga, informativo o comercial, sería bueno para usted atraer uno u otro, y en en el mejor de los casos todos los usuarios posibles. Al menos lucha por ellos.

En la lucha por conseguir visitantes procedentes de búsquedas de imágenes, el atributo ALT nos ayudará. El atributo más importante, cuyo valor radica en lo que dice exactamente buscador sobre lo que se muestra exactamente en la imagen. Al mismo tiempo, el optimizador establece el atributo alt en la forma en que los usuarios lo ingresan en la búsqueda.

Para empezar, tomemos una fotografía cualquiera y, como ejemplo, veamos qué incluir en la etiqueta alt y qué claramente no vale la pena.

  1. "Foto nº 1", o algo así. ¡Así que definitivamente no deberías especificar el atributo alt! Describe la imagen de forma puramente técnica y no revela su contenido en absoluto.
  2. "Niño pequeño con sombrero"- tal descripción, por un lado, describe bien la imagen, pero por otro lado no captura ninguna solicitud significativa, que es completamente inadecuado para proyectos comerciales. Y tampoco lo recomendaría a sitios de información. Lo más probable es que el público busque un sombrero anunciado por un niño pequeño y le hagan la petición de otra forma. Al mismo tiempo, se invita a niños y niñas lindos a sesiones de fotos para aumentar la conversión.
  3. “Gorro de punto”, “gorro de niño”- Estas consultas están cerca del tema. Los usuarios realmente hacen preguntas de esta manera y definitivamente puedes atraer Público objetivo y dirigir su atención a su producto. Sin embargo, hay muchos sombreros. Incluso en su sitio web puede haber una sección dedicada únicamente a gorros infantiles, por lo que es mejor hacer la solicitud algo más específica en aras de que los usuarios sepan exactamente lo que quieren.
  4. "Empresa de gorros de punto"Bizonoff" - esta opción Parece óptimo, ya que refleja fielmente tanto lo que se muestra en la fotografía como satisface al máximo las necesidades de los usuarios. Esta alternativa refleja el nombre de la empresa, la palabra "cap" refleja dimensiones productos (al menos da a entender que estos tamaños no son grandes), así como cómo se fabrica el producto en cuestión. Si en tu tienda online, página de destino o simplemente en un sitio de información, hay un producto estándar con un color diferente. Puede reflejar esto en el atributo alt. "empresa de sombreros de puntoBizonoff marrón".
  5. "Gorro de punto, gorro infantil, reseñas de gorros infantiles, gorro para niño"- Estás inmerso en una “masturbación espiritual”, algo inexplicable. No tendrá sentido hacerlo durante tanto tiempo y la gente lo llama sobreoptimización. Por tales cosas, en el peor de los casos, puede recibir sanciones de los motores de búsqueda. En el mejor de los casos, no habrá sanciones, pero tampoco habrá escape de tales acciones.

Cómo escribir el atributo alt

  1. La longitud del texto en el atributo alt debe tener entre 230 y 250 caracteres. En este caso, la extensión mínima es de 3-4 palabras. Esto se explica por observaciones puramente prácticas: es muy difícil escribir un alt que refleje toda la esencia de lo que se representa en menos de 3 palabras.
  2. El texto debe contener consultas clave mediante el cual los usuarios pueden encontrar la imagen. Es importante comprender que las claves del atributo alt y las claves de la página son cosas diferentes.
  3. No es basura. ¡Muy importante! No agregues las palabras " precio", "costo", "reseñas", "precio"... Estas palabras no caracterizan la foto de ninguna manera si la imagen no muestra una captura de pantalla real de etiquetas de precios, listas de precios y reseñas. Entonces, por supuesto, es posible y necesario.
  4. Tu recurso siempre tiene imagenes tecnicas- iconos, imágenes, flechas, imágenes de fondo etcétera. Para ellos, os aconsejo que no escribáis nada en el atributo alt. Esto mostrará la naturaleza técnica de las imágenes. Algunas personas logran insertar allí palabras clave de la página, pero esto no es hielo. No te metas con robots de búsqueda– son chicos realmente geniales.

Algunas palabras sobre el atributo de título de las imágenes.

Basándonos en nuestros propios experimentos en el campo de la promoción, podemos decir con confianza que el título solo se tiene en cuenta algoritmo de búsqueda Yandex y completamente ignorado por Google. Personalmente, sólo uso el título con fines de usabilidad. Si hablamos de qué escribir en el título, lo inserto de la misma forma que en alt. Esto se explica por el hecho de que escribir algo diferente al texto en viola es simplemente muy, muy difícil. Sí, y se podría decir que no es necesario.

Hoy en día es difícil imaginar sitios web sin imágenes, especialmente tiendas online y catálogos de productos. Despues de todo esto gran manera atraer la atención de los visitantes, mostrar el producto y motivar Clientes potenciales comprometerse acciones específicas: comprar un producto o solicitar un servicio. Puede leer más sobre para qué más se necesitan las imágenes y en qué páginas deben estar en nuestro artículo "Seleccionar y optimizar imágenes para un sitio web".

El uso de imágenes hará que su sitio sea más atractivo y ayudará a mantener a los visitantes en él, pero lo más importante es que puede llegar tráfico adicional a su sitio a partir de búsquedas de imágenes en Yandex o Google (si usa los atributos Alt y Alt correctamente). Etiqueta de título ).

¿Qué es el atributo Alt para las imágenes?

Atributo Alt para imágenes- este es el texto que describe la imagen en la etiqueta html . Se vuelve visible si la imagen no se puede cargar. El texto se mostrará en lugar de la imagen descargada (si el atributo Alt está completo).

Comparemos. Así es como se verá una imagen descargada sin el atributo Alt completado:

Y esto es lo que muestra la imagen con el texto “ Lavadora Slavda WS30T/ET" en el atributo Alt de la etiqueta :

El atributo Alt permite saber qué se muestra en la imagen cuando el usuario no puede verlo. Además, los robots de búsqueda tienen en cuenta el texto escrito en el atributo Alt al indexar el sitio. Finalmente, optimización de los nombres de las imágenes y los atributos Alt en la etiqueta. simplifica la búsqueda de imágenes, por ejemplo, en Yandex o Google Images.

Cómo componer correctamente el atributo Alt para imágenes

  1. El número óptimo de palabras es de 3 a 5, pero la longitud del texto de la etiqueta no supera los 75 a 80 caracteres. Recomendamos que la información sea breve y concisa, pero que vaya al grano.
  2. Un requisito previo es el uso de consultas clave.
  3. Es mejor utilizar palabras clave en caso nominativo para facilitar la búsqueda.
  4. Evite el spam: no recomendamos publicar anuncios un gran número de claves separadas por comas, como en otras etiquetas.
  5. Es necesario que Alt haga referencia al texto de la página y describa lo que se muestra en la imagen.

Atributo de título para imágenes

Además del atributo Alt, también debes incluir texto en el atributo Título. Este parámetro especifica información adicional sobre la imagen cuando el usuario pasa el cursor sobre la imagen:

Rellenado el código html. Título Atributo para las fotos se ve así:

Un atributo de título correctamente compuesto incluso ayuda a mejorar los factores de comportamiento.

Cómo componer correctamente títulos para imágenes

  1. El atributo Título debe coincidir con la imagen. No debes escribir en él algo que no tenga nada que ver con la imagen.
  2. Es mejor utilizar un título corto para comodidad de los usuarios: nadie querrá leer una pista de un kilómetro de longitud sobre la imagen.
  3. Es deseable la presencia de palabras clave. No debes utilizar palabras como “foto”, “imagen”, etc., porque ya está claro de qué se trata.

Un ejemplo de llenado correcto de los atributos Alt y Título de una etiqueta

Veamos un ejemplo de cómo puede ingresar texto en los atributos Alt y Título de una imagen. Para ello, tomemos una imagen del sitio web de una empresa constructora.

En compilando alt Debe concentrarse en lo que vende/ofrece. Para la imagen de nuestro ejemplo, sería preferible componer el alt "Construir una casa a partir de un tronco", en lugar de simplemente "casa" o "construcción".

Atributo de título para de esta imagen Puedes modificarlo un poco y escribirlo así: “Construcción de una casa de troncos”.

Dificultad para completar Alt y Título

Los atributos Alt y Título correctamente completados para las imágenes ayudarán optimización de motores de búsqueda sitio. Pero no te olvides de otros aspectos de la optimización de imágenes, como el “peso”, la calidad y el nombre de las imágenes. Si no tiene tiempo para componer los atributos Alt y Título, podemos ayudarlo y hacer el trabajo por usted.




Arriba