<\/p>\n\n\n\n
by Dario Scanferla<\/a><\/em><\/p>\n\n\n\n <\/p>\n\n\n\n Imagine having saved up all year and the sales period finally begins: at last, you can treat yourself to something special. So you get in the car, set off, and arrive at the shop you\u2019ve been waiting to visit for just the right moment.<\/p>\n\n\n\n <\/p>\n\n\n\n You reach your destination, prepare to go inside, and suddenly realise the doors are quite narrow. With some effort, and after a few attempts, you manage to get in.<\/p>\n\n\n\n <\/p>\n\n\n\n You walk around the shop, but the further you go, the more you notice that the space is very poorly lit and you struggle to distinguish the colours, patterns and fabrics of the products.<\/p>\n\n\n\n <\/p>\n\n\n\n That\u2019s not all: you try to read the labels, but the text is extremely small and seems to be written in another language. It\u2019s impossible for you to understand this essential information, which is crucial for feeling confident at the point of purchase.<\/p>\n\n\n\n <\/p>\n\n\n\n If your shopping experience reflected this scenario, you would probably not only leave without buying anything, but also never return to that shop. The same thing happens on the web<\/strong>.<\/p>\n\n\n\n <\/p>\n\n\n\n Now imagine browsing a website with low colour contrast, hard-to-read text, oversized headings and overly intrusive animations. These, and many other factors, are all elements that define a non-accessible website<\/strong>.<\/p>\n\n\n\n <\/p>\n\n\n\n A website that fails to take accessibility into account excludes hundreds, thousands or even millions of potential users, and therefore potential customers. This is precisely where UX (User Experience) and UI (User Interface) design can truly make a difference<\/strong>.<\/p>\n\n\n\n What we will cover in this article:<\/p>\n<\/div>\n <\/div>\n <\/p>\n\n\n\n Accessibility<\/strong> is the practice of designing websites, applications and multimedia products so that anyone can use them, regardless of their physical, cognitive or technological abilities.<\/p>\n\n\n\n <\/p>\n\n\n\n It therefore means removing the digital barriers<\/strong> that hinder access. <\/p>\n\n\n\n <\/p>\n\n\n\n When alternative text (ALT Text), adequate colour contrasts, clear navigation paths or compatibility with assistive technologies such as screen readers* are lacking, we are building invisible barriers that will only alienate users, and therefore potential customers, from our business.<\/p>\n\n\n\n <\/p>\n\n\n\n Many companies underestimate the problem, but today accessibility is no longer an option, but a basic requirement for remaining competitive<\/strong>.<\/p>\n\n\n\n <\/p>\n\n\n\n *Software that reads text and visual elements on the screen, helping blind or visually impaired people to navigate and use computers or multimedia products.<\/em><\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n One thing we often take for granted is that the tools we use (such as design systems or JavaScript component libraries) are ready to use and accessible. But this is not always the case.<\/p>\n\n\n\n <\/p>\n\n\n\n A button, drop-down menu or form may seem trivial, but if they are not designed to work with a keyboard, screen reader or in low visibility conditions, they can become invisible barriers.<\/p>\n\n\n\n <\/p>\n\n\n\n Here are a few examples:<\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n That’s why it’s not enough to just copy and paste a component: evaluation and testing are needed.<\/p>\n\n\n\n A good design system not only speeds up work, but also ensures consistency, inclusivity and reliability. <\/strong>In other words: fewer problems for users and fewer surprises for designers and developers.<\/em><\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n In the digital world, UX (User Experience) and UI (User Interface) are the cornerstones<\/strong> on which a user’s browsing experience is built.<\/p>\n\n\n\n <\/p>\n\n\n\n However, these two pillars must coexist intelligently, because:<\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n To do this, we need to ask ourselves a few questions:<\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n All too often, these questions only arise once the website or app has already been published, resulting in commercial risks and high correction costs<\/strong>.<\/p>\n\n\n\n <\/p>\n\n\n\n To minimise and\/or avoid such problems, we must bear in mind that a well-designed interface guides the user, rather than hindering them<\/strong>. Good UX is like a barrier-free path, where every piece of information is accessible, every button is clickable (even from the keyboard) and every piece of content is understandable (even from a screen reader).<\/p>\n\n\n\n <\/p>\n\n\n\n This is why it is important that both UX and UI refer to the W3C’sWCAG (Web Content Accessibility Guidelines)<\/strong>. Let’s take a look at them together.<\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n The WCAG (Web Content Accessibility Guidelines) are internationally recognised guidelines for making digital content accessible<\/strong>. They are developed by the W3C (World Wide Web Consortium)<\/strong> and are now the benchmark standard for companies, public bodies and institutions.<\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n Their goal is to ensure that websites, apps, and platforms are designed without barriers<\/strong>, following four fundamental principles:<\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n Compliance levels A, AA and AAA are a kind of scale that indicates how well a website complies with accessibility standards<\/strong>. Each level has increasingly stringent accessibility requirements.<\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n The level of accessibility support varies greatly depending on the platform used. For example:<\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n In summary: the CMS or framework alone does not guarantee an accessible website. It is the UX\/UI design, combined with the right technical skills and testing, that makes the difference.<\/strong><\/p>\n\n\n\n <\/p>\n\n\n\n <\/p>\n\n\n\n Making a website accessible<\/strong> isn’t just about being a hero: it’s a smart business decision<\/strong>. <\/p>\n\n\n\n <\/p>\n\n\n\n The more people can navigate your site \u2192 the more satisfied users you will have \u2192 the greater the chances of conversion \u2192 the greater the chances of repeat customers<\/p>\n\n\n\n <\/p>\n\n\n\n In addition, here are some figures:<\/p>\n\n\n\n <\/p>\n\n\n\n According to the World Health Organisation (WHO)<\/a>, over 1.3 billion people worldwide live with some form of disability. This represents about 16% of the global population, or 1 in 6 people.<\/p>\n\n\n\n <\/p>\n\n\n\n If we narrow it down to the European Union alone, we have approximately 87 million people living with disabilities (source: Eurostat<\/a>), or almost 20% of the European population. This translates into 16-20% more potential users for your business, as well as a greater likelihood of profit from customers you had not considered.<\/p>\n\n\n\n <\/p>\n\n\n\n At SAY, we believe that designing a website or app with a focus on accessibility means putting everyone at the centre, without leaving anyone behind.<\/p>\n\n\n\n <\/p>\n\n\n\n And let’s face it: when an interface works for everyone, that’s when we can be happy that we’ve created something truly successful.<\/p>\n\n\n\n <\/p>\n\n\n\n Accessibility is therefore not a technical issue for specialists, but a way of thinking and designing. It is empathy sublimated into interface and experience. It is attention that translates into value.<\/strong><\/p>\n\n\n\n <\/p>\n\n\n\n Let’s make your portal accessible, together.<\/span><\/p>\n<\/div>\n \n \n
What is digital accessibility (in simple terms)<\/h2>\n\n\n\n
UI components: are the ones we use truly accessible?<\/h2>\n\n\n\n
\n
UX and UI: the pillars of inclusivity<\/h2>\n\n\n\n
\n
\n
WCAG<\/h2>\n\n\n\n
The four fundamental principles<\/h3>\n\n\n\n
\n
Compliance levels: A, AA, AAA<\/h3>\n\n\n\n
\n
CMS and frameworks: not all are the same<\/h2>\n\n\n\n
\n
Why it’s good for all businesses (yes, even yours)<\/h2>\n\n\n\n
Not a \u2018plus\u2019, but a responsibility<\/h2>\n\n\n\n