The Stack Overflow podcast is back! Listen to an interview with our new CEO.
192

Most of the other answers here seem to be focusing on accessibility, which is fine, but is hardly the point. Screen readers are what? Less than 5% of the market for a general website? The reason "Here" and "Click Here" are bad is because they are useless words. They provide no context. This isn't an accessibility issue; it is a usability issue. There's an ...


161

Use icons, they communicate a lot more than colours alone. If you must use colours, simply colour the icons.


144

When links were new (think 1995), designers felt that it was necessarily to let people know that something was a link by saying "here". I'm not sure if it was ever necessary, but it is not necessary now. When people see text formatted as a link, they know it's a link. Using "here" as the link text gives no context (which is especially bad for screen ...


111

As pointed out in comments and other answers, pointer trails were originally "intended for" and "especially useful if you [were] using a liquid crystal display (LCD) screen" in Windows 3.1. LCD monitors at the time were mostly passive-matrix, whose typically slower response times meant your cursor didn't have time to get redrawn as it moved across the ...


103

There is no problem to work as a UX/UI designer, as choosing color is just a minor part of the usability process. There are lots of other activities that the UX-er should do, like usability testing, checking analytics, conducting A/B tests, writing reports. Choosing color is more like visual designers work. People often are confused between the two ...


89

Great question! This is an good case for microinteraction design. Microinteraction objectives In descending order of priority: Provide clear affordance for user to place card/wallet on reader Provide clear feedback that the user should hold the card on the reader until an outcome. Since this is public transportation, provide blind- and deaf- friendly ...


66

The original purpose of the "mouse trails" feature, according to the Windows 3.1 documentation, was to make the mouse easier to track on the very-high-latency LCD panels used in early laptops, by ensuring that the pointer was drawn in each position for at least a full refresh cycle of the screen. It turns out that it also makes the mouse easier to follow/...


61

Dark on light vs light on dark themes can have multiple effects, such as: Bringing attention to an application vs bringing attention to the application's contents People focus on brighter areas — darker background brings attention to the content, while lighter background bring attention to the window itself vs the desktop. Imagine if the box around ...


60

No - there is no "friendly font" for all. Dyslexia is not a hard and fast condition. Different people who are dyslexic will exhibit differently. As a result a particular font that helps one individual does not necessarily help another. io9.com actually has a recent article which cited several studies on the subject: A Special Font to Help Dyslexics? More ...


58

I've been doing front-end work for a decade, and I have deuteranopia or deuteranomaly (red-green color blindness). It has never been a problem. I largely rely on color codes and location/proximity on color picker UIs to identify colors. When doing a design from scratch, I will often look at pre-existing palettes for inspiration. I will also use an ...


52

One aspect of this is accessibility. You don't get any context from the link itself. You can see further info on wc3: Don't use "click here" as link text When calling the user to action, use brief but meaningful link text that: provides some information when read out of context explains what the link offers -doesn't talk about mechanics ...


51

Well for your example of alt text just show him that there are many more benefits than accessibility. http://www.learnwebdevelopment.com/2011/01/advantages-to-adding-alt-tags-to-images/ Increases Traffic Higher SEO Rankings Safety Rules All of the reasons shown in this link (first link I found on google) are advantages that will increase ...


50

No, it would seem not, as W3C states 1.4.3 Contrast (Minimum): The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following: Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1; Incidental: Text or images of text that are part of an inactive user ...


46

1. What if the user doesn't have a keyboard? It's a perfectly valid case. Not only some forms doesn't require interaction with a keyboard (for example a form with a couple of combo boxes, radio buttons and checkboxes), but even if the form has textboxes and textareas, it doesn't mean that at the exact moment of form submission, the user is ready to use her ...


46

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 are required for completing a step/ flow (or are just generally too important to be missed) should be focusable with TAB key. If disabled buttons are not ...


42

I cannot understand why you'd want a reduced click area for your form field. Including the "for" attribute on the label tag allows you to increase the clickable area. It has been a web standard for quite a while and I would think most users are used to the behavior at this point, making it a convention. While it may not be a convention in software, I would ...


41

Wrap the label around the checkbox. This makes it much easier to click the button. If the label is separate from the control, then there is often a non-clickable gap between them. <input id="click-me" name="click-me" type="checkbox"/> <label for="click-me"> Click me </label> download bmml source – Wireframes created with ...


40

If you consider ergonomics and safety a part of User Experience, which I think it is, then yes - staircases have User Experience. Technically this means that there is relation between tread depth and rise height which, combined, is the pitch line. The angle of that pitch line should be about 30 deg and you have min-max values of both rise and height. Image ...


39

It emphasizes the wrong part of the text, like this. Links tend to be visually distinctive, and draw the eye. (Less so now that they're not underlined in most cases.) But the 'here' is the least important part of the text, really, and so the link disrupts the reading flow.


38

No. Best practice is not to have a separate screen-reader version of the site. Suggesting you should have a screen-reader version of the site infers that your main site won't be. Which doesn't really make any sense, because a non-screen-reader optimised site would be one not built to proper HTML web standards. And why would you intentionally build a non-...


36

Italics are a known problem for some people with dyslexia and the general advice has been to avoid italics (particularly large blocks of italic text) and instead use bold for emphasis. The British Dyslexia Association says: Avoid underlining and italics: these tend to make the text appear to run together. Use bold instead. UX Movement touches on this ...


33

You want to look to sites such as W3.org for advice on this. Many people with cognitive disabilities have trouble tracking lines of text when a block of text is single spaced. Providing spacing between 1.5 to 2 allows them to start a new line more easily once they have finished the previous one. The W3C accessibility guidelines 1.4.8 state (emphasis mine)...


33

As the other answers said, the colours themselves may pose a problem if the hues aren't distinguishable easily. The clearest solution to this is to combine the colours with a shape, so full-vision people can still scan quickly by colour but stopping to look for a second will also easily show the idea. Something like: download bmml source – Wireframes ...


32

A good example to consider would be the iBooks app in iOS which allows users to enable the dark theme automatically depending on the light sensor detection. However as PS86 rightly pointed out, don't build this automatically into the system but enable the user to set as a desired parameter. To quote this article, the iBooks app enables this by an option ...


31

There's a spectacularly cool desktop app for Windows, Mac and Linux called Color Oracle which is really nifty and adjusts everything you see to mimic many various types of colour blindness in real time and isn't limited to static images or websites. Here are some screenshots showing the UX website under Deuteranopia, Protanopia and Tritanopia respectively: ...


31

The UK plug uses 3 wires -- two of solid colour, and a third that is 2-coloured in a stripe pattern. The colours are chosen so that each wire can be identified by colour blind persons. Here is what the configuration looks to people with colour blindness: From MrReid: Under the IEC 60446 standard only black, brown, red, orange, yellow, green, blue, violet,...


30

Yes there is a formula. I wrote an article on high contrast colours recently that charts the variation of black or white (actually off-white #f0f0f0 and off-black #101010) as the foreground colour with the highest contrast ratio, for ranges of background colours. There is also an interactive SVG version with tooltips of the contrast ratios The contrast ...


29

Research generally suggests light on dark is harder to read in most cases but considering we're talking accessibility, you should know that results for those with normal vision don't necessarily hold true for those with various vision impairments. I've heard higher contrast (the mode in Windows is called High Contrast mode I think) can be easier to read ...


29

This conclusions from Michael Hughes might be helpful for you to decide when to include a screenshot and when not to: So where does this leave me? I am going to be more open to including screen shots where they do the following: Help reassure the user that where they are in the UI is the right place to be Help call attention to a specific ...


28

People with Parkinson Disease (or PD as it's also known) need special considerations as you correctly figured. However, keep in mind that most of those considerations are covered by special peripherals rather than specific UI. As a matter of fact, just following common WAI- ARIA guidelines is more than enough. Keep in mind that, like many people with ...


Only top voted, non community-wiki answers of a minimum length are eligible