Question

I’m creating a web app that has a list of commands that change elements on a single page. The page is 100% dependant on JavaScript. I therefore coded these links as:

<a href="#">Command #1</a>

Doubting that this is semantically correct, I found numerous places stating that I should use a button instead.

This makes sense, but means I have to alter the style of a button to look like a link, which feels hacky. Is this the correct method?

Answer 1

The HTML5 spec is pretty clear in that you shouldn’t use a:

If the a element has an href attribute, then it represents a hyperlink (a hypertext anchor).

The definition of “hyperlink” is:

These are links to other resources […]

So don’t use a for “actions” on your single page web app.

You should go with button or resp. input (I’d say both with type value of button).

If you like to dive into newer HTML5 stuff, take a look at menu and command.

---

Just to be sure: you shouldn’t “enhance” other elements (like span or div) with JS to act like links/buttons. This wouldn’t be accessible without further work, if at all.