Website accessibility, what it is and why your site needs it

Website accessibility, what it is and why your site needs it

When people hear the words ‘online accessibility', most sigh, acknowledge that maybe they could be doing a little more, then promptly continue to sideline the issue. After all how many disabled users really use your site anyway?

SURELY THERE ARE MORE IMPORTANT ISSUES TO CRACK ON WITH...

Making a website is hard. There are literally hundreds of considerations to factor in, so where does accessibility really rank?

Unfortunately accessibility is often considered as an afterthought, baked into websites after implementation as a means of appeasing a handful of perceived users. But is this attitude really justifiable? How many of your website visitors really benefit from accessibility considerations and what are the consequences of not adhering to the correct standards?

HOW MANY USERS ARE AFFECTED?

Firstly let me make it clear that by accessibility I’m not simply referring to blind users, although they are covered by the term. Its a popular misconception to believe that online accessibility is simply aimed at the visually impaired.

Instead it’s better to consider ‘accessibility’ as a spectrum, one that most of us fall into. For instance if you know anyone who’s a little hard of hearing, suffers from arthritis or has a cognitive impairment, they could benefit from correctly implemented website accessibility. In fact webaim.org estimate that one in five of the population have a permanent disability of some kind.

Moreover have you ever forgotten to take your glasses to work? Maybe you simply drank a little too much last night and woke up this morning with a strong aversion to bright light... The point is that accessibility isn't a black and white term, at some point we all need a little help getting where we need to be.

So to answer the question at hand, I’d argue that every user is impacted to some extent by accessibility issues.

In terms of importance, accessibility should be considered as an equal to such fundamentals as design, speed and security. It's a basic requirement that will harm your users experience and ultimately your businesses bottom line if implemented badly.

THATS ALL GOOD AND WELL, BUT WHAT IS AN ACCESSIBLE WEBSITE?

Put simply an accessible website is a site built to be open to everyone. It does not place the needs of the majority over the minority.

Or to be specific, it's a site built to Web Content Accessibility Guidelines (WCAG). In fact the page you're reading is WCAG 2.0 (AA) as verified by achecker.ca/checker.

PROACTIVE CODES TOP FIVE ACCESSIBILITY BLUNDERS

I'm not going to go into detail on WCAG, after all there are entire websites dedicated to the subject. Instead I'll give you five classic examples of bad website accessibility. If any of these sound familiar it's time to start planning an update.

  1. USING FLASH

    Still using ye oldie Flash for interactive content, games or animations? Oh dear.Text in Flash can’t be resized for the visually impaired and more often than not requires a mouse in order to function as intended. Also because Flash doesn't use HTML text, it cant be read by screen readers, so to a visually impaired user any information stored within this content may as well not be there.

    Still not convinced? Most phone and tablet users wont be able to see your content AT ALL, nor will anyone who hasn't installed the Flash plugin on a desktop computer.

  2. FAILING TO USE ALTERNATIVE TEXT ON IMAGES

    Alternative text (or ‘ALT’ text) is a simple way to describe whats in an image without… well... seeing the image.

    I often hear it justified in terms of its requirement for screen readers, which is true. What’s often missed is its importance for everyone else. For example if you publish an article with a broken image or if you’re on a bad 3g connection, without any alt text you’ll see nothing. So if an image had any important meaning it’ll be completely lost on your audience.

    Not sure if you’ve implemented alternative text correctly? It’s simple to find out. Run a simple W3C HTML validation check. Any images missing alt attributes will be reported back as an error.

  3. LOW CONTRAST BETWEEN FOREGROUND TEXT & BACKGROUND COLOURS

    The ideal here is a white background with black text. High contrast, allowing users to easily distinguish between the text and it’s background.

    Unfortunately we live in the real world, and the reality is that that ideal is rarely reached. Don't worry though, there’s actually quite a lot of leeway. For instance on normal text, to achieve a ‘AA accessibility' rating, you’ll need a contrast ratio of 4.5:1.

    To verify if you’re hitting that, check out this tremendously useful colour contrast checker at WebAIM.org.

  4. FAILING TO ADD LABELS TO FORM ELEMENTS

    Surprisingly common to see in the wild. Missing form labels are a problem for the visually impaired because form inputs aren’t preceded with the information required to let users know what it is they’re actually filling in.

    Lots of naughty developers out there are instead using the placeholder attribute as a substitute for a label (you know, that slightly grayed out text within form fields that disappears when you click on it) as a replacement for labels. Please don't do this.

    When a user clicks (or tabs) into the input field this text will vanish and users will simply have to guess what it is they’re being asked for.

    Not including form labels can also mess up your pages tab order, this can lead to unexpected behavior, harming accessibility and annoying, well, pretty much everyone.

  5. NOT ALLOWING USERS TO ZOOM ON MOBILE DEVICES

    I hate this, I really do. I mean I sort of get why developers stop users from pinch zooming on phones and tablets. After all your new website is designed for mobile browsing, so why would a user need to zoom in the first place? Right?

    Wrong.

    I don't care how well mobile optimised your website is, disabling native functionality users might depend on to better suit how your website works is a terrible idea.

    As an example, if a user finds the text on your site a bit too small to read, they might decide to zoom in. If your sites disabled this functionality, they’ll probably just leave. I know I would.

DISABLED USERS HAVE MONEY TO SPEND, DON'T EXCLUDE THEM!

At the end of the day, your websites online to communicate information. So whether you're selling a product, promoting a brand or writing a blog, if you're excluding users then chances are you're loosing money. Setting aside any moral standpoint, that alone should be enough justification to take action.