It’s only natural that you want the best of the best for your website.
You have your content tight, your SEO parameters optimized, your website engaging and far from boring. You have a bunch of well-designed pages, with professionally done photographs, multiple source links and an interactive menu even. But… is your website accessible?
You're probably wondering what we mean by accessible.
Do we mean it looks good? Operates well? Engages with audiences? Yes and no.
This whole ordeal might sound overwhelming to you, but the good people of the internet and lots of statistics and survey centers are working day and night to deliver us the shortest answers.
So, web accessibility optimization basically means making your website easier to comprehend and navigate for people with disabilities. Color, sound and shape are just a few of the elements analyzed.
A well-informed web developer and web designer utilize the so-called W3C (short for World Wide Web Consortium) and its Web Accessibility Initiative guidelines to optimize websites for accessibility.
WAI is almost a science on its own, so we’re going the address the best ways to optimize your web existence and fulfill the main web accessibility requirements.
Well, if we look at the statistics, we have millions of disabled people all over the world who are rarely using website browsers — and that’s because websites just aren’t accessible. Add seniors to the mix, who often have issues with eyesight and hearing, and you have a whole population of people who could benefit from an accessible-designed website.
By 2060, populations of people aged 65 and older will reach nearly100 million. And as of now, 57 million Americans have a disability.
As if that isn’t enough of a reason to make your website accessible, here’s another fact – 20 percent of the world’s population might not be visiting your website because they can’t access it.
Luckily, we’ve got the answers to your website accessibility problems.
First, you need to learn all about section 508. If this phrase is unfamiliar to you, you’re missing out. A lot. But don`t worry, it’s a commonly overlooked set of regulations.
In simple words, section 508 is a set of rules summed up in an amendment that requires websites (especially the US ones) to follow and abide by a wide range of web accessibility standards and guidelines. The amendment requires all government sites to follow this set of rules in their online endeavors to a T.
Now, you must be thinking, “My website is a commercial one, no need for me to follow those government rules." But, you should – it’s the right thing to do, after all.
And there's a catch, as always.
The National Center for Health Statistics (NHIS) conducted a survey trying to figure out how many people in the US have problems browsing the web. This group included people with disabilities and elderly people.
As it turns out, an estimated 20 percent of people have problems browsing the internet in the United States.
Another survey even suggested that people with disabilities are three times less likely to even browse the web at all. That’s huge.
You’re probably starting to understand now: web accessibility is the key to grasping a bigger audience and aligning yourself as a brand that cares.
Being that technology constantly evolves, so do the ways we develop websites and all kinds of online services. Usually, e-commerce companies pioneer these changes. And along with these changes, the WCAG must be updated accordingly.
Provided by W3C, this regulatory system is a standard in web development. And we will focus on explaining, analyzing and showing examples on how you can utilize this system and optimize your brand`s online presence.
The WCAG is a live document that changes all the time, but there are some general rules which every web developer/designer should follow:
We're sure that you’ve encountered the concept of Alt Tags in your website building experience.
Essentially it’s a description of a picture displayed, and it’s more or less non-vital for the standard user's experience. Now the following advice is a must for e-commerce websites or websites that are mainly visual and/or heavily rely on visual cues.
Why? Well, as it turns out, visually impaired people are browsing the web using some sort of screen reader. Now, these screen readers can't read a picture out loud, so the information that they utilize is your alt image tags.
Knowing this, you can appropriately optimize your tags to make concise and understandable phrases that make sense when read out loud. Even though SEO sometimes requires us to keep the alt tag content scarce, expanding it to make sensible phrasing is not that big of a deal, and will provide extra context and, of course, a quality of life feature for the visually impaired.
Additionally, be careful not to overdo it. Making unnecessarily long descriptions in the alt text can suffocate the content, which kind of defeats the purpose. The alt text should be short, concise and above all, relevant.
We’re aware that this part of the user interface and user experience is uncommon for most, but it's as equally important as any other trait your website brings with its style and visual hooks.
Thinking long and hard about alt text is especially important in the e-commerce world. These websites usually contain a whole bunch of product images in every screen, so browsing them using a screen reader software can be tricky. There lies the mastery of good website accessibility optimization: conciseness!
The most beautiful part is that these words aren't seen on the screen, meaning there is no additional clutter. And it makes a world of difference for so many people.
So, be a good human being and make your photos and images even richer with a well-written alt text.
Visually impaired people find text clarity (or rather, lack thereof) one of the largest nuisances while browsing. The reason for it is obvious, but this problem must be addressed with extra caution.
The problem with text clarity is a rather sensitive subject. The reason behind this fuss is the balance between the choice of font style, with thinner fonts being aesthetically more pleasing, but at the same time harder to read and less comprehensible. And, of course, the use or absence of serifs.
One studyshows that even the correct use of serifs can significantly affect the legibility of the content you are presenting.
Having the correct font weight and size is paramount for an adequate accessibility optimization. But, if by any chance your website has a high amount of info, `trimming` your font, and making it more visible can and will enhance the UX for everyone.
That fact tells us that accessibility optimization is not only helping impaired people maneuver around in the internet environment, but also helps you optimize your website in a general sense.
There are some key rules you should follow in order to keep your text neat and readable. They are provided by the W3C as follows:
Being that we live in a time of fast internet connections, video is now a viable channel to use on online places. The website you’re developing will probably have some kind of video integrated, or a YouTube link embedded somewhere.
If you provide video content, make sure to also provide closed captions within. Nowadays, it's not that hard to make subtitles for your video content. You can even consider hiring someone to do it for you, if you provide the transcript, of course.
Closed captions have, luckily, become an everyday part of the video-watching experience. No matter the audience you’re targeting, try to at least include English subtitles in your videos.
This one should be a must.
Navigating and browsing without using a mouse is a surprisingly wanted feature today. People that use assistive hardware due to a disability, or simply laptop users who are used to website navigation via keyboard are the people you want to please.
A great example of a platform that even encourages their members to use their extremely simple, yet amazingly effective system is Imgur. They have incorporated a system for easier browsing and participating in community events using the keyboard only. This feature shows us more than just the wish for accessibility optimization.
It shows that this brand invested in ergonomics, even though they don’t indulge in commerce, and are an image sharing site.
Another adequate exemplar of an optimized website when it comes to simplicity in keyboard commands is the ever-popular Twitter.
You can even make your brand more likable if you fulfill these demands, and make the user feel more powerful for having the option to move around using keys only.
As enigmatic as it sounds, it’s really not that hard.
Don’t be afraid to utilize pictograms, symbols and other visual cues to help your visitors move around and experience your brand. The simplest example would be to put the word “next page” into an arrow pointing to the right, insinuating the action without having to read the text within.
This sort of visual assistance has lots of purposes, first being the accessibility optimization, of course. It also reduces the time needed to browse, thus increasing the effectiveness of your platform.
Another important feature, where you can infuse usefulness and aesthetics, is through symbols, achieving a uniquely minimal kind of design. Having the right number of elements, without damaging the quality of necessary information is helpful to us all.
Mentioning popular websites as prime examples of such optimizations seems a bit stale, but hey, they are in fact popular thanks to this fact. Take Instagram — a great example of visual and ergonomic simplicity. The accessibility of this service is as easy as a few clicks and taps, and the symbols used save space, declutter and make every element more visible and distinguishable.
Another great accessibility optimization tool is none other than color. Yes, color. Using color in web design is an old story by now. But the role it can play in making your site more accessible to elders and people with disabilities is immense!
Yes, exactly that. It may seem like an easy thing to shrug off, but people often find themselves stuck when developing a brand online.
Regulations and rules can look complex at first glance, but there are steps you can take to make it much easier.
Make sure that you absolutely understand the content you’re presenting, and that you can explain it to a five-year-old, and a veteran web developer at the same time. This way, you’ll find it much easier to start accessibility optimization.
To adapt the content start with a list of most common impairments people online have:
Taking these factors into consideration, you'll find the adaptation process more doable and easier to handle. Keep in mind that you do have a handy guidebook by your side, and fear not, you are doing the world a favor!
Last on this list, but definitely not least, is the use of assistive technologies.
There are more and more technologies developed to help people while using the computer and internet. We’ve already mentioned screen readers, but they’re not the only ones out there.
It's important to make your website available through these technologies, and the essential list includes:
We’re aware that all of this seems like a lot of work, but it’s for a just cause.
Besides everything said so far, let’s consider some benefits of these implementations.
Making your brand user-friendly online is a great step towards a whole new customer base. Tapping into this market, while doing an actual good deed is a win-win situation.
Making the internet better is the responsibility we all have on our shoulders — owners, casual browsers and customers. Being that the world wide web is a basic human right, it would be a tad bit irresponsible not to approach these kinds of optimizations and adaptations with enthusiasm.
A lot of web developers will testify to this. When you optimize your website, in order to achieve the above-mentioned changes, you’ll fix and tighten up any missing or loose parts. And it helps you to keep in touch with all the essentials like SEO, device compatibility and website maintenance.
There are many valuable sources to help you build a better website and test your current one.
We’ve picked some of the most popular, and most useful to help you get you and your brand join the ranks of the best accessibility websites out there.
If you aim to do it “by the book”, and the government one at that, start with the 508checker. This tool enables you to check the accessibility of your site by just entering the URL. It uses the original amendment as a reference, so you’ll know where you stand.
Next up is the Accessibility Valet, a simple tool that uses the WCAG and section 508 as a reference point, scanning for errors and giving suggestions on what you can work on.
And the third one to help you optimize your website is Wave, a set of tools similar to the two previous ones, with the additional option to check non-public and unpublished websites for potential errors.
By doing the socially responsible thing of accessibility optimization, following the W3C rulebook, and adhering to section 508, you’re doing a favor to yourself -- and to a lot of people out there.
So, always remember that there are internet users that do not go online like the majority of others do.
And yes, these features are not only to help them, but also to help you figure out the market, and get a deeper and more thorough understanding of it.
Just remember: Web accessibility is essential for some,but useful for all!
And there you have it. A lot to process and a lot to think about.
The investment in accessibility optimization is most certainly a valuable one, with no downsides. You enable more people to get to know your brand, you get to fix small problems, doing the public a small favor in the process.
Plus, your online service will instantly get more credibility.
If you take the necessary steps to ensure your website is accessible to all, you're doing yourself a great favor. Because the future of web design is accessibility. More people are going to be interacting with brands and institutions of all kinds. And you want to make sure you don't get left behind.
Get help with your website accessibility with these web design and development agency resources!