¿Cuándo (y cuándo no) usar una etiqueta de anclaje? | Programar Plus

Interesante pregunta del lector Don Wilson:

Tengo curiosidad por saber tu opinión. ¿Cuándo deberíamos usar etiquetas de anclaje y cuándo deberíamos usar algo más?

Por lo general, he usado la etiqueta `a` generosamente siempre que quería que se pudiera hacer clic en algo. Busqué la definición y parece que estoy usando la etiqueta `a` donde no debe usarse. Miré a través de la fuente de GMail y están usando elementos `div` para la mayoría de sus elementos en los que se puede hacer clic.

Creo que mi uso proviene de escribir HTML desde antes de que Javascript se usara ampliamente para eventos. De todos modos, ahora no estoy seguro de dónde debería trazar la línea para la etiqueta `a`. ¿Cual es tu opinion?

Creo que si vas a poner un href atributo en el ancla que en realidad lo hace algo incluso si JavaScript está deshabilitado, entonces el ancla es la elección correcta. Si la aplicación depende totalmente de JavaScript, todo el comportamiento se adjunta a través de JavaScript, supongo que realmente no importa qué elemento use. Tal vez sea incluso mejor no usar un ancla, ya que el comportamiento probablemente no se parezca a lo que hacen los enlaces de ancla. Sin embargo, probablemente podrías disuadirme de eso. La cuestión es que los anclajes le brindan (“gratis”) muchas de las funciones visuales que desea con un soporte profundo del navegador. Entonces…

Si elige no utilizar enlaces de anclaje para elementos funcionales en los que se puede hacer clic, entonces:

• Utilice cursor: puntero; para que los usuarios obtengan el cursor que parece que puede hacer clic como están acostumbrados.
• Utilice el atributo tabindex en el elemento para que los usuarios del teclado puedan acceder a él.
• Definir :hover, :active, y :focus estilos.

Ver demostración