El elemento nchor <a>
es simplemente un ancla hacia o desde algún contenido. Originalmente, la especificación HTML permitía anclas con nombre (<a name="foo">
) y anclas vinculadas (<a href="#foo">
).
El formato de anclaje con nombre se utiliza con menor frecuencia, ya que el identificador de fragmento ahora se utiliza para especificar un atributo [id]
(aunque para la compatibilidad con versiones anteriores puede especificar atributos [name]
). An <a>
element without an [href]
attribute is still valid.
En cuanto a la semántica y el estilo se refiere, el elemento <a>
no es un enlace (:link
) a menos que tenga un atributo [href]
. Un efecto secundario de esto es que un elemento <a>
sin [href]
no estará en el orden de tabulación de forma predeterminada.
La verdadera pregunta es si el elemento <a>
solo es una representación adecuada de <button>
. En un nivel semántico, hay una clara diferencia entre link
y button
.
Un botón es algo que al hacer clic se produce una acción.
Un enlace es un botón que causa un cambio en la navegación en el documento actual. La navegación que se produce podría moverse dentro del documento en el caso de los identificadores de fragmentos (#foo
) o pasar a un documento nuevo en el caso de las URL (/bar
).
Como los enlaces son un tipo especial de botón, a menudo se han anulado sus acciones para realizar funciones alternativas. Continuar utilizando un ancla como un botón está bien desde un punto de vista de coherencia, aunque no es muy preciso semánticamente.
Si usted está preocupado acerca de la semántica y la accesibilidad de la utilización de un elemento <a>
(o <span>
o <div>
) como un botón, se debe añadir los siguientes atributos:
<a role="button" tabindex="0" ...>...</a>
El button role indica al usuario que el elemento particular se trata como un botón para anular cualquier semántica que el elemento subyacente pueda haber tenido.
Para <span>
y <div>
elementos, es posible que desee añadir detectores clave JavaScript para espacio o Introduzca para lanzar el evento click
. <a href>
y <button>
elementos hacen esto de forma predeterminada, pero los elementos que no son botones no lo hacen. A veces tiene más sentido vincular el activador click
a una clave diferente. Por ejemplo, un botón de "ayuda" en una aplicación web puede estar vinculado a F1.
'href =" # "' He oído hablar de. 'javascript: void (0)' He oído hablar de. Esto que nunca había escuchado hasta ahora, pero parece tener más sentido. Esto es estándar y funciona en la mayoría de los navegadores, ¿verdad? – Zacqary
@Zacqary, '[role =" button "]' no hace nada concreto, aún necesita escuchar el evento click (pero lo haría de todos modos para hacer un botón JS). Está destinado a ser utilizado para navegación asistida (también conocido como lectores de pantalla) para que el lector de pantalla sepa que representa el elemento como un botón en lugar de su valor semántico original. Al agregar '[tabindex]', se agrega el elemento al orden de tabulación. En circunstancias especiales, es posible que en realidad no desee/necesite que el botón sea navegable en el orden de tabulación, por lo que es un atributo opcional. Los elementos que ya son botones no necesitan '[role =" button "]' ya que es redundante. – zzzzBov
¿Es válido HTML para tener una etiqueta de anclaje sin href y sin nombre? En nuestra aplicación, tenemos algunos enlaces de eliminación que están deshabilitados (por lo tanto, no hay atributo href), pero todavía se muestran al usuario. –