Inclusive Design Diverse Group Around Laptop

Putting inclusive design principles into practice throughout the website design process

9 min read
Jennifer Bourn

Diversity and inclusion in web design is critical to the long-term success of any creative process. Creativity is about seeing things in a new and different way and solving problems with intuitive solutions not yet thought of; web design requires creativity and to achieve creative quality, you need creative diversity. Being aware of the principles of inclusive design can help broaden your perspective.

Fabricio Teixeira asks in an interview for San Francisco Design Week, “As designers, we spend most of our day imagining and building experiences that, when added up, take a big portion of people’s days and affect a lot of the relationships they have with other people and with the world around them. We design signup forms for government websites that ask people to define their ethnicity. We design profile pages in social networking apps where people define how they want to be seen in the world. We also design online forums, medical forms, services for citizens, social interactions, dating apps, learning platforms — the list is huge. Aren’t we somehow responsible for more inclusive, diverse experiences?”

When considering diversity and inclusion as part of the web design process, we as professionals need to address what happens in our companies, behind the scenes of projects and how the final product is presented to end users.

Diversity and inclusion in the design agency

When creative companies and design agencies hire within their network, hire friends, and hire people just like them for “culture fit,” you end up with teams where everyone looks the same, has had similar life experiences, and thinks alike.

The problem is that hiring for culture fit alone often fails to build teams that reflect the diversity needed to design an end product relevant to the audience they are trying to reach.

As a result, you end up with design teams creating experiences for people who are not like them, with stories and needs that are not fully understood.

Diversity in web design means building non-homogeneous companies and teams with a wide variety of backgrounds, beliefs and life experiences where all people feel valued, involved, connected and respected.

This ensures that everyone who is part of the design process is surrounded and supported by a diverse group of colleagues who will challenge assumptions, ask insightful questions, and review concepts with a discerning eye.

Related: 14 tips for successful web design projects

Tracy Levesque, diversity champion and co-founder of the web design agency Yikes, Inc. in Philadelphia, speaks often about diversity and inclusion in web design. I’ve had the privilege of learning from her on multiple occasions.

Tracy states that “diverse and empowered teams create better, more inclusive products.”

And, according to Sylvia Ann Hewlett, Melinda Marshall and Laura Sherbin in "How Diversity Can Drive Innovation," “when at least one member of a team has traits in common with the end user, the entire team better understands that user.”

“Diversity is being invited to the party. Inclusion is being asked to dance.” ~ Vernā Myers

Inclusive web design means not only building a diverse team, but giving everyone on the team a voice that is valued and looking outside the team for valuable insights and feedback.

Inclusivity is considering the perceptions, experiences, and needs of the widest variety of people possible throughout the design process, from ideation and planning , design, development, testing and launch so we can use design to enable better, more positive experiences for the users of our products.

Diversity and inclusion in our design work

In her presentation Diversity Works, Levesque features visionary television producer Shonda Rhimes. She states, “I really hate the word ‘diversity.’ I have a different word: normalizing. I am making TV look like the world looks. Women, people of color, LGBTQ people equal way more than 50 percent of the population. Which means it ain't out of the ordinary.”

Designers, photographers and creative teams can learn a lot from Shonda Rhimes.

Designers need to stop looking at diversity and inclusion as a tactic or strategy and begin seeing it as the expected norm.

To make diversity and inclusion a foundational part of your design process, begin by thinking about web accessibility and plan your web design projects with all potential users in mind. Ask yourself:

  • Is the design clear and concise, and does it follow expected conventions? Is the clickable logo in the upper left where it is expected to be? Is the navigation at the top? Is interacting with the design as easy as possible?
  • Are all elements of the site keyboard-navigable and screen reader friendly?
  • Are you considering that blind site users often prefer navigating the site using the site map because it is less cluttered and creating ways to move through the website other than the primary navigation menu?
  • Are you thinking through any user interaction that affects a change, like links, so you can alert users in advance to what they do?
  • Are the forms easily completable by all users? Have you considered instructions, labels, form field interaction, indication of required fields, indication of all form stages and the current stage, error messaging, error handling, and success messaging? Do your forms have a “skip to errors” link at the top of the page to help blind users fix their form errors without frustration?

Related: What is web accessibility, why does it matter, and how do you get started?

Practice inclusive design

Then, take accessible web design a step further and practice inclusive web design. Ask yourself:

  • Am I creating a brand experience that is relevant and relatable to the widest audience possible?
  • Does the imagery on the website represent a diverse group of people and the normalcy of the world we live in? Are different ages, races, genders, and styles of people represented so all visitors feel welcomed and that they are in the right place?
  • When referring to hypothetical people, are you using gender neutral pronouns or at minimum, are you switching between gender specific pronouns equally?
  • Do your membership applications and job descriptions use masculine wording that alienates women applicants? Or is it welcoming for all candidates?
  • Are you making unfair gender assumptions in your design? Please stop making all things for women pink and soft and ultra girly and using bro-culture language on gaming and sports sites!
  • Do you include a diverse group of people in your brainstorming and strategy sessions? Are you hosting focus groups with a wide range of potential users? Are you investing time in actual user research?
  • If a form asks for a person’s gender, are you providing non-binary choices or forcing every person to choose male or female?

Related: Developing gender equality in web design

You also have the opportunity to become a champion for diversity and inclusion in your own business, within your company, and in the industry.

Become a mentor

Work with someone who is very different from you; someone with a different nationality, race, gender, age or background. Mentorship is a valuable opportunity to encourage and foster the potential of up and coming talent, improve the design industry as a whole, and widen your own awareness and experience.

Speak out against discrimination

Speak out no matter how subtle or passive a comment or action may be. The act of standing up for another person demonstrates support and communicates that they matter, they are valued, and that their contributions are needed. You may think speaking up is a small action, but to someone who is underrepresented or feels uncomfortable, it can make a big difference.

Keep diversity top of mind

Be aware of diversity any time you’re in a group or meeting, on a committee or board, at an event, conference, or workshop, or in a class or training. If the group is too homogeneous and almost everyone looks and sounds the same, check-in with the organizers to find out why and how this can be changed in the future.

Hold events accountable

If you see an invite to an event, conference or workshop and there is little to no diversity in the lineup of speakers, reach out, as they may not be aware of the impact their speaker selection and choices have.

Build a more diverse network

When you’re networking, make an effort to introduce yourself to and connect with people who are different from you so you can build a diverse network that expands your mindset and awareness.

Use a blind application process when hiring

This is where applications are anonymized candidates and all hints of gender or race are generalized. With this approach, you can remove all bias and evaluate candidates on their talent, skill, work and potential alone, and not how they sound or what they look like.

Conclusion: Build inclusive design into your work

What you need to remember is that a lack of diversity hurts everyone in the tech community.

According to Ankita Saxena in "Workforce Diversity: A Key to Improve Productivity," in research-oriented and high-tech industries, the broad base of talents generated by a gender-and ethnic-diverse organization becomes a priceless advantage.

Once again, diversity and inclusion in web design are critical to the long-term success of any creative process and imperative in the design of positive experiences.

Web designers are in the unique position of creating websites, apps, platforms and tools that people around the world interact with on a daily basis. Our work affects their work and relationships and shapes their moods and actions.

Our work has the power to make people feel welcome, giving them a sense of belonging. Yet, it also has the power to alienate people and make them feel alone.

As a web designer, I implore you to use your talent, skills and position to step up and be an ally for those who are underrepresented. Be a champion for increased diversity and inclusion in web design because then we can elevate the industry as a whole, create better work, and do more good.

Products Used