Tag Info

Hot answers tagged

26

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 ...


23

It's not the end of the world if you skip headings in this manner because users will most likely still find the content, but it does go against the general structure of the content and adds a bit of a barrier to users accessing using assistive technologies. One way to look at it is to think of a trio of military chaps in a room; a General, a Sargent, and a ...


18

When the user clicks to play, you simply overlay a message saying 'This video has no sound', and the user clicks to accept this and start the video. For example, this recent video on the BBC website: In addition, where there may be sound but no voice-over, and the user might be expecting it, your message would be 'There is no commentary on this video'. ...


13

I believe its because there are universally defined standards on where Braille letters have to positioned with regards to a informational item and braille users generally learn to look for them in one location. There are also classes conducted for people with visual disabilities which inform them where to look for the sign (the class is called Orientation ...


13

You need to clearly communicate in a non visual sense the fact that the menu has sub menu items. When thinking about the problem like this it turns out that you aren't restricted to just output text as you can also use the text in the tags and attributes. For visually impaired users you should be thinking in text, not images (this is actually very good ...


13

Marco Zehe, Mozilla accessibility QA engineer and evangelist, provided some advice in an article about implementing tabs in web apps with WAI-ARIA. He advocates cursor keys for moving focus between tabs in a set and then spacebar to activate the focused tab, which is consistent with the native desktop experience. Left and Right arrow keys should move ...


10

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 ...


9

Note: The reason I wrote this answer highlighting the different checkpoints a person must do to ensure his site is accessible to people with limited vision is because I believe an understanding of the faults or design issues in the site will help define what the problems users might face while accessing the site For starters, I strongly recommend ...


9

There is actually research about this topic: http://www.opticsinfobase.org/oe/fulltext.cfm?uri=oe-6-4-81&id=63459 "Both text contrast and background contrast variation affect text readability. Background variation effects were only seen when the text contrast was low. Greater effects of background variation would be expected if larger background ...


8

I think this article gives a nice overview of WAI-ARIA vs. HTML5 and how to use them in practice. http://zufelt.ca/blog/are-you-confused-html5-and-wai-aria-yet The conclusion: From the above examples what can we conclude. Firstly, the primary, if not sole, purpose of WAI-ARIA is to provide information about elements in an document to assistive ...


8

HTML5 (Candidate Recommendation) contains the section "Requirements for providing text to act as an alternative for images", which includes the case "A link or button containing nothing but an image": When an a element that is a hyperlink, or a button element, has no text content but contains one or more images, include text in the alt attribute(s) that ...


8

Man, when you asked that question, I thought you meant a Web 1.x monstrosity. I'm not sure there's a hard and fast rule on this but, generally speaking, that's what we would call light noise. My concern wouldn't be with the level of contrast, but with looking somewhat dated. Basically, as soon as Apple declared skeuomorphism to be a thing of 2012 and thus ...


7

To restate the problem you're trying to solve: you want a user who has a screen-reader (or another kind of browser that lacks images) to be able to tell where the link goes. I think that you've forgotten that you're actually trying to solve a bigger problem: you want all your users to be able to tell where your link is going. Normally, you achieve this by ...


7

There are a lot of designs/applications using same approach: Example 1 Example 2 Don't you think your first column is too empty? You can simplify the layout a bit combining both ideas (tree & switch) and use only one tree or simplified accordion. Simplified tree Accordion Finally, there is a way to make this approach a bit more flexible: ...


7

Several accessibility concerns immediately spring to mind, though I think each is a problem that can be overcome with good design and development. Generally speaking a functionally sound and graphically attractive offering could harbour some serious accessibility issues underneath the bonnet and the an inbalanced focus on these cognitively heavy development ...


6

To begin with, most companies (i.e., clients) are little educated about accessibility. This is in the same way that many commercial spaces are not designed for wheelchair users, and even in public spaces information boards are often too high for those. In addition, accessibility concerns are vast and diverse. Yet the user group they serve is relatively low ...


6

Header links is a really good way to enforce focus on a specific area. If you check your profile here on *.SE you find that each heading actually is a link to the page where you see things in greater detail. Thus header linking is a really good implementation of "drill down" functionality. Having a more-link, represented in your question by "Visit the ...


6

I think you are answering yourself: if you don't need rows and columns, then you don't need a table. The table could be responsive and accessible, but in this case it would be unnecessary. Maybe the best list you could use is a definition list that allows you to tag a title and a definition (the comment). This would be the result (without any style): view ...


6

As the related question may come up, be aware of what your local government's laws are related to disabled persons. For example, the American's with Disabilities Act is: The ADA is one of America's most comprehensive pieces of civil rights legislation that prohibits discrimination and guarantees that people with disabilities have the same opportunities ...


6

...to see if it is useful for our company to put some extra attention into our designs for those who are colourblind. It's not just colour-blind users who can't see certain colour combinations - actual blind people can't either, so you need to ensure data isn't represented purely visually. Webaim have some useful info on this topic that covers off the ...


6

I'm surprised nobody has really asked why you need an icon like this. I've been in the 508 business for quite a while now and I can tell you that there's a LOT of things you can do on the web to make it just work for everyone. There doesn't need to be an entrance for normal people and a back door entrance for those who have disabilities. You shouldn't ...


6

You should use the screenshot in below case When you cant explain the screen in words properly i.e. if there are more similar option on the screen which might confuse the user. When user will get navigate from one screen to another screen which are non consistent i.e. major UI change or you are redirecting user to different application. Also, you ...


5

You don't want to disable the submit action button. The user will see the form with corresponding buttons. If some input is also marked with an asterisk (as being mandatory) it will be very clear to the user that "Ok, so I probably need to fill some info in before continuing..". So the user will conventionally not try to continue before filling in the form. ...


5

This is very bad practice to auto-open any attachenemts on page load. It takes the control off the user It breaks the flow, when there are a bunch of opened documents appear Some attachement will be opened in a tab while others are downloaded, it totally mess It loads browser and system resourses, up to blocking the system New tabs could be blocked by ...


5

Transcripts and videos are one in the same thing. Having them on a separate page can be quite a frustrating experience. Let's take a look at other examples Lynda.com has the transcripts right below the video: This allows for easy reading and watching at the same time. And the current line is highlighted for easy access. Youtube had the "transcripts" ...


5

A <div>, as suggested in the comments, would definitely be a better option than a <blockquote>, because having no semantics isn't as bad as having incorrect semantics. Accessibility tools would simply process your exemplary content just like they would the rest of the article content, which is far better than them processing it completely ...


5

You are absolutely right, that current label is very poor. I would recommend Edit Element Although edit by its self would be better, but it does depend on the context. You will find this list of guidelines set out by Microsoft helpful to get your terminology correct. Also see this question as it is related to this but on the subject of Exit. ...


5

Windows has a particular behaviour for tabbed dialogs. Tab moves between the fields on the tab, and after the last item, the tab name gets focus. Using Tab when the tab name has focus moves back to the first field again. It doesn't move on to the next tab. To move to the next tab, use Tab to move focus to the tab name, then use the arrow keys ←→ ...


5

The issue isn't so much with specific colours, but with colour contrast ratios. WCAG guideline 1.4.3 Contrast (Minimum): 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: (Level AA) Large Text: Large-scale text and images of large-scale text have a ...


5

I understand it's meaning but as you mentioned that icon looks more applicable for someone with a physical disability only. Specific uses of the International Symbol of Access include: Marking a parking space reserved for vehicles used by disabled people/blue badge holders Marking a vehicle used by a disabled person, often for permission to ...



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