How to make products more accessible?

As a product development company, we at Amalgama are quite aware of the importance of taking into account the accessibility in our projects and understanding the benefits for everyone. First of all, users, then our clientes. Yes, all those founders and startups trying to make on impact on their users lives MUST keep in mind the accessibility of their products in order to actually reach all their potential.

If you’ve ever been interested in implementing accessibility in your projects you may have heard about WCAG guidelines. In this article, you will find all the necessary information to take your first steps in the accessibility world.


What are the WCAG guidelines?

The WCAG guidelines, recognized, followed and demanded on an international level are a series of recommendations whose objective is to make our content more accessible and allow it to be used by the largest amount of people in as many circumstances as possible. These guidelines are posted by W3C, an international consortium that makes recommendations and standards for the web. Depending on the country we are in, we need to take into account the reach they will have in our project.


WCAG guidelines principles

Within the guidelines, we can differentiate 4 principles whose objectives are that every website is perceivable, operable, understandable and robust. In each principle, we have many rules that include several success criteria which are assessable on 3 different levels: A, double-A and triple-A. When it comes to testing success criteria, we have techniques that help us meet the criteria or the errors which don’t allow us to meet them (techniques are divided into sufficient and advisory techniques).


1. Perceivable

The first principle states that the website must be perceivable, meaning we need to offer several alternatives for people with different preferences or capabilities. One example of this is the criteria that talks about alternative text, where we would need to offer alternative texts for the images as long as they provide new information. Alt texts are very important in cases where the user utilizes a screen-reader and wants to hear about the information that image is showing. They are also relevant in cases where the images don’t load and we can just see the text.


2. Operable

The second principle states that the website must be operable, meaning that elements that require interaction by the user have to be accessible for people with different capabilities.

A success criteria within this principle that tells us functionalities must be accessible through keyboards so we have a guarantee that our website can be navigated and operated correctly using only the keyboard. I challenge you to navigate the following website just with your keyboard and post your experience in the comments below. I’ll leave this link here with the most common commands for navigation.


3. Understandable

The third principle refers to the information and the user operations being understandable which means that the text content must be legible and comprehensible, the navigation must be predictable and they need to help users correct or prevent mistakes. For example, it is important to be able to provide labels or instructions in a form, identifying the mistakes and describing them through a text. Lastly when an element receives the focus it prevents it from initiating any context change.


3. Robust

The fourth and last principle states that the website must be robust therefore may be interpreted by different browsers (like Chrome, Mozilla, and Safari). In addition, it has to interact with technical help like the screen reader, screen magnifier and much more.


Here we have some tips if you want to achieve this success criterion.

a- HTML elements have to have full opening and closing tags.

b- HTML elements have to be nested according to their specifications.

c- There can’t be duplicated attributes and the identifiers have to be unique.




The WCAG guidelines may seem a monster at the beginning with a huge amount of information, but to start step by step you just need to remember that you will evaluate success criteria depending on the scope defined above.

Consult all the time with the suggested techniques and the frequent errors that often appear! You now have the necessary knowledge to understand the guidelines. If you liked this article stay tuned for our next article on accessibility! Where we will be sharing in detail how we have to report an accessibility error.

By Axel Collante

If you have an idea or are working on a project you could use some help with, feel free to contact us! We’d be happy to help you… or who knows? Maybe be your new partner in crime.


You enjoyed this post and want to read more?


Subscribe to our monthly newsletter! 📬

* indicates required

800 450 Amalgama

What you’ll get

  • A prototype of the product to be built reflecting the product’s vision.
  • The roadmap for development.

What we’ll be
working on

  • Business Analysis and Planning
  • Market and audience analysis
  • Users analysis: interviews & surveys
  • Value proposition analysis & definition
  • Prototyping
  • User testings
  • Roadmap definition

What you’ll get:

Obviously, what you came for!
An amazing, cool, trendy, app web
or any kind of digital product.

What we’ll be working on:

  • Product Research & Strategy
  • Marketing & Growth strategy
  • Frontend and backend development
  • UX/UI Design, Research & testing
  • QA & QC
  • Naming & Branding

What you’ll get:

An appealing and unique website with smooth usability that your audience will love to engage with.

What we’ll be

working on:

  • Brand analysis and goals definition
  • Wireframing
  • Look & Feel application
  • Web Development

Swish 365

Swish’s founders came to us to build an app so that parents could book their children’s basketball sessions in a simple and fast way. Together we developed a mobile app and web app that also allows them to have visibility on the progress and results of their children.

Services offered
Product Discovery
Product Development

Mobile app for IOS and
Android App + Web App

iOS App
Android App


Privacy Preferences

When you visit our website, it may store information through your browser from specific services, usually in the form of cookies. Here you can change your Privacy preferences. It is worth noting that blocking some types of cookies may impact your experience on our website and the services we are able to offer.

For performance and security reasons we use Cloudflare
Our website uses cookies, mainly from 3rd party services. Define your Privacy Preferences and/or agree to our use of cookies.