Eliminate links-that-look-like-buttons & buttons-that-look-like-links
Affects | Status | Importance | Assigned to | Milestone | |
---|---|---|---|---|---|
Mahara |
Fix Released
|
Medium
|
Aaron Wells | ||
15.10 |
Fix Released
|
Undecided
|
Unassigned |
Bug Description
Mahara contains quite a few HTML links (<a> tags) that are styled to look like buttons. It may also contain some buttons (<input> tags and <button> tags) that are styled to look like links.
These interfere with our ability to write automated tests, and they're bad for accessibility. As the Mahara accessibility checklist says:
"Use buttons and links consistently.
- Use a link if you're navigating to a predefined page or section (navigation, tabs, etc.)
- Use a button if you're changing information or state (submitting a form, editing or deleting content, searching, etc.)"
From https:/
To facilitate this, we should write a PHP function (and Dwoo tag) that allows you to create a "link button", i.e. a button that, when clicked, simply takes you to a specified URL. Then we can systematically locate all the links-that-
Changed in mahara: | |
milestone: | 15.04.0 → 15.04.1 |
Changed in mahara: | |
milestone: | 15.04.1 → 15.10.0 |
Changed in mahara: | |
status: | Fix Committed → Fix Released |
Possible implementation strategies for a link-button:
1. A wee form with just one input tag in it: <form action=$url><input type="submit" text="text"></form>
Problem: Some of these link buttons are positioned inside of other forms. HTML doesn't allow <form> tags to be nested. This could potentially be workarounded by placing the <form> tag outside the surrounding one and using CSS to make it appear in the right place, but that's complicated (and also bad for accessibility).
2. Javascript on a <button> tag
3. The HTML5 <input formaction="$url"> attribute.
Problem: Need to check which browsers support it.