Monthly Archives: July 2016

Designer’s Guide to the Basics of Web Accessibility Design – Hongkiat

In this post, I’ll cover the basics of accessibility design, what it is, what it aims to solve, and steps you can take to get started. Note, this is an incredibly detailed subject, and it will take months or years of practice to fully understand. But the benefits are worth the effort, and all of your web projects will leave every visitor with a lasting impression of accessible content.

Intro To Accessibility

Generally speaking, accessibility is the idea of building content so that it can be consumed by anyone. This may include blind people who can’t read, and it may include people with physical disabilities who can’t operate a mouse or keyboard (or either).

But it can also include people with slight deficiencies in vision. It might include people with dyslexia or reading comprehension issues. In fact, the idea of “web accessibility” includes every possible impairment that might affect how someone interacts with or consumes a website.

Steps To Accessible Design

I highly recommend visiting the A11Y project website for practical accessibility tips. A11Y (which is also a numeronym) is a free open source project hosted on GitHub, offering techniques for accessible web design.

You can browse their checklist of accessibility items, or even a bunch of design patterns for elements like dropdowns, tabs, accordions, buttons, and modal windows (among other items).

a11y accessibility project website

It’s difficult to learn all of this stuff and to implement it at the same time. Take it step-by-step, and be willing to research more if you get confused.

Check out the A11Y’s how-tos and quick tips for getting started. You’ll bump into specific suggestions like jump-to-content links and high-contrast color schemes. These techniques each have their own level of detail, so implementation is mostly about testing to see what works.

Curated by (Lifekludger)
Read full article at Source: Designer’s Guide to the Basics of Web Accessibility Design – Hongkiat

Part 2: How to Conduct a Basic Accessibility Audit on Your Site : Adobe Team

Continued from Part 1.

Part 2: How to Conduct a Basic Accessibility Audit on Your Site

In case you missed it, catch up on Part 1 of How to Conduct a Basic Accessibility Audit on Your Site.

In this post, we are going to learn how to do keyboard, screen reader and automated code testing.

Testing with a keyboardUnderstanding how people might be using your site with assistive technology is a great way to gain empathy and insight into the impacts of poor accessibility.

Remember that some people may not be able (or not want to!) use a mouse, due to motor impairments or personal preferences. Navigating by keyboard takes some practice. The basics are:The tab key moves forward through interactive elements on the page and shift tab moves backwards.Using the enter key should select a link or button.The arrow keys should navigate within dropdowns.

The space bar works with form controls for example checking or unchecking a has a skip to main content link and a clear visual focus state when using a keyboard.

To run a keyboard test on your site:Go to your site.

Unplug your mouse – you are not allowed to use it. No cheating!

Hit the tab key to get started.

Do interactive elements have the same functionality as they do when using a mouse?

Is the order of the focus states logical?

As you get the hang of keyboard navigation, you will learn how important the order of focus states is, as well as discovering interactive elements which don’t function well. A common problem is a ‘keyboard trap’ – where you cannot move away from an interactive element using the keyboard alone.

Curated by (Lifekludger)
Read full article at Source: Part 2: How to Conduct a Basic Accessibility Audit on Your Site : Adobe Dreamweaver Team Blog

Part 1: How to Conduct a Basic Accessibility Audit on Your Site : Adobe Team

Part 1: Visual Accessibility and Manual Code Inspection

Accessibility is really important: Accessibility benefits everyone. By paying attention to accessibility you will improve the UX of your site for all of your users.Making sure your site is accessible expands your customer base. People with a range of disabilities make up a significant portion of the buying power.It’s the right thing to do – designing and developing with an eye to inclusivity means that we value and respect all users and people equally.

There are legal imperatives. More and more legislation is coming into play that mandates accessibility, particularly in the transportation and technology sectors.

It can seem overwhelming, but there are a few simple things you can do to evaluate your site’s accessibility. Many different types of people need to use the web. Not everyone is using technology in the same way. It is crucial to design for a range of abilities and assistive technologies, to make sure that people do not experience barriers to using your site.Web accessibility is a deep and important topic,  and there are people and companies who specialise in it. The WCAG 2.0 guidelines are considered the industry standard in accessibility, but these can feel overwhelming! Each guideline has three levels of success criteria, A, AA and AAA. The level of compliance that is legally required varies depending on where you are based and the sector.

As a rule of thumb for getting started, aim for level AA. For this post, let’s look at some of the easy ways to get started with some basic accessibility auditing on the sites you design and develop.

Part 2 continues here

Curated by (Lifekludger)
Read full article at Source: Part 1: How to Conduct a Basic Accessibility Audit on Your Site : Adobe Dreamweaver Team Blog