I tend to write about more technical software engineering subjects on this site (it is called code-driven development after all). But inclusivity is a related topic that I feel is very important - especially if you are a frontend engineer.

Frontend engineering seems to evolve at a high speed, with new libraries, technology, Web APIs and browser features coming out all the time - and this is something that frontend engineers love to chat about.

But apart from some accessibility circles, I rarely hear about inclusive design being brought up or discussed.

This article is my interpretation of what inclusive design is about, aimed specifically at engineers who work with design/product teams to deliver a web application.

The Key Question: What is Inclusive Design?

Inclusive design is a part of web accessibility that focuses on ensuring web applications are usable by everyone.

This includes people such as:

• people with mobility issues
  • who might rely solely on keyboard navigation instead of a mouse.
• people with visual impairments
  • who require larger text or screen readers.
• with sight issues
  • they may require larger font sizes or better colour contrasts to read text
• those who are not as tech-savvy
  • common icons like 'hamburger menus' or 'save' (floppy disk) icons may not be intuitive.
• Non-native English speakers who might struggle with complex language
• or who are on a slow internet speed

Engineers can often fall into the demographic of young, able-bodied - and it is easy then to forget about other needs and requirements by those who use the apps we release.

One challenge as frontend engineers is remembering and catering to the diverse ways in which different users interact with our applications.

The Crucial Role of Inclusive Design: A Fundamental Perspective

Around 20% of the world has some form of disability, with a majority of those being impacted by them during their working years. (it isn't just pensioners!)

I think as engineers it is our responsibility to implement things in an inclusive way.

Take the hypothetical example of a newly constructed school that's inaccessible to wheelchair users. This (I hope!) would be immediately flagged as an inclusivity issue. Unfortunately, similar issues in web applications often go unnoticed or justified somehow.

The Business Case for Inclusive Design

Ok, I know the reality. We can't all push for better accessibility and inclusivity just by sticking to our principles that it is the right thing to do.

There has to be a case for a business to invest in this.

Contractual Obligations

A very strong argument for inclusive design in B2B SaaS applications is the demand for accessibility compliance in contracts. This can tend to happen more often when working with larger clients.

Often, the realisation of potentially losing a contract due to accessibility/inclusivity issues can force your company to putting more effort on making a more inclusive and accessible app. It is unfortunate that the reality is that this (along with legal threats) is often the only time some companies get behind making inclusive design a focus.

More customers, larger market react

An application that's accessible to 100% of the population has a wider potential customer base, compared to one that excludes a portion of users.

This is an obvious point... however personally I've found it often does not have much impact in terms of swaying companies/leadership to consider inclusive design.

There is a strong belief that people that have accessibility requirements figure out how to use our apps. Even if this is true, it would often mean spending more time on figuring out how to use inaccessible applications (where do they get that extra time from?).

Better user experience

Inclusive design leads to a better user experience - for everyone!

By considering the varied needs and circumstances of users, an application becomes more user-friendly.

Legal compliance

My least favourite way to persuade a company to think about inclusive design is to remind them about the legalities.

There are legal frameworks in place to ensure that people are not excluded. Examples such as in the EU or USA.

Implementing Inclusive Design: A Practical Approach for Engineers

For engineers looking to embrace inclusive design, you should start by discussing this with your product and design teams. You might be the one implementing things, but you have to get others on your side too.

Understand user diversity

Your users do not all fit the same pattern. They have different backgrounds and different ways of accessing your application. They can also have things such as:

• Temporary impairments (like a broken arm)
• Situational limitations (like using a device in bright sunlight with glare)
• Varying cognitive abilities and learning styles.

You also should consider that not everyone is from your country, speaking your language. There can be important cultural differences.

Get familiar with accessibility

I think accessibility is a core part of frontend engineering. You should be familiar with it, understand how it works, and know how to implement accessible solutions.

Getting a professional audit (from a company, not a free online tool - they are good for low-hanging fruit but a real accessibility audit will reveal things you would not have come across otherwise) can go a long way to understanding where the weaknesses lie in your application.

Case studies of improving inclusivity in web applications

It can often be useful to see how companies solved real inclusivity issues.

It can be quite hard to find nice case studies or resources on this but here are some resources which I've found useful before.

• Slides from a talk about digital inclusivity
• Nice collection of case studies from Scope
• Some older case studies on w3.org
• Airbnb have a nice guide on how they made their platform accessible. It focuses on making sure those with disabilities can book suitable accommodation more than any engineering related topics.
• Write up about Netflix.