Blog
-
The EAA Enforcement Stage for the Web
The European Accessibility Act enters the enforcment stage on the 28th of June, giving website owners and maintainers just slightly over a week to make their websites and services compliant, or risk fines, sanctions, or even outright bans, depending on the severity of the non-compliance. Contents What is the EAA? What is Covered? How to Report…
-
Creating Accessible Flowcharts
I've written before about how to make accessible graphs and charts, but one type of chart I didn't touch upon was a flowchart, which is different enough that it really warrants a bit more detail explaining how to best make it as accessible as possible. Contents Main Accessiblity Issues with Flowcharts The Initial Concept Identifying and Grouping Question and Statement…
-
Making Accessible Icons on the Web
Icons on the Web are a natural extension of their use across computer systems since the early graphical user interfaces (GUIs) came about. For over 50 years, we've been using icons to summarise information in picture form, giving users ways to quickly identify objects and actions in order to make their tasks more efficient. But while the focus has always been on the graphical nature of these icons…
-
Pitfalls to Avoid With Screen Readers on Websites You Develop
Screen readers are an important part of how people browse the web, especially so for those people who can't see a screen. However, screen readers can struggle presenting your visuals correctly if you haven't written clean code and created well thought out content that can be understood and presented as you intended. By understanding and considering the types of content and the problems that can occur…
-
How the European Accessibility Act (EAA) Enhances Digital Accessibility Laws Across the EU
The European Accessibility Act (EAA) is a law that was originally passed just over 5 years ago, in mid 2019, and will finally come into full effect and be implemented on the 28th June 2025. It aims to put into place a stronger set of rules for what products and services need to be more accessible, what that accessibility looks like, and what happens if peoples needs are not met. Contents …
-
How to Conduct an Accessibility Audit on Your Website
Web accessibility is an incredibly important topic, and should be considered as essential as subjects like security, UX (user experience), and design. Not only can poor accessibility cause usability problems for some people, but it can act as a complete barrier to entry. Your audience may be left feeling that you don't care about them, leading to them go elsewhere, to your competitors (be that in information…
-
How To Get The Best Out Of WAI ARIA
WAI-ARIA (Web Accessibility Initiative - Accessible Rich Internet Applications), or ARIA for short, is a way of adding further accessibility to elements that you cannot by using HTML alone. Most usually it's used to add a label to something that assistive technology (such as screen readers) can access and present to the user, where the existing text inside the HTML is lacking or would be confusing…
-
Accessibility Issues With Cookie Banners
Since the inception of the GDPR (General Data Protection Regulation), cookie banners have been a common part of the web, and like all things on the web, there is plenty of room for accessibility issues. Contents What Are Cookies? How They Are Used To Track You? The GDPR The Accessibility of Cookie Banners metro.co.uk thenerdstash.com telegraph…
-
The Affects of Covid on Web Accessibility
We've been a little over 2 years now with Covid in our lives, but there's still so much we don't know about it. One aspect of that is what the enduring effects of it are for some people, or Long-Covid as it is known. These effects vary in their symptoms and severity, but they can have an impact on our lives and can prevent us from doing all the things we are used to. Contents How Many People…
-
Picking The Right HTML Tag
Picking the right HTML tag can be difficult sometimes, which is probably why most of us tend to fall back to the generic <div> and <span> tags. Over time, this practice leads to Divitis, which makes code harder to read on more complex pages and it makes the web page less semantic, making it more difficult to navigate with assistive technology like screen readers. In-fact, ensuring we're…
-
Accessibility Concerns Over Chrome Removing Alert, Prompt, And Confirm Modals
Chrome has recently announced its intention to prevent cross-origin iframes from triggering the alert(), prompt(), and confirm() . These modals will still function for the top-level web page, and iframes within the same domain. Websites spanning multiple subdomains on the same domain will not allow these modals. These types of modals have been part of Javascript for decades and have seen their fair…
-
Everybody Lost When YouTube Removed Community Captions
I was recently showing my eldest son some bedtime stories, and the ones he loves the most currently are the African folktales about Anansi the spider. However, as I was watching with him, I was shocked at some of the captions accompanying the audio, it was full of profanity! Contents What Happened Who is Affected? Is it Really a Problem for Content Creators to Solve? A Better…
-
Upcoming Changes With The WCAG 2.2 Guidelines
The proposed changes to the Web Content Accessibility Group (WCAG) guidelines defined in the WCAG 2.2 working draft are aimed at improving the experience for people with cognitive disabilities and low vision, as well as improving the overall experience for those using mobile devices. This is meant to be an interim set of guidelines until WCAG 3.0 is completed. There are 9 new guidelines that tie…
-
Improvements to the Accessibility Checklist Tool
Since the initial blog post about my accessibility checklist tool, I've made further improvements which make the tool easier to use and more useful. Navigating to Previous Steps The first version was extremely linear, only allowing you to start from the beginning and progress to the next step. Now, you can move back to any previous step by using the link in the main steps outline. This…
-
Understanding How To Use The Firefox Accessibility Tools
Browsers today are very different beasts than they were a decade ago, and come with some amazing tools for developers to help them work more quickly and efficiently. I want to introduce you to the accessibility tools built into Firefox. Contents Detecting Issues Automatically Colour Contrast Keyboard Accessibility Text Labels Simulating Colour Blindness Viewing Tab…
-
Making Testing Easier: An Accessibility Checklist
Accessibility testing can be hard and time consuming, especially if you are new to it. The mix of browsers, operating systems, and user-space tools is vast and ever-changing. The WCAG guidelines are the de facto standards for accessibility requirements across the world wide web, but they're not exactly light reading, and they can be difficult for newcomers to fully understand and take in. What Do…
-
Accessible Graphs and Charts
If you have a lot of data that you need to convey to your audience you could use a table, but a graph or chart can help convey the same information much more simply and quickly to your readers. However, we need to be careful that the graphs that we create are still available to our whole audience. There are some simple ways that we can ensure this. Contents Text Alternatives Alt…
-
Accessibility Myths And Misconceptions
In the week following Global Accessibility Awareness Day (GAAD) the Accessiblity London group asked: What are your most commonly encountered accessibility myths or misconceptions?— Accessibility London (@A11yLondon) May 19, 2020 The question was asked in about half a dozen languages, and there were a lot of great answers, but the same few kept repeating. Many of them were things…
-
WebAim 1 Million and Global Accessibility Awareness Day
It's Global Accessibility Awareness Day today, and more of us than ever are relying on online services and resources due to the Covid19 pandemic. With a huge swathe of the world being forced to work from home, we're seeing a greater need to ensure our products, tools, and websites are accessible to everyone. The WebAIM one million project paints a pretty bleak picture, as it looks like websites…
-
Accessibility Testing for Developers
If you're developing for the front end, then it's important to understand how to test that what you produce is accessible. Testing across multiple browsers has been part of front end development since the beginning; browsers would always interpret your code in slightly different ways, both small and large. Accessibility testing is no different really, you're just approaching things from a slightly…
-
Making an Accessible Hamburger Menu
With more and more web usage being performed on mobile devices, increasing every year the, now common, hamburger menu is here to stay. One of the main problems that needs addressing is the usability and accessibility of the menu. A Typical Example Keyboard Handling Showing Focus Improving for the Screen Reader Setting the Expanded State …
-
10 Simple Steps Towards Accessibility
I'm often asked for a list of "quick wins" to make websites more accessible. While I don't always agree with that mindset as it can lead to a lazy approach to accessibility that's tacked on as an afterthought, I do understand that there is a real need for simple solutions that can fix the majority of problems. Imagine the situation (and I really do believe this is a typical scenario from my experience…
-
Testing Colour Blindness Effects Online with SVG Filters
One of the basic rules of accessibility is to not convey information through colour alone. The WCAG lists use of colour as a Level A issue, specifically saying: Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element. This criterion is aimed at those people with visual disabilities, or problems that have…
-
The Problem With Accessibility Events in iOS 12.2
My Twitter has been aflame this week with people Tweeting about a recent update from Apple which introduces a new feature called Accessibility Events in iOS 12.2. Their reason is to: allow websites to customize their behavior for assistive technologies, like VoiceOver. Enabling Accessibility Events may reveal whether an assistive technology is active on your iPhone. This might seem like a positive…
-
Screen Readers and Pronunciation
Screen readers are an essential tool for people who are unable to see, or who struggle to read. Sometimes though, a screen reader needs some extra help, as it can struggle with the right pronunciation of a word, name, or abbreviation. There are things we can do to help nudge screen readers in the right direction in a way that doesn't break the user experience for other people. Contents The…
-
Emoji and Accessibility
I was recently in a discussion with Adrian Roselli on Twitter regarding his tweaks to a technique to make emoji more accessible. His advice highlights some accessibility issues with the typical emoji usage that permeates our social media, our blog posts, and our instant messaging tools. Contents The Problems with Emoji What Emoji Got Right for Accessibility How Can Emoji be Accessible? Choosing…
-
Building an Accessibility Browser Plugin
I was recently talking with a former colleague about testing for accessibility, and specifically being able to run an automated test over a website to reduce the time needed to test. My answer then was that there is no way to fully automate testing for accessibility; there's no test that exists which can rubber stamp your website and give it passing marks. But it did give me an idea. Right now,…
-
How Readable is Your Content?
The readability of your content is one of the most important accessibility issues you will encounter, but is often one of the least thought about. Readability affects everyone who browses the Web, and can mean the difference between retaining or scaring your site visitors. What is Readability? The readability of your content is how easily understood your content is. One of the most useful measures…
-
Accessible Modal Dialogs
Modal dialogues are a part of the web whether we like them or not, and there's plenty of reason to not like them when they're implemented in a really intrusive way. They do serve a very useful purpose though; they allow extra content to be presented to the user in a way that temporarily breaks out of the normal flow of the page without altering the existing content flow. Contents What Should…
-
Dyslexia and Fonts
Generally, when asked about web accessibility, peoples first thoughts tend to go towards visual impairments. One group of less obvious issues is that of learning difficulties, such as dyslexia. Dyslexia affects about 10% of the UK population according to the British Dyslexia Association. Being a hidden disability, it's often overlooked in any web accessibility checks. Contents What is Dyslexia Can…
-
Accessible Tables
For many years, tables were the only tool available to lay out our websites as we wanted to achieve something that went beyond what you'd probably come to expect with your typical word-processed documents. Then for the last decade (or so) we were told that tables were evil, and using them was a sin that would earn us a spot in the 6th circle of IT hell. More recently we've learned that that anti-table…
-
New Features in Web Content Accessibility Guidelines 2.1 and What You Need to Do
In January there was a recent update to the WCAG that introduced some changes in what's expected of you as a developer to make your web content accessible. The majority of these are fairly obvious and straightforward, with some nice additions that enhance accessibility on smaller hand-held devices. Criterion Conformance Level 1.3.4 Identify Common Purpose AA 1.3.5…
-
Web Accessibility in Detail
The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect. Tim Berners-Lee When Tim Berners-Lee opened the WWW to the general public in 1991 (previously it was internal to the CERN network) he had a vision that it would be of use by all, and that tenet is as true today as it was nearly 3 decades ago. Back in the 90's, we had little…
-
Accessible Styled Form Elements
Since the inception of CSS, there's been one area of styling that has been a constant issue; forms. Simple elements, like <input type="text"> and <textarea> and buttons, have generally been ok, as borders, colours and fonts could all be set with standard styles that behaved as expected. Beyond that though, other elements were impossible to style consistently without either compromising…
-
Blind to Accessibility
When I first started learning about accessibility, I figured it was just enough to use alt attribute text on images, and use semantic tags. Like the Greek philosopher Socrates once said though: The only true wisdom is in knowing you know nothing My folly, shared by many developers, was to simply assume that accessibility was just something that applied to blind people, but don’t we all start…
-
Accessible Cross Reference Tables
This article was originally posted on the TMW Tech Blog on the 30th of Jan 2015 but I've amended the prose slightly here I've recently rebuilt this website, mainly in order to move it off of the old CodeIgniter framework to Laravel, and take advantage of the modern features of PHP. The rebuild has given me a great opportunity to go through a lot of the content on the site and re-write it, and one…
