Accessibility and Inclusion

Whether you’re creating content for the web, social media, or print, it’s important to consider whether your work will be accessible to audiences of different abilities. Furthermore, as Paraqlet aims to reach diverse audiences, you should ensure your content reflects a wide variety of perspectives.

Accessibility

For accessibility guidelines not explicitly discussed, refer to Web Content Accessibility Guidelines 2.2. Web content should achieve at least Level AA compliance (more comprehensive compliance) when designing content. Better yet, strive towards Level AAA compliance (most comprehensive and strict compliance).

Accessibility in social media content

Learn about how to ensure your social media content is accessible from the guidelines below.

Emojis

Emojis can be a fun way to express emotions in your content or to add interesting visual contrast in plain text. However, there are guidelines to which you must adhere when using them to ensure your content remains accessible:

  • Place important information before emojis.

  • Use emojis in moderation. Avoid repeating emojis or using too many in quick succession.

  • Avoid using emojis as bullet points.

Hashtags

Capitalize each word in a hashtag, including articles, prepositions, and conjunctions. This helps screen readers and text-to-speech software parse words separately, improving readability.

  • #ConnectionAndCommunity

  • #Paraqlet

  • #ANightToRemember

  • #BIPOCVoices

URLs

Avoid using long URLs in your social media content, especially if the platform you’re working on does not support rich text. Use a link shortener like TinyURL to ensure the URL does not affect readability or accessibility.

Do not end a sentence with a URL, as readers may mistake the period at the end of the sentence as part of the URL. Avoid starting a sentence with a URL.

For URLs in web content, use descriptive hyperlink text to ensure readability for links. To learn more, see Descriptive writing.

ASCII art

ASCII art uses alphanumeric characters, punctuation marks, and other characters from the American Standard Code for Information Interchange (ASCII) to form pictures.

ASCII art is inaccessible to those using screen readers or text-to-speech programs. These programs will read aloud each individual character, which can become tedious. Additionally, ASCII art is not responsive, meaning the formatting can shift depending on the device or browser the user is using to view your content.

The most accessible way to include ASCII art in your content is to create it in a blank word processor document, take a screenshot, and include alt text describing the artwork.

Alt text: ASCII art of a cat’s face with a surprised expression.

See Accessibility in audio-visual content for more information on alt text.

Accessibility in audio-visual content

For photographs and graphics, including those that include text (e.g. Instagram posts), provide alt text. Describe the content such that the user can understand it without needing to see the visuals. You do not need to write alt text for decorative images or graphic designs (those that do not convey useful information to users).

Alt text: A Black woman in a purple sweater and lilac eyeshadow holds a phone, tapping the screen while smiling.

Avoid using flashing lights or strobing content in videos. If you must use flashing or strobing content, provide a warning at the beginning of the video.

  • Warning: This video includes flashing lights.

  • Warning: The following video contains strobing content.

Refrain from having audio and videos on websites autoplay. Ensure there is a mechanism to control the volume of audio-visual content that exists independent of system volume controls.

Captions and transcripts

For video and audio content, provide closed captioning and accurate transcripts, respectively. Include all speech and sounds that are necessary to understand the content (e.g. applause). For videos, include descriptions of any visuals that are necessary to understand the content.

Make sure to use a readable font for captions and transcripts; refrain from using overly decorative fonts such as script or calligraphic typefaces.

When you create closed captions, follow the guidelines below to ensure cohesion across Paraqlet’s audio-visual content:

  • All captions should have white text on a translucent black background.

  • Captions should be at least 22 pt size by default.

  • A single occurrence of captions should not exceed three lines in length.

  • During long intervals of silence, remove the last caption frame.

  • Avoid over-using emojis in shortform video (e.g. TikTok, Instagram reels) captions. Do not use emojis in longform video (e.g. YouTube) captions. For more information on accessibility in emoji usage, see Emojis.

