Minnesota Department of Transportation

511 Travel Info

Design System

Social media accessibility

Social media accessibility isn’t optional—it’s a legal requirement under both state and federal guidelines. As a public agency, we have a responsibility to ensure our content can be accessed and understood by everyone, including people with disabilities. That means every post must meet accessibility standards for visuals, video, copy, and links.

Contact the social media team at socialmedia.dot@state.mn.us with any questions.

Copy

  • Write in plain, succinct language
  • Do not overuse caps—all caps is difficult to read
  • Use Pascal Case for hashtags with more than one word
    • Pascal Case is the practice of writing phrases without spaces or punctuation,capitalizing the first lette of each word to indicated word boundaries.
    • This makes it easier for screen readers to read multi-word hashtags
    • Example: #TowardZeroDeaths
  • Avoid special characters—assistive technologies read the formatting in an inaccessible way (reference video)
  • Use inclusive language that does not discount anyone based on characteristics such as gender, physical or mental disability, cultural background, etc.
  • Avoid the phrase “click here”—instead, use descriptive calls-to-action, such as: learn more, sign up, apply now

Visuals

Alt text

Always provide succinct, but accurate alt text for images, either in designated space for alt-text or in the post caption when this is not an option

  • Avoid repetition of text in post if possible
  • Write out words included in graphic
  • Do not use “image of,” “graphic of” etc.
  • Use long alt text if details are essential
  • Avoid sensory details
  • You can have fun with the alt text—always ensure that it is descriptive and details what is in the image well, but feel free to add a joke!
  • Examples:
    • Tweet: MnDOT at a glance
      3 U.S. Bicycle Routes
    • Tweet: Venn diagram. One circle is marked with a traffic cone. Text says: "Bright and visible / directs traffic & zipper merges; helps keep us all safe / Able to withstand weather conditions." The other circle is marked with a piece of candy corn. Text says: "looks like a traffic cone."
      The intersection of the two circles says: "Inedible." Facts.

Captions

Use both closed and open captions on videos.

Closed captions

The best way to create closed captions for videos is to use YouTube. The platform will create subtitles that you can edit as needed. Once complete, download the SRT file for other uses.

Open (burned-in) captions

Open captions are permanently embedded into a video and cannot be turned off or customizes by the viewer.

  • Place captions in the lower third with enough margin to avoid platform controls (10–15% from the bottom for 9:16; 5–10% for 16:9).
  • Use the Brandon Grotesque (MN State Brand) font with strong contrast; add a shadow or semi-transparent background if needed for readability.
  • Align captions with our visual brand if possible, but prioritize accessibility (white text on dark background when needed).
  • Keep captions short (1–2 lines) for a clean, unobtrusive look.
  • See TED Talks Reels on Instagram for strong examples of burned-in captions.

Use a color contrast of at least 4.5:1 in graphics and other visuals—use the WebAIM contrast checker for assistance.

Keep text on static graphics minimal—less is more for accessibility, and posts with clean visuals tend to perform better across platforms.

Emojis

  • Use emojis sparingly
    • When someone uses a screen reader or text-to-speech program to read an emoji, they hear the assigned description for that character
    • Example: 🚗 💨 🚛 🚧 🚴‍♂️ ⚠️ translates to “Automobile, Dashing Away, Articulated Lorry, Construction, Man Biking, Warning”
  • Place emojis at the end of social posts, when possible
    • More important information should be read by the user first and placing emojis in the middle of sentences/paragraphs can muddle the messaging when read aloud by a screen reader
    • For this same reason, don’t use emojis as bullet points in captions. For example, screen readers read the below caption, “Wrench Realigning the I-394 ramp to Dunwoody Blvd. Wrench Replacing the Penn Ave. bridge deck. Wrench Improving safety and accessibility.”

    🔧 Realigning the I-394 ramp to Dunwoody Blvd.
    🔧 Replacing the Penn Ave. bridge deck
    🔧 Improving safety and accessibility

  • Do not use emojis in profile names
  • Do not change the color on customizable emojis
    • Each icon has its own descriptive text that includes skin tones, making it hard to understand when read by screen readers
      • Example: ✌️ ✌🏻 ✌🏼 ✌🏽 ✌🏾 ✌🏿 translates to “Victory Hand, Victory Hand: Light Skin Tone, Victory Hand: Medium-Light Skin Tone, Victory Hand: Medium Skin Tone, Victory Hand: Medium-Dark Skin Tone, Victory Hand: Dark Skin Tone”
    • Choosing a specific skin tone is also less inclusive
  • Note: Here are two ways to find descriptive text for an emoji:
    • Option 1: Search for the emoji via emojipedia.org—Emojipedia lists all emojis by their names as read by screen readers
    • Option 2:  Place the emoji into a Word document, highlight it, select the “Review” tab in the toolbar, then select “Read Aloud” in the “Speech” panel