This website uses cookies to ensure you get the best experience. By clicking or navigating the site you agree to allow our collection of information through cookies. More info

2 minutes to read Posted on Tuesday November 3, 2020

Updated on Tuesday November 3, 2020

portrait of Mirjam Verloop

Mirjam Verloop

Senior Front-End Developer , Europeana Foundation

Making the Europeana collections website accessible to all

This November on Pro, we will share the practices we follow when developing the Europeana collections website to ensure that people have a positive experience browsing millions of cultural heritage objects. In this first post, we look at the topic of accessibility and our work to make the website accessible to all. 

Hands resting on a typewriter

Our aim

When we started working on the new Europeana collections website in 2019, we discussed web accessibility as an important criterion. All European public sector websites should be accessible according to the European Web Accessibility Directive. Web accessibility means that websites, tools and technologies are designed and developed so that people with disabilities can use them. Or, in other words: people can perceive, understand, navigate and interact with the web. And in addition, they can also contribute to the web (see Introduction to Web Accessibility, W3C).

According to World Bank Blogs, 15% of the world’s population experience some form of disability. It includes people who are blind, people who cannot hear, people with cognitive disabilities or people with physical problems. But web accessibility also has benefits for people without disabilities. This could include people who have a slow internet connection, older people, people using small screens or those having temporary disabilities, like a broken arm. In summary, web accessibility has benefits for all and it is an opportunity to reach a wider and more diverse audience. In a broader context, web accessibility is just one aspect of diversity and inclusion.  

At Europeana, we are making an effort to make our products  accessible and our aim is to meet the international Web Content Accessibility Guidelines (WCAG) guidelines level AA (WCAG 2.1)We want everyone to be able to be part of - and enjoy - what we do. We want to help our partners to reach new audiences, whatever their accessibility needs. So we are always working on using existing and developing innovative technologies to make sure digital culture really is for all.

Meeting the guidelines

Accessibility guidelines are not only about code, they are also about design, text, media, language, forms, and documents. That means developers, designers, editors and product managers - among others - are all involved in making websites accessible. 

For example, one set of guidelines is about structure. It is easier for people to understand website structure when there are clear titles and headings, which make it easier to scan and navigate a webpage. And for people who rely on a screen reader a clear site structure is important. Our UX team identifies the design of these structural elements - for example, important headings have a larger font size than the less important ones. Developers represent the structure in code. And the editorial team uses these elements in their content. 

‘We think about accessibility as soon as we start designing a new feature’, says Europeana’s User Experience Designer Romain. ‘The idea is trying to make sure nobody is excluded from the beginning. For me as a designer it means considering things such as colours and contrasts, size of elements, structuring content logically, making sure the text and labels are clear and understandable.’

Verification of the guidelines 

To verify if the Europeana website meets the WCAG guidelines, we run both manual and automated tests. The automated tests, for which we use the accessibility testing tool Axe, are part of our build process. Every time a new feature has been added, tests check for accessibility violations. Senior Developer Lutz Biedinger says: ‘As a general rule of thumb I will try to stick to established standard approaches as much as possible, as these are the most likely to have accessibility solutions which users are already familiar with. Then at a basic level, I will rely on automated checks to flag known detectable issues. Finally, it's important to simply try it and let someone else also test the functionality in order to identify additional issues.’

While we always try to plan for accessibility, sometimes testing shows that things have to be changed to meet the guidelines. One example is ensuring enough contrast between text and background images. ‘The hero banner was initially designed for major visual impact, occupying most of the screen real estate while displaying the high-quality imagery that we have available’, explains Senior Visual Designer Carlos Marcelino. ‘The text, while in a good position, would have to rely on a very contrasted image to be fully readable, which made choosing images a challenge. This made us rethink the whole section, having accessibility as a starting point, so we separated image and text entirely while retaining prominence in both elements.’

Title: Screenshot of the current hero banner on the Europeana collections website homepage

Date: 2020

Title: Proposal for the new, more accessible, hero banner on the homepage of the Europeana collections website (with an imagined season!)

Date: 2020

Next steps

We recently commissioned an accessibility expert to review the Europeana collections website for accessibility issues, and will address his recommendations over the coming months.

Ensuring that the website is accessible for all is a continuous process of testing, iteration, and learning. User Experience Designer Romain says, ‘In the near future we will include people with disabilities and people who use assistive technology in our user testing. This way we will consider their needs from the start and design and develop features that a wide variety of people can easily use.’

To improve accessibility for all our audiences, we will take the learnings from the Europeana collections website onto Pro as well. We are doing our best to ensure that our products are accessible to all, and if you find features that you cannot access please get in contact by emailing me (mirjam.verloop@europeana.eu).

If you are interested in learning more about this topic, don’t miss Dean Birkett’s workshop on ‘Introduction to Accessibility for UX Designers’ taking place at Europeana 2020 - sign up for the conference now. 

top