For audio transcripts, follow the guidelines below:

  • Use the same typeface and font size for transcripts as for other written content that corresponds to your content (such as a transcript for a podcast episode that corresponds to a certain blog post). Use headings to separate a transcript from other written content.

  • Include the transcript directly below the audio it describes.

  • When transcribing speech, make it clear who is speaking by including a dialogue tag formatted in bold just prior to the spoken words.

    • Upon the first usage of the speaker’s name, write out their full name. In future uses, just write the speaker’s surname. Include a colon after the speaker’s name.

  • Separate each speaker’s dialogue into different paragraphs for readability.

  • Describe any background sounds or soundbites that are important to understanding the audio content. Place descriptions in between square brackets in their own paragraphs.

Here is what a transcript of part of a podcast might look like:

[Upbeat instrumental sting]

Sylvain Labonté: Hi there. I’m Sylvain Labonté, Creative Team Lead here at Paraqlet. Welcome back to another episode of Snapshot. Today, I have with me a good friend and colleague, Victoria Cuervo.

Victoria Cuervo: Thanks for having me, Sylvain!

Labonté: Of course! We’ll be talking all about landscape photography, starting with understanding how to use light.

Cuervo: Landscape photography often uses natural light like sunlight to convey depth and emotion in compositions.

Content visibility

It is important to ensure users can clearly see the text of your content against the background.

WCAG requires a contrast ratio of at least 4:5:1 for normal text and at least 3:1 for large text to achieve Level AA compliance. To achieve Level AAA compliance, you need at least a 7:1 contrast ratio for normal text and at least 4:5:1 ratio for normal text.

You can use an online tool such as the WebAIM Contrast Checker to see if the colors you have chosen meet this standard.

Do not rely on color alone to convey information. For instance, links should be both underlined and colored differently from plain text. Headings should be both bolded and a different color from body text.

WCAG does not specify minimum text sizes. A good starting point is 16px (12pt) font for body text and 24px (18pt) for headers.

Responsive web design

Assume users view your content on a variety of different devices, including smartphones and tablets. Adhere to the guidelines below to ensure all users can enjoy a high-quality experience:

  • Write brief but descriptive headlines and image captions.

  • Make sure your paragraphs and content sections are short. Users should ideally not have to scroll down in order to see the full paragraph on a smartphone.

  • With tables, limit the number of columns.

    • Avoid compressing columns into a narrow space by setting a minimum width for the columns (e.g. if you are styling a table in CSS).

    • Make the header row sticky; that is, anchor the header row to the top of the screen as the user scrolls down to see more rows in the table.

The same code is served to smartphones, desktop computers, tablets, and other device. Be aware that a website’s content is rearranged to fit different screen sizes, so three columns of content on a desktop may become two on a tablet or one on a smartphone. Whereas a desktop user may be able to find the content they want relatively easily, a smartphone user may have to endure long periods of scrolling. For this reason, test your web content on a mobile device first before doing so for a desktop or PC.

Ideally, users should be able to resize text, save for captions and images of text, up to 200% without losing content or functionality. To test this, display your written content in a web browser and zoom in to 200%. Check to see if the content’s visibility or functionality changes. If it does, try reformatting your content to be more responsive.

Accessibility in written content

As discussed in Accessibility in audio-visual content, it is important to provide alt text for visual content to ensure users with screen readers can properly perceive your audio-visual content. It is equally as important to ensure content you write for social media and the web are accessible to those with disabilities.

Structuring content for accessibility

Use brief, informative titles and headings to describe the different sections of your written content. Headings should group together related paragraphs and provide a clear outline of your content.

For instance, in a blog post on the impact of Paraqlet’s work on a local small business, you may choose to organize your writing into sections that outline a narrative flow.

  • Why Beyond Extraordinary came to Paraqlet

    • Background

    • Problem statement

  • Paraqlet’s solution

  • Developing the solution

  • Implementing the solution

  • Impact of Paraqlet’s work on Beyond Extraordinary

Descriptive writing

