Accessibility is not just for physical products and people with wheelchairs: Our lives strongly depend on digital products such as apps, websites and various interfaces. To ensure they can be used by people with visual, hearing and other impairments too, we need digital accessibility. This benefits us all: If the usability of a digital product is optimised for people with special needs, it is simultaneously optimised for everyone.
This article will cover what exactly digital accessibility is, how to achieve it and why it is essential for business owners:
Accessible design aims to enable everyone to use a specific product. Accessibility also forms the basis for participation and self-determination » – two concepts that should be the lived reality for everyone, as much as possible.
When talking about accessibility, we also talk about inclusion (see animation below): All people should be full members of the same society without being marginalised. The SDGs (Sustainable Development Goals) of the United Nations », specifically goal #10, also strive for the social, economic and political inclusion of all people, irrespective of age, sex, disability, race, ethnicity, origin, religion or status.
For this to work, some fundamental requirements must be met. In terms of accessible design, this means designing products in ways that they can be easily used – regardless of physical limitations such as visual impairments, deafness or limited mobility.
When it comes to accessible design, a distinction is made between digital and physical design. Due to the wide range of topics involved, today’s focus is on digital accessibility only.
From exclusion to separation to integration to inclusion: Only the latter state is suitable for true accessibility, which can only be achieved by equal and active participation of everyone in society.
Accessibility barriers of a product can be manifold. They can affect sight, touch, hearing and speech. Barriers can furthermore be permanent, temporary or situational. These different types of barriers all need to be overcome with appropriate designs.
This highlights why accessible design is important for all of us: Not only people with permanent disabilities depend on it. Throughout life, each and every one of us will find themselves in situations where we struggle to use digital products. For example, around 8% of the adult population in Germany have an accident every year » that requires medical attention. Depending on the type of injury, e.g. a broken arm, operating a smartphone or laptop may be more difficult. The same applies to parents who have to carry children on their arm, people with temporary eye conditions and so on.
Accessibility is essential for the lives of disabled people in every respect. Accordingly, in Austria, the federal government is obliged under the Web Accessibility Act » to make government websites and apps accessible in order to provide unrestricted access for all users.
But the private sector also has an obligation under the Federal Disability Equality Act » to enable people with special needs to participate equally in society.
From June 2025, the European Accessibility Act » will also come into force, obliging public transport providers, banks and various state institutions to ensure accessibility. The same applies to private companies that offer digital products and services within the EU (eBooks, banking, telephone services, etc.) and have a certain number of employees or annual turnover. The only exceptions are NGOs, schools, public broadcasters, micro-enterprises, etc. Inclusive concepts and principles will become standard with the EU-wide law and non-compliance will be fined. It is therefore a good idea to start with inclusive designs now, as it is a recognised fact that two years is a short amount of time for systemic change ».
Many providers of digital products are not yet aware of exactly what needs to be considered for accessible design. Try calling up your favourite shopping website or similar and try to navigate it without a mouse and purely by using the keyboard. Not so easy, is it? Fortunately, there are many accessibility solutions just waiting to be implemented.
Barriers are often thought of as the physical kind, such as a non-existent lift or a defective escalator, which present an unsurmountable obstacle for wheelchair users, parents with pushchairs or the elderly.
However, accessibility is an equally important aspect of digital products, as accessibility can be hindered by various circumstances. Operating an app without hands or eyesight is anything but easy in most cases. But even minor limitations such as colour vision deficiencies can make it difficult to use digital products if the colour contrast between the background and the text is too low. It’s a bit like trying to work on a laptop outside in bright sunshine: You can hardly see anything on the screen.
Luckily, there are plenty of methods and tools that can be used to ensure that aspects such as colours, font sizes, contrasts and structure are suitable for all users. At which point an app or website counts as accessible and to what extent it needs to be optimised is defined by the WCAG standard – an established guideline for digital accessibility.
The Web Content Accessibility Guidelines (WCAG) are a web standard that aims to ensure the accessibility and usability of websites, non-web documents and software for people with disabilities. In many countries around the world, these guidelines even form the basis for legal requirements » for accessible design.
The WCAG are based on four principles:
In addition to these general principles, there are 13 guidelines and 78 success criteria. The latter offer concrete instructions for accessible implementation. These instructions can be read in detail here ».
There are different versions and levels of the WCAG, of which only WCAG 2.1 with level AA is the legal requirement. Of course, digital product providers can choose to optimise to higher levels, but there is no obligation to do so.
To avoid getting lost in details, we summarised the most important aspects and principles of digital accessibility in this article while focussing mainly on visual design aspects. It is important to note, however, that around 80% of digital accessibility depends on accessible programming, which our development partners reliably take care of. The technical aspects of accessible implementation build the foundation that visual design aspects add onto.
Blindness is not the only obstacle when it comes to using displays – colour blindness and colour vision deficiencies can also stand in the way of interpreting digital content. Almost 10% of the population is affected by colour vision deficiencies »; in Austria, that is almost 900,000 people. However, total colour blindness affects ‘only’ 1 in 100,000 people ». The following colour vision deficiencies are much more common: red-green deficiency (around 8% of all men and 0.5% of all women in Austria and Germany are affected), red-green blindness and blue deficiency.
How limiting colours can be is highlighted by the following diagrams: The first comparison shows unsuitable colours in original view, as well as representations of the same diagram as people with different types of colour blindness would see them. The second comparison shows the same principle, but with suitable colours. It quickly becomes clear how difficult it can be to differentiate and correctly interpret information if you perceive colours differently from the majority of the population, and how this can be avoided by choosing suitable colours.
By the way, there are numerous colour palettes and guidlines online for choosing suitable colour combinations, such as this one ».
Not only the right colours are important, but also how the background colour and font colour match, how large the font is, whether texts are placed on strongly coloured images, etc. The essence is that contrasts must be strong enough so that everyone can easily read the text.
The ratios required for adequate contrast can be found in the WCAGs:
This information is very abstract; if you want to check and optimise contrasts easily, you can do so here, for example:
But what to do if your company logo or CI does not meet the standard? Fortunately, this is not an issue; logos and CIs do not need to be redesigned as they are exempt from the regulation. However, the ideal solution is to add a contrast option to websites that allows users to choose which colours they would like to see for text and background in order to improve readability as needed. An example is the website hilfgemeinschaft.at »; simply try out different contrasts in the top right-hand corner.
You don’t have to rely purely on contrasts and colours. The combination with patterns and shapes » is ideal for visualising content even more clearly. Bar charts can be filled with circles, squares, lines and other symbols (the width of the bars must be slightly larger than usual though to make the patterns recognisable) – see example charts below. Patterns can of course be enhanced with colours too.
As colours, shapes, symbols and contrasts all help to absorb information, they can be combined. This so-called ‘redundant encoding’ is often used on operator displays, where warnings in particular are not signalled purely by colours (i.e. red and yellow), but by combining them with symbols and shapes – including outlines – in order to stand out better against various backgrounds.
There is no room for interpretation when it comes to interfaces and data of critical infrastructures as human lives, the environment and/or significant sums of money are at stake.
Next to colours, size and contrast, the actual font and how a text is written are also relevant for accessibility.
Serif fonts (where letters have small “feet”, such as Times New Roman) look elegant and classic, but can be difficult to read. The same applies to narrow fonts, small letters, ornate/decorative fonts, etc. Simple, contemporary fonts (with a large enough font size) are the best choice.
How you express yourself greatly impacts comprehensibility. Scientific articles, technical blog posts and the like may require a certain vocabulary. General advertising texts or information on government websites, however, must be easy to understand. In case they’re not, an additional simplified version must be available.
Short paragraphs and avoiding nested sentences, technical jargon and expressions from foreign languages: All of this already helps improve comprehensibility.
A clear structure and simple navigation are important for all users so they can successfully use a website or app. Visually impaired people or those who cannot use a mouse or their hands to navigate, however, need assistive technologies such as screen readers to get to where they want to (e.g. a subpage, which they need to access via the menu) or to complete a desired action (such as closing a pop-up).
Tabs, or defined sections with correct titles, as well as correctly coded headings (H1, H2 etc.) are a prerequisite for being able to ‘cross-read’ pages or to have them read out loud correctly; more on accessible page layouts here ». Most people can scroll through a page, recognise headings and sections as such, and open a desired subpage or click a button; with assistive technologies, this is only possible if all sections are correctly structured and titled on a technical level. Otherwise, the entire page content may have to be read by a screen reader (possibly incorrectly) before you finally get to the footer of the page or are able to tell whether the content of the page is even relevant to your search request.
The same applies to formats such as PDFs and Word documents. For example, headings need to be formatted correctly by using Words’ heading styles that automatically mark them as H1, H2 etc. If the headline text is simply changed to bold and the font size increased, screen readers cannot recognize these lines as headings. As a result, they are read out incorrectly and make navigating through the text harder as it is now impossible to jump from one section to the next (as the screen reader would not know where one sections ends and the next one starts).
Media such as images and videos pose further technical challenges that need to be considered for accessibility. The same applies to forms, pop-ups and other elements that require a user to enter information.
To summarise the most important points: Don’t forget to add alt tags for images, add subtitles to videos and add clearly understandable error messages to input fields in contact forms or similar.
While screen readers can read text out loud, images remain hidden for people with visual impairments. This can be solved by adding alt tags to images. Alt tags are alternative texts or image descriptions that are stored in the code as an alt attribute in the format <img src=”image_name_XYZ.jpg” alt=”Image description XYZ” width=”XYZ” height=”XYZ”> to briefly describe the content of the image in text form.
The rule for alt tags is: Only add as much text as necessary to sufficiently describe the content. Preferably in a short sentence, without pointing out that it is an image – this is clear without a declaration.
To describe a photo of a raspberry muffin, neither “raspberry muffin” nor “image of a soft raspberry muffin with icing sugar lying on a red patterned plate; sunflowers in a vase are visible in the background” is a good alt tag. “Soft raspberry muffin with icing sugar” does the job just fine.
Symbol images, decorative icons and logos do not need descriptive text; an empty alt tag (alt=””) is sufficient and is recognised by screen readers, which then automatically skip it.
For forms and similar elements that require input, it is important to be able to enter content regardless of any visual or tactile impairments by using assistive technologies. There are some prerequisites for this, such as:
It has to be easy to proceed from one input field to the next. Among other things, this requires labelled input fields and a clear technical structure. It is helpful to structure processes such as payment processes by dividing them into logical steps (e.g. first enter the delivery address, then your payment information etc.). This reduces the likelihood of errors and increases clarity. This benefits all users, by the way; nobody wants to plough through never-ending input fields.
If incorrect information is provided (“@” is missing in the e-mail address etc.) or if mandatory inputs are missing altogether, this needs to be pointed out right away – by means of clearly understandable text instructions directly where the error has occurred, including an explanation of what needs to be corrected. A simple red frame around the input field is not enough – neither screen readers nor colour-blind people can see it.
Pointing out errors right away is a must. Why? Imagine entering a lot of information, finally being ready to send the form and now being told that an input is missing or wrong. You’ll feel very frustrated having to go back through every single input field to reach the one you need to edit – which is what you have to do when you rely on assistive technology.
So much information, and yet the topic is far from exhausted! But let’s end with the most important question for you:
With accessible design, you contribute to giving more people the chance to live an independent life with full access to various digital content. This helps other people and, in the long term, yourself: Eyesight, fine motor skills, hearing, etc. deteriorate with age. On top of that, injuries can happen at any time. Simplifying and optimising your products also improves the user experience » and usability » for all users. The more digital access you and other people have, the more freedom and autonomy we can all enjoy.
More than just showing altruism and helping with prevention, barrier-free design provides access to your products for a new target group – and a considerable one at that. An example: Of Austria’s ~ 9 million inhabitants, around 1.4 million live with disabilities. Around 3.4% of the total population is affected by blindness or visual deficiencies (see Blindenverband »). Enabling these people to access and use your online shop, booking site or similar will increase your target group and boost your sales. More about successibility here »
As mentioned in the beginning, the legal situation is a strong driver for accessibility in the world of digital design. Following the law and avoiding penalties clearly pays off for everyone – especially since the European Accessibility Act already takes effect in 2025.
Fully accessible design for digital products and services is without a doubt the future; the sooner you start, the better. Early adopters will benefit from a positive reputation and increased profits in addition to being role models, while improving the lives of countless people.
Do you also want to make your digital products accessible or would you like to develop a brand-new product and make sure you meet accessibility criteria? Contact us for a non-binding initial consultation – we look forward to hearing from you and your project idea:
Share this article
Inclusion is highly important – for individuals and society overall. For our social media campaign on inclusion, we prepared materials to educate on the topic. Some of them, you can download here (it might take a few seconds after you click the link):
You’d prefer to contact us directly? Of course! Here’s how to reach us:
You’d prefer to contact us directly? Of course! Here’s how to reach us:
Mail: contact@peschke.at
Tel: +43 1 47 07 922
Sure! Directly book a non-binding initial consultation to share your vision and ideas with us – free of charge, of course. We look forward to meeting you!
Book appointment
