I use a browser extension that lets me click on clickable elements using the keyboard. It detects buttons and links and form fields etc, and binds a shortcut to them. Notably, the detection behavior here is similar to how screen readers for the visually impaired make sense of web pages.
On the login page, only the activation button gets a shortcut:
Similarly, on the point overview page, nothing is indicated as clickable. On the individual screens though, most elements seem to be.
The difference between clickables and non-clickables is whether they're implemented as <a> or <button> etc or not. Too often, we use <div>s, style them to have the cursor: pointer, and call it a day.
We should consider using semantically appropriate html elements where possible, and add a role attribute where not. This will let browser extensions and screen readers interpret the page as appropriate.
I use a browser extension that lets me click on clickable elements using the keyboard. It detects buttons and links and form fields etc, and binds a shortcut to them. Notably, the detection behavior here is similar to how screen readers for the visually impaired make sense of web pages.
On the login page, only the activation button gets a shortcut:
Similarly, on the point overview page, nothing is indicated as clickable. On the individual screens though, most elements seem to be.
The difference between clickables and non-clickables is whether they're implemented as
<a>
or<button>
etc or not. Too often, we use<div>
s, style them to have thecursor: pointer
, and call it a day.We should consider using semantically appropriate html elements where possible, and add a
role
attribute where not. This will let browser extensions and screen readers interpret the page as appropriate.