Provide alt text for audio-visual content. See Accessibility in audio-visual content for more information on alt text.

Use informative hyperlink text. Refrain from using phrases such as Click here and Read more without additional description, as they do not provide sufficient context for users with screen readers to understand the destination of a hyperlink.

Instead of Use

Click here for more information.

Check out our case studies for more information on the work we’ve done for clients in the past.

You can find more information on the event here.

You can find more information on the event on the "Events" page of our website.

Read more in our Portfolio.

Read the Beyond Extraordinary case study in our Portfolio to learn how we helped this small business spread the word about their products.

Avoid using download links, which cause the user’s browser to download a file or folder when clicked. When a hyperlink links out to a document, such as a PDF, be sure to include information on the document type and size.

Read our proposal documentation [PDF; 1,900 KB] to learn more about Paraqlet’s upcoming collaboration with Beyond Extraordinary.

Inclusion

We want Paraqlet to be an inclusive organization. That inclusivity extends to how we communicate our brand values, work, and stories. Learn about how to create inclusive content from the guidelines below.

Inclusive imagery

Choose generic images that are appropriate regardless of a user’s country of origin. Be aware of your target audience and select imagery that resonates with them while avoiding images with negative connotations.

When selecting graphics or images to accompany your content, follow these guidelines:

  • Avoid hand gestures, which may have different meanings depending on their cultural context.

  • Avoid imagery of famous buildings or landmarks, which may be associated with politics or religion, or have legal protection against using such imagery for commercial purposes.

  • Do not use country flags to denote languages, as many countries have several different official and unofficial languages.

In addition, try to select imagery that depicts diversity on the basis of factors such as:

  • Race and culture

  • Gender identity and expression

  • Age

  • Ability

  • Sexual orientation and family structure

  • Socioeconomic class

Inclusive writing

Refrain from using slang terms—especially those that could be viewed as culturally appropriative—such as spirit animal and guru. Never use profane or derogatory language. If a person you are quoting (e.g. for a blog post) has used profane or derogatory language, consider paraphrasing the quotation to avoid directly quoting any offensive language.

Gender-neutral communication

Refrain from using third-person pronouns (e.g. his, hers) in generic references or hypothetical scenarios. Instead, rewrite sentences to use second-person pronouns (e.g. you, your, yours).

See Pronouns for guidance on using pronouns in your content.

Use gender-neutral alternatives for common terms when available. However, refrain from using unfamiliar constructions for the sake of gender neutrality (e.g. snowperson instead of snowman).

Gender-neutral alternatives for common terms
Use this Instead of

Chair, moderator

Chairman, chairwoman

Humanity

Mankind

Workforce, staff, employees, personnel

Manpower

Synthetic, artificial, manufactured

Manmade

Operates

Mans

Firefighter

Fireman, firewoman

Police officer

Policeman, policewoman

Council member

Councilman, councilwoman

Additionally, avoid addressing audiences (such as in videos) with gendered language such as guys or ladies and gentlemen. Instead, select a gender-neutral alternative such as everyone or folks.

Constructions such as Latinx and Latine as gender-neutral alternatives to Latino and Latina, as well as Filipinx in place of Filipino and Filipina are contested. As these constructions do not translate smoothly into the gendered languages of Spanish and Tagolog, refrain from using them. Instead, use the grammatically masculine Latinos and Filipinos to refer to the respective populations.

On a case-by-case basis, you may use the above constructions if specifically requested (e.g. if a person you are interviewing for a blog post specifically requests to be referred to as Latinx instead of Latino).

Writing in languages other than English

Refrain from italicizing or otherwise applying special formatting to words you write in a language other than English. This includes loanwords and quotations from people who are speaking or writing in a language other than English.

Looking at the agency’s graphic design work, Étienne noted there was a certain je ne sais quoi about their art style.

Note that the same grammar guidelines from Grammar and Mechanics apply when using a non-English language as when using English. Similarly, formatting guidelines from Formatting and Content apply when formatting non-English text.