¿Es correcto usar la etiqueta alt para un enlace de anclaje?


124

¿Es correcto usar la etiqueta alt para un enlace de anclaje, algo así como

<a href="#" class="test" alt="Something" src="sfasfs" ></a>

Respuestas:


130

Estas cosas se responden mejor mirando la especificación oficial:

  1. vaya a la especificación: https://www.w3.org/TR/html5/

  2. busque " aelemento": https://www.w3.org/TR/html5/text-level-semantics.html#the-a-element

  3. marque "Atributos de contenido", que enumera todos los atributos permitidos para el aelemento:

    • Atributos globales
    • href
    • target
    • download
    • rel
    • hreflang
    • type
  4. verifique los "Atributos globales" vinculados: https://www.w3.org/TR/html5/dom.html#global-attributes

Como verá, el altatributo no está permitido en el aelemento.
También notarías que el srcatributo tampoco está permitido.

Al validar su HTML , se le informan errores como estos.


Tenga en cuenta que lo anterior es para HTML5 , que es el estándar HTML del W3C de 2014 . En 2016, HTML 5.1 se convirtió en el próximo estándar HTML . Encontrar los atributos permitidos funciona de la misma manera. Vas a ver que el aelemento puede tener otro atributo en HTML 5.1: rev.

Puede encontrar todas las especificaciones HTML (incluido el último estándar) en el estado actual HTML del W3C .


2
No veo el titleatributo en los aatributos globales ¿es correcto usar dicho titleatributo en ao no?
Yousef Altaf

1
@YousefAltaf: ¿En qué página miras? El vinculado, Atributos globales , listas title.
hasta el

Lo obtuve, por lo que aparece en la lista de atributos globales, pero ¿afecta la calidad de la página si la uso o no?
Yousef Altaf

@YousefAltaf: Esa es una pregunta diferente, que mejor no debería discutirse aquí. Consulte su definición . Si aún tiene preguntas al respecto, no dude en crear una pregunta por separado (pero mejor busque antes si aún no se la ha hecho).
hasta el

44
Respuesta marcada como "Cómo buscar atributos HTML". Gracias.
Codebling

59

Para las anclas, debe usar título en su lugar. alt no es un atributo válido de a. Ver http://w3schools.com/tags/tag_a.asp


@FabioPoloni Gracias, he esperado que todos puedan encontrar el siguiente enlace en la página :-)
tomis

Pensé que si alguien no sabía mucho sobre este tema, no lo encontraría ;-)
Fabio Poloni

8
Esta información es correcta en w3schools, pero w3schools no es oficial y no es confiable, vea w3fools.com
Jukka K. Korpela

Thx Guys ... aparte de eso, mi necesidad se basó exclusivamente en los estándares de accesibilidad, así como en negar la sobrecarga de rendimiento. He usado una imagen spirte, al mismo tiempo quería dar el atributo alt, lo que no podía hacer usando imágenes de fondo. En cambio, tengo una solución que ayudó ...
user2067736

1
"título" ya no está en w3schools. Pero puede usar el título, ya que es un atributo global: w3.org/TR/html5/dom.html#global-attributes
rosell.dk

28

"title" se implementa ampliamente en los navegadores. Tratar:

<a href="#" title="hello">asf</a>

3
Así es como debería verse una respuesta en lugar de la respuesta de 10 minutos anterior. Pero esta respuesta también debe tener el enlace: w3schools.com/tags/att_global_title.asp
mikael1000

Estoy de acuerdo en que lo anterior no responde la pregunta, sin embargo, de acuerdo con esto, titlees incorrecto según la especificación HTML5 (aunque la mayoría de los navegadores lo implementarán).
Felwithe

6

No, un altatributo (sería un atributo, no una etiqueta) no está permitido para un aelemento en ninguna especificación HTML o borrador. Y tampoco parece que ningún navegador reconozca que tenga importancia.

Es un poco misterioso por qué la gente intenta usarlo, entonces, pero la explicación probable es que lo están haciendo en forma análoga con el altatributo de imgelementos, esperando ver una "información sobre herramientas" al pasar el mouse. Hay dos cosas mal con esto. Primero, cada elemento tiene sus propios atributos, definidos en las especificaciones de cada elemento. En segundo lugar, la representación de "información sobre herramientas" de los altatributos en algunos navegadores antiguos es / fue un capricho o incluso un error, en lugar de ser algo esperado; altse supone que el atributo se presentará al usuario si y solo si la imagen en sí no se presenta, por cualquier razón.

Para crear una "información sobre herramientas", utilice el titleatributo en su lugar o, mucho mejor, Google para "información sobre herramientas CSS" y utilice información sobre herramientas basada en CSS de su preferencia (se pueden caracterizar como "capas" ocultas que se hacen visibles al pasar el mouse).


¿Cómo uso los enlaces creados mediante programación mediante información sobre herramientas basada en CSS?
Salvador Valencia

6

Debe usar el atributo de título para las etiquetas de anclaje si desea aplicar información descriptiva de manera similar a como lo haría para un atributo alt. El atributo de título es válido en las etiquetas de anclaje y no tiene otro propósito que proporcionar información sobre la página vinculada.

W3C recomienda que el valor del atributo de título debe coincidir con el valor del título del documento vinculado, pero no es obligatorio.

http://www.w3.org/MarkUp/1995-archive/Elements/A.html


Alternativamente, y es probable que sea más beneficioso, puede usar el atributo de accesibilidad ARIA aria-label(que no debe confundirse con aria-labeledby). aria-labelcumple la misma función que el atributo alt para imágenes pero para elementos que no son de imagen e incluye alguna medida de optimización desde que optimiza para lectores de pantalla.

http://www.w3.org/WAI/GL/wiki/Using_aria-label_to_provide_labels_for_objects


Sin embargo, si desea describir una etiqueta de anclaje, generalmente es apropiado usar la etiqueta rel o rev pero está limitada a valores específicos, no deben usarse para descripciones legibles por humanos.

Rel sirve para describir la relación de la página vinculada a la página actual. (por ejemplo, si la página vinculada es la siguiente en una serie lógica, sería rel = next)

El atributo rev es esencialmente la relación inversa del atributo rel. Rev describe la relación de la página actual con la página vinculada.

Puede encontrar una lista de valores válidos aquí: http://microformats.org/wiki/existing-rel-values


5

¡Usé el título y funcionó!

El atributo title da el título del enlace. Con una excepción, es puramente consultivo. El valor es texto. La excepción es para los enlaces de hoja de estilo, donde el atributo de título define conjuntos de hojas de estilo alternativos.

<a class="navbar-brand" href="http://www.alberghierocastelnuovocilento.gov.it/sito/index.php" title="sito dell'Istituto Ancel Keys">A.K.</a>

1

Me sorprende ver todas las respuestas que indican que el uso del altatributo en la aetiqueta no es válido . Esto está absolutamente mal.

HTML no te bloquea usando ningún atributo:

<a your-custom-attribute="value">Any attribute can be used</a>

Si pregunta si es semánticamente correcto usar el altatributo a, le diré:

NO. Se utiliza para establecer la descripción de la imagen <img alt="image description" />.

Es una cuestión de lo que harías con los atributos. Aquí hay un ejemplo:

a::after {
  content: attr(color); /* attr can be used as content */
  display: block;
  color: white;
  background-color: blue;
  background-color: attr(color); /* This won't work */
  display: none;
}
a:hover::after {
  display: block;
}
[hidden] {
  display: none;
}
<a href="#" color="red">Hover me!</a>
<a href="#" color="red" hidden>In some cases, it can be used to hide it!</a>

Nuevamente, si pregunta si es semánticamente correcto usar un atributo personalizado, le diré:

No. Use data-*atributos para su uso semántico.


Vaya, se hizo una pregunta en 2013.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.