Design With Pride: 7 Tips for Making an LGBTQ+ Friendly Website
The 2021 edition of Pride Month marks 51 years since the first Pride march was held in New York City, marking a pivotal moment in the Gay Liberation Movement, the Stonewall demonstrations. It’s a time each year when LGBTQ+ communities celebrate who they are, and advocate their desire to be free from persecution and discrimination.
Here at Wix, we believe inclusivity on the web is an essential part of website design—not only during Pride Month, but every day.
By creating a website that’s LGBTQ+ friendly, you can make browsing experiences more inclusive and welcoming for different communities. To help you get started, here are some tips on how to make an LGBTQ+ friendly site that will embrace the diversity of the Pride community that will elevate your online presence.
Notes from Wix Rainbow: Why does designing an LGBTQ+ friendly website matter?
An LGBTQ+ friendly website is one that is designed to create an authentic and inclusive experience for members of this diverse community.
Before we get into the basics of how to make your site LGBTQ+ friendly, we sat down with Alejandro de la Torre, head of Wix Rainbow USA, to get a better understanding of why it matters. (Wix Rainbow is an internal and grassroots initiative that empowers, inspires, supports, and encourages our employees to be inclusive, and advocate for, and support their local LGBTQ+ communities).
Create an inclusive user experience for LGBTQ+ visitors
When asked why a business or individual should pay attention to making their website LGBTQ+ friendly, de la Torre says that many people don’t recognize that there are unconscious biases in design and language. “The LGBTQ+ community is constantly experiencing microaggressions in everyday conversations or online visits that shouldn't be part of the speech to begin with,” he says.
Making your site inclusive starts with user experience. When you learn how to design a website, you’ll start to consider the visual elements that make your site look good, and the functional elements that will ensure a positive browsing experience for users. But there are some properties of web design that go beyond form and function; the images, language, and data you use can also impact your site visitors emotionally.
For businesses online, emotional engagement with a brand’s digital content is a powerful marketing tool that nurtures customer loyalty. When it comes to including the LGBTQ+ community, website owners should be cognizant of how their content might make groups feel excluded and even discriminated against.
“The online platform, in general, should be more people-friendly and inclusive,” says de la Torre. We should stop assuming, become less concerned about what our society thinks is right or wrong and instead focus on creating a better, more beautiful world for all.”
An LGBTQ+ friendly site is good for business
Making your website LGBTQ+ friendly is also smart for business, de la Torre points out. “Everything should be about inclusion. Businesses who pay attention to this are not only going to be inclusive and celebrate diversity, but also they will experience growth,” he says.
Running an inclusive business and website will help carve out space for your brand within the LGBTQ+ world—and with 5.6 percent of adults in the United States alone identifying as lesbian, gay, bisexual, or transgender, it’s safe to say that market is significant. Most importantly, providing a safe space for LGBTQ+ customers to browse, shop, and interact online will improve your brand image and foster a sense of loyalty.
Design tips for an LGBTQ+ friendly website
Whether you're creating a website for a business, a blog, or an online portfolio, one of your goals should be to design a site for the wide range of people who will interact with it, including the LGBTQ+ community. Small steps can lead to big changes, and here are seven ways to make your website more LGBTQ+ friendly:
How to create an LGBTQ+ friendly website
Use diverse images of LGBTQ+ individuals
Incorporate gender neutral terms into your site’s copy
Implement LGBTQ+ friendly security practices
Optimize for LGBTQ+ searches
Protect LGBTQ+ users from harassment
Support LGBTQ+ products
Don’t just talk about inclusivity, show it
01. Use diverse images of LGBTQ+ individuals
Visuals can be used throughout your website’s design to help visitors understand your business’s community, products or services. These visuals are not only representative, they also set the tone for your brand’s style and voice, shaping the public’s perception of what you stand for.
When it comes to choosing the imagery for your site, you’ll want to prove that your brand is inclusive of all people. You can include the LGBTQ+ community by using images of gay and lesbian couples, transgender people, and other groups. This will allow your brand to tell a more diverse story, while showing the LGBTQ+ community they are represented.
Before you start your image search, keep in mind that many free stock photo sites are still concentrated with cliches. When seeking more diverse options, we recommend checking out Shutterstock, Unsplash, and Vice’s The Gender Spectrum Collection, each offering hundreds of free high-quality images and curated diversity collections.
When you design a site with Wix, you can add images to your site from the Wix Media Manager, where you’ll find many options for Pride photographs and vector art.
02. Incorporate gender neutral terms into your site’s copy
Written content plays a big role in your website’s perception and performance, whether it’s how you describe yourself in an About Us page, product details on your online store, or the copy used in contact forms.
When writing your web content, you’ll need to be mindful that not everyone within the LGBTQ+ community puts themselves in a “male” or “female” box. For many individuals, coming out with their sexual orientation is just the first step toward understanding or defining their gender identification. It’s not uncommon for a transgender individual to experience frustrations when, for example, they are asked to confirm their gender online but aren’t provided with an option that’s relevant for them.
“Businesses should remove questions about gender from the conversation,” says de la Torre. “Questions like ‘what's your gender?’ make everyone transitioning or identifying themselves with a gender outside the gender roles that our society built feel discriminated against and alienated.”
You can use more inclusive language online by applying gender neutral syntax throughout your site’s text. For instance, you may opt for gender neutral occupations (e.g. using “server” instead of “waitress” and “waiter”) or using “they” instead of “he” or “she” when relevant.
As de la Torre emphasizes, you’ll want to be especially cognizant when requesting information from users on your site. One place to consider is your email signup form. “We should be using a more neutral language that supports and enforces inclusion, and online businesses should embrace the change,” he says. “Instead of pre-populating answers for gender-related questions, why not leave a blank space for users to share whatever they want?”
If there is a form on your website that requests visitors to check off a box for “male” or “female,” you should also have an option for “other.” Alternatively, you may choose to skip this step altogether.
03. Implement LGBTQ+ friendly security practices
Imagine this: A user decides to pay for password protected content on your website. They take out their credit card, start filling in personal details, choose a username and finally, a password.
Next, they get to the security questions, a common—and even comforting—practice users come across when interacting with an extra secure website. The first question they’re asked is “What is your mother’s maiden name?” However, what if the user doesn’t have a mother, but two fathers?
Microinteractions like this may seem trivial, but they create a barrier between you and the customer. Your site can easily facilitate a less discouraging experience for LGBTQ+ visitors by omitting instances where they might be stumped by a sense of cyber-alienation.
04. Optimize for LGBTQ+ searches
Metadata are short bits of text used throughout your website that let search engines know how you should appear in search results. These include meta (or SEO) descriptions, alt text, and tags. Strategic incorporation of metadata can boost your site’s traffic and let you reach the right audiences, including the LGBTQ+ community.
This isn’t simply a hack to perform better on search results. When members of the LGBTQ+ community seek a product or service online, it’s likely that they’re specifying their search further to find the brands that welcome them. For example, if you’re running a fitness website, including “LGBTQ friendly” in the meta description of a group class will grab the attention of LGBTQ+ customers looking for a safe and inclusive space to workout.
When it’s relevant, you might want to include phrases like “LGBTQ+ friendly” within your website’s metadata. This will allow your site to be more easily found, used, and embraced by the LGBTQ+ community. It will also undoubtedly increase traffic to your website.
05. Protect the LGBTQ+ users from harassment
A website has the power to build a community around your personal brand or business. But that relationship isn’t a one-way street. As a business, it’s your responsibility to protect your community of customers when they’re in your space.
This is especially true of the language used in the comments sections, online forums, and blogs; LGBTQ+ users might experience harassment and discrimintation due to insensitive or hateful remarks in any of these forums. To protect the LGBTQ+ community on your site, you can monitor comments and posts on your website, help a user if they tell you they’re uncomfortable, and investigate or resolve other problems.
06. Support LGBTQ+ products
The booming eCommerce industry provides us with manifold opportunities for supporting the LGBTQ+ community. Many companies will show solidarity with the LGBTQ+ community during Pride by creating special collections of products and merchandise, often donating a percentage of sales to mark the occasion.
That said when you make a website LGBTQ+ friendly, try to think beyond rainbow merch and the month of June alone. One way is to consider adding a non-gendered section to your product page. This provides potential shoppers with a break from fashion gender norms and will likely inspire them to share this with their community.
07. Don’t just talk about inclusivity, show it
It’s easy to talk about your love for the LGTBQ+ community online, but proving your business is friendly to the community requires action. Even brands that back Pride Month in big ways by investing in sponsorships, merch, or social media campaigns still overlook the issues LGBTQ+ users regularly experience on the web.
De la Torre points out that some brands “create Pride collections and then force you to select either male or female to see the items.” So although they are ostensibly showing support for the LGBTQ+ community, they’re not doing it in a thoughtful, deliberate, and inclusive way.
While there’s nothing wrong with gestures big and small playing a positive role in normalizing LGBTQ+ culture, as individuals we can make an impact by concentrating on the people we interact with on a daily basis. As owners of business websites, blogs, online stores, and more, this must include making an LGBTQ+ friendly website.
We hope you’ve learned how to apply these important, inclusive changes to your site. We also recommend reviewing resources about LGBTQ+ awareness, talking to members of the community, and—if the opportunity presents itself—ask a friend, family member or colleague from the LGBTQ+ community to review your website, and listen to their suggestions.
By Jenna Romano
Web Design Expert and Writer