184
votes
Accepted
Get users to use the download button instead of right-click save
As soon as the user hovers over the image add an overlay which enables him to hit the download button.
This is just an example, you can make this more subtle but I think it will work good with your ...
123
votes
Accepted
Confusing checkboxes and radio buttons
In a scenario like this I would make the UI reflect the possible states of the application. You can only have one manager so there should only be one place to select a manager, everyone else can ...
106
votes
Confusing checkboxes and radio buttons
Since the change of current Manager is an action invalidating the other options - I would present it in a manner which communicates clear what is about to happen.
Waiter/Chef are Radio-Buttons, so ...
93
votes
Why don't <button> HTML elements have a CSS cursor pointer by default?
Here's why:
Microsoft’s design guides talk about weak affordance:
Text and graphics links use a hand […] pointer […] because of their
weak affordance. While links may have other visual ...
71
votes
Get users to use the download button instead of right-click save
Do not do anything to the right-click. It's an expected behavior on the browser level. You know you shouldn't "hijack" the right-click or you wouldn't call it hijacking.
Provide users with a better ...
60
votes
Accepted
Should disabled elements be focusable for accessibility purposes?
I do work on a professional webapp for visually impaired, screen reader users.
We do user testing regularly, and this has been raised many times during user test sessions that disabled elements that ...
45
votes
Get users to use the download button instead of right-click save
There is a reason why your user is not selecting download button and usability testing is the best way to determine why. However in case it's a matter of positioning the download button in a place a ...
43
votes
Accepted
Why don't <button> HTML elements have a CSS cursor pointer by default?
It's worth considering the historical order in which these things came into being.
Buttons existed from very early in the days of GUI computing. They had a shadowing effect to give a skeuomorphic ...
31
votes
Why don't <button> HTML elements have a CSS cursor pointer by default?
According to W3C cursor:
pointer The cursor is a pointer that indicates a link.
The specification only indicates that links are meant to have the pointer cursor. Buttons are not meant to have the ...
27
votes
What are pros/cons of using buttons instead of plain links to download a document?
Buttons denotes important actions, therefore they are scarce and noticeable.
Links are common, and you may have a lot of them, since they are supposed to take you to an anchor, whether it's on the ...
26
votes
Get users to use the download button instead of right-click save
As a dedicated right-click-save user, I can say that I wouldn't bother with a download button normally, and I'd assume I saved the full version (and be mildly annoyed at the website if I found I hadn'...
21
votes
Confusing checkboxes and radio buttons
This seems like a user grouping task.
Both of these examples have the nice property that you can print out a similar view to display in the kitchen. You also don't have any duplicated / redundant ...
21
votes
Get users to use the download button instead of right-click save
I'd like to point out how Wikipedia does it.
When you enlarge a photo by clicking on it on Wikipedia, you're presented with the photo, some details on it, and an unobtrusive "download" ...
16
votes
Should disabled elements be focusable for accessibility purposes?
This is a bit of a tricky one.
Normally, with regular form elements, it would be best to fully remove anything you can't interact with or serves no purpose.
However, that particular button you're ...
13
votes
Confusing checkboxes and radio buttons
Use this -
This is a higher role view.
In manager's view, the manager won't have a combo-box for his/her role.
The view of other two will be plain text - no combo-boxes.
download bmml source &...
12
votes
Should disabled elements be focusable for accessibility purposes?
As a marginal counterpoint to @Leths, a screenreader lets you get to every object on the page, whether disabled or not, unless they're specifically hidden from the screen reader using aria-hidden=true....
10
votes
Accepted
What is the best way to tell users to scroll down in browsers?
First of all, you should not end a page at blank spaces. You should end them at the top portion of the next page's first section.
Use scroll icons such as this:
to inform the user about the ...
10
votes
What are pros/cons of using buttons instead of plain links to download a document?
So MDN suggests a ... but if someone is downloading a document, why/when should that be the case instead of a plain hyperlink?
Right from your quote:
These bogus href values cause unexpected ...
9
votes
Accepted
Should a blank option always be included in <select> inputs?
As you have suggested, I would recommend in the instance of a required field, that you don't have the "please select" option when the user is "editing" the form.
If this is a ...
9
votes
What are pros/cons of using buttons instead of plain links to download a document?
I like Devin's summary that "buttons denote important actions". I would pair that with a statement that applies more to the current generation of Internet users than yours & mine: "...
7
votes
Accepted
Confused with what to use - List vs Table
Before answering that question, let's try to understand/interpret the scenario in the example image you have provided. Although it may not be the case but it may provide us some direction.
Looking at ...
7
votes
Get users to use the download button instead of right-click save
Lots of good answers but here is a KISS answer. You get the best of both worlds - fast load and render times and expected behavior.
<div style='background-image:url("/path/01-thumb.jpg");...
6
votes
Should disabled elements be focusable for accessibility purposes?
Edit: The logic is that only if an element responds to events it can be focused. However as @Leths comments from his experience this can be detrimental in some cases. So I guess the best thing to do ...
6
votes
Markup vs. Markdown
Markup = HTML, XHTML, XML
Example:
<p> this is a paragraph of text written in HTML </p>
A. A markup language is a language that annotates text so that the computer can manipulate ...
6
votes
What would be best layout for registration form containing 14 input fields.
Like Nick and Carlos stated, best would be to shorten the form and include only what is absolutely necessary.
However, another option would be to group these questions into sections and break them ...
6
votes
Get users to use the download button instead of right-click save
It's difficult to answer this without a visual context of what the flow looks like at the moment, but one way to maybe work around this is to provide a zoom-in function on your image. When the user ...
6
votes
Get users to use the download button instead of right-click save
One option is to size a div to the same size as the thumbnail and use the CSS property background-image to supply the image instead of using the traditional <img> tag. This will make right-...
6
votes
Get users to use the download button instead of right-click save
You could try simply renaming the download button to something that lets the user know they will get a better version:
"Download Hi-Res"
"Download HD image"
"Download full resolution image"
"Download ...
6
votes
Accepted
Semantic Elements and Text Formatting in HTML5
HTML5 consists of structural and presentational elements. Structural elements give meaning to the contents (using semantics) but can also be used as containers for css and javascript (div, span). Pure ...
6
votes
Accepted
What are some cases, if any, where a button element should act as a link?
Since you tagged this with accessibility, I'm answering from that perspective.
No
A link is for navigation and implies the browser's "back" button will take you back to the previous page.
A ...
Only top scored, non community-wiki answers of a minimum length are eligible
Related Tags
html × 341css × 75
website-design × 59
forms × 54
accessibility × 54
tables × 30
usability × 22
gui-design × 21
javascript × 20
input-fields × 18
html5 × 16
design × 12
web-app × 11
input × 11
hyperlinks × 11
navigation × 10
lists × 10
mobile × 9
web × 9
semantics × 9
layout × 8
responsive-design × 8
jquery × 8
email × 7
text × 7