Create Accessible Social Media

<!DOCTYPE html> <html lang="en"> <head>  <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="robots" content="index, follow">  <meta name="HandheldFriendly" content="True"> <meta name="MobileOptimized" content="320"> <meta name="viewport" content="width=device-width, initial-scale=1.0">  <title>Create Accessible Social Media | Section508.gov</title> <meta property="og:title" content="Section508.gov"> <meta name="description" content="Information about the Section508.gov website, GSA’s Government-wide IT Accessibility Team, and guidance to Federal agencies on accessible information and communication technology (ICT)."> <meta property="og:description" content="Information about the Section508.gov website, GSA’s Government-wide IT Accessibility Team, and guidance to Federal agencies on accessible information and communication technology (ICT)."> <meta property="og:image" content="https://assets.section508.gov/files/images/social-media-og-image.jpg"> <meta name="twitter:image" content="https://assets.section508.gov/files/images/social-media-og-image.jpg" />  <meta name="twitter:card" content="summary" /> <meta name="twitter:site" content="@" /> <meta name="twitter:title" content="Section508.gov" /> <meta name="twitter:description" content="Information about the Section508.gov website, GSA’s Government-wide IT Accessibility Team, and guidance to Federal agencies on accessible information and communication technology (ICT)." /> <meta property="og:type" content="article"> <link rel="canonical" href="https://www.section508.gov/create/social-media/" /> <meta property="og:url" content="https://www.section508.gov/create/social-media/" />   <link rel="shortcut icon" type="image/ico" href="/assets/images/favicon.ico" /> <link rel="icon" type="image/png" href="/assets/images/favicon.ico" /> <link rel="icon" type="image/png" sizes="192x192" href="/assets/images/android-chrome-192x192.png" /> <link rel="apple-touch-icon" sizes="180x180" href="/assets/images/apple-touch-icon.png" /> <link rel="icon" type="image/png" sizes="32x32" href="/assets/images/favicon-32x32.png" /> <link rel="icon" type="image/png" sizes="16x16" href="/assets/images/favicon-16x16.png" /> <link rel="manifest" href="/assets/images/site.webmanifest" />  <link rel="stylesheet" type="text/css" href="/assets/css/index.css?1732224641581990839"> <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script> <script src="/assets/js/uswds-init.min.js?1732224641581990839"></script>  <meta name="topic" content="Content creation (create)"> <meta name="sub-topic" content="Social Media"> <meta name="audience" content="Federal employee (fedemp), Public (public), Designer (design)"> <meta name="resource-type" content="Process/How-to"> <meta name="format" content="HTML (html)"> </head> <body> <section aria-label="Official Government Site Banner" class="page-landing-page layout-demo "> <a class="usa-skipnav" href="#main-content">Skip to secondary navigation</a> <a class="usa-skipnav" href="#content-section">Skip to main content</a> <div class="usa-banner" aria-label="Official website of the United States government" > <div class="usa-accordion"> <header class="usa-banner__header"> <div class="usa-banner__inner"> <div class="grid-col-auto"> <img aria-hidden="true" class="usa-banner__header-flag" src="/assets/img/us_flag_small.png" alt="U.S. flag" /> </div> <div class="grid-col-fill tablet:grid-col-auto" aria-hidden="true"> <p class="usa-banner__header-text"> An official website of the United States government </p> <p class="usa-banner__header-action">Here’s how you know</p> </div> <button type="button" class="usa-accordion__button usa-banner__button" aria-expanded="false" aria-controls="gov-banner-default" > <span class="usa-banner__button-text">Here’s how you know</span> </button> </div> </header> <div class="usa-banner__content usa-accordion__content" id="gov-banner-default" hidden="" > <div class="grid-row grid-gap-lg"> <div class="usa-banner__guidance tablet:grid-col-6"> <img class="usa-banner__icon usa-media-block__img" src="/assets/img/icon-dot-gov.svg" role="img" alt="Dot gov" aria-hidden="true" /> <div class="usa-media-block__body"> <p> <strong>Official websites use .gov</strong><br />A <strong>.gov</strong> website belongs to an official government organization in the United States. </p> </div> </div> <div class="usa-banner__guidance tablet:grid-col-6"> <img class="usa-banner__icon usa-media-block__img" src="/assets/img/icon-https.svg" role="img" alt="Https" aria-hidden="true" /> <div class="usa-media-block__body"> <p> <strong>Secure .gov websites use HTTPS</strong><br />A <strong>lock</strong> ( <span class="icon-lock" ><svg xmlns="http://www.w3.org/2000/svg" width="52" height="64" viewBox="0 0 52 64" class="usa-banner__lock-image" role="img" aria-labelledby="banner-lock-description-default" focusable="false" > <title id="banner-lock-title-default">Lock</title> <desc id="banner-lock-description-default">Locked padlock icon</desc> <path fill="#000000" fill-rule="evenodd" d="M26 0c10.493 0 19 8.507 19 19v9h3a4 4 0 0 1 4 4v28a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V32a4 4 0 0 1 4-4h3v-9C7 8.507 15.507 0 26 0zm0 8c-5.979 0-10.843 4.77-10.996 10.712L15 19v9h22v-9c0-6.075-4.925-11-11-11z" /> </svg> </span >) or <strong>https://</strong> means you’ve safely connected to the .gov website. Share sensitive information only on official, secure websites. </p> </div> </div> </div> </div> </div> </div> <button id="backtotop" title="Go to top" style="display: none">˄ Top</button> <div class="usa-overlay"></div> </section> <header class="usa-header usa-header--extended" role="banner"> <div class="usa-navbar"> <div class="usa-logo" id="extended-logo"> <span><a href="/" onclick="return navigate(this)"> <img src="/assets/images/508-logo-cropped-web-altgreen.png" alt="Section508.gov Home; GSA logo with text: Section508.gov Buy. Build. Be Accessible." class="logo" /> </a></span> </div> <button class="usa-menu-btn">Menu</button> </div> <nav id="site-nav" role="navigation" class="usa-nav" aria-label="Primary Site Navigation"> <div class="usa-nav__inner"> <button class="usa-nav__close"><img alt="close" src="/assets/img/close.svg"></button> <ul class="usa-nav__primary usa-accordion"> <li class="usa-nav__primary-item"> <a aria-label="Policy & Management primary navigation" class="usa-nav__link" onclick="return navigate(this)" href="/manage/"><span>Policy & Management</span></a> </li> <li class="usa-nav__primary-item"> <a aria-label="Acquisition primary navigation" class="usa-nav__link" onclick="return navigate(this)" href="/buy-sell/"><span>Acquisition</span></a> </li> <li class="usa-nav__primary-item"> <a aria-label="Content Creation primary navigation" class="usa-nav__link usa-current" onclick="return navigate(this)" href="/create/"><span>Content Creation</span></a> </li> <li class="usa-nav__primary-item"> <a aria-label="Design & Develop primary navigation" class="usa-nav__link" onclick="return navigate(this)" href="/develop/"><span>Design & Develop</span></a> </li> <li class="usa-nav__primary-item"> <a aria-label="Testing primary navigation" class="usa-nav__link" onclick="return navigate(this)" href="/test/"><span>Testing</span></a> </li> <li class="usa-nav__primary-item"> <a aria-label="Training, Tools & Events primary navigation" class="usa-nav__link" onclick="return navigate(this)" href="/training/"><span>Training, Tools & Events</span></a> </li> </ul> <div class="usa-nav__secondary"> <ul class="usa-nav__secondary-links"> <li class="usa-nav__secondary-item"> <a href="/blog/" class="external-link" onclick="return navigate(this)">Blogs & Updates</a> </li> <li class="usa-nav__secondary-item"> <a href="/tools/program-manager-listing/" class="external-link" onclick="return navigate(this)">My Agency’s 508 PM</a> </li> <li class="usa-nav__secondary-item"> <a href="/content/about-us/" class="external-link" onclick="return navigate(this)">About Us</a> </li> </ul> <form id="search_form" class="usa-search usa-search--small" action="https://search.usa.gov/search" accept-charset="UTF-8" method="get"> <input name="utf8" type="hidden" value="✓" /> <input name="affiliate" type="hidden" value="gsa-section508-accessibility" /> <div role="search"> <label class="usa-sr-only" for="extended-search-field-small">Search</label> <input class="usa-input usagov-search-autocomplete" id="extended-search-field-small" type="search" name="query" autocomplete="off"> <button class="usa-button primary-background-color" type="submit"><img src="/assets/img/usa-icons-bg/search--white.svg" class="usa-search__submit-icon" alt="Search" /></button> </div> </form> </div> </div> </nav> </header> <section aria-label="Page Banner" class="usa-graphic-list usa-section sml-margin bg-gradient landing-page-banner"> <div class="grid-container"> <div class="grid-row grid-gap"> <div class="tablet: grid-col"> <span class="banner-title-color font-sans-lg margin-bottom-0"> Content Creation </span> <br /> <h1 class="text-white font-sans-xl margin-top-0 margin-bottom-0"> Create Accessible Social Media </h1> </div> </div> </div> </section> <div id="main-content" class="usa-layout-docs usa-section"> <div class="grid-container"> <div class="grid-row grid-gap"> <aside class="usa-layout-docs__sidenav desktop:grid-col-3 padding-bottom-4"> <nav id="sec-nav" aria-label="Secondary Navigation"> <ul class="usa-sidenav menu"><li class="usa-sidenav__item"> <a href="/create/" >Content Creation</a> </li><li class="usa-sidenav__item list "> <a href="javascript:void(0);" class="header-menu-text" aria-label="Create a Document - Submenu" aria-expanded="false">Create a Document</a> <ul class="usa-sidenav__sublist items"><li class="usa-sidenav__item "> <a href="/create/documents/">Create Accessible Documents</a> </li><li class="usa-sidenav__item "> <a href="/create/documents/authoring-guides/">Authoring Guides</a> </li><li class="usa-sidenav__item "> <a href="/create/documents/#tips">Tips and Tricks</a> </li><li class="usa-sidenav__item "> <a href="/create/documents/training-videos/">Video Training</a> </li></ul> </li><li class="usa-sidenav__item list "> <a href="javascript:void(0);" class="header-menu-text" aria-label="Create a Presentation - Submenu" aria-expanded="false">Create a Presentation</a> <ul class="usa-sidenav__sublist items"><li class="usa-sidenav__item "> <a href="/create/presentations/authoring-guides/">Authoring Guides</a> </li><li class="usa-sidenav__item "> <a href="/create/presentations/">Tips and Tricks</a> </li><li class="usa-sidenav__item "> <a href="/create/presentations/training-videos/">Video Training</a> </li></ul> </li><li class="usa-sidenav__item list "> <a href="javascript:void(0);" class="header-menu-text" aria-label="Create a Spreadsheet - Submenu" aria-expanded="false">Create a Spreadsheet</a> <ul class="usa-sidenav__sublist items"><li class="usa-sidenav__item "> <a href="/create/spreadsheets/authoring-guides/">Authoring Guides</a> </li><li class="usa-sidenav__item "> <a href="/create/spreadsheets/">Tips and Tricks</a> </li><li class="usa-sidenav__item "> <a href="/create/spreadsheets/training-videos/">Video Training</a> </li></ul> </li><li class="usa-sidenav__item list "> <a href="javascript:void(0);" class="header-menu-text" aria-label="Create a PDF - Submenu" aria-expanded="false">Create a PDF</a> <ul class="usa-sidenav__sublist items"><li class="usa-sidenav__item "> <a href="/create/pdfs/authoring-guides/">Authoring Guides</a> </li><li class="usa-sidenav__item "> <a href="/create/pdfs/common-tags-and-usage/">Tags and Their Usage</a> </li><li class="usa-sidenav__item "> <a href="/create/pdfs/">Tips and Tricks</a> </li><li class="usa-sidenav__item "> <a href="/create/pdfs/training-videos/">Video Training</a> </li></ul> </li><li class="usa-sidenav__item list "> <a href="javascript:void(0);" class="header-menu-text" aria-label="Audio & Video - Submenu" aria-expanded="false">Audio & Video</a> <ul class="usa-sidenav__sublist items"><li class="usa-sidenav__item "> <a href="/create/audio-video/">Audio- and Video-Only</a> </li><li class="usa-sidenav__item "> <a href="/create/captions-transcripts/">Captions & Transcripts</a> </li><li class="usa-sidenav__item "> <a href="/create/synchronized-media/">Synchronized Media</a> </li></ul> </li><li class="usa-sidenav__item"> <a href="/create/alternative-text/" >Alternative Text</a> </li><li class="usa-sidenav__item"> <a href="/create/electronic-signatures/" >Electronic Signatures</a> </li><li class="usa-sidenav__item"> <a href="/create/email-messages/" >Email Messages</a> </li><li class="usa-sidenav__item"> <a href="/create/accessible-equations-formulas/" >Equations and Formulas</a> </li><li class="usa-sidenav__item"> <a href="/create/accessible-meetings/" >Meetings</a> </li><li class="usa-sidenav__item"> <a href="/create/social-media/" class="active usa-current" >Social Media</a> </li></ul> </nav> </aside> <main class="usa-layout-docs__main desktop:grid-col-9" id="content-section"> <div class="usa-graphic-list"> <p>Accessible social media content is crucial for fostering inclusivity and ensuring equal participation for all individuals, regardless of ability. By implementing accessibility features such as alt text for images and closed captions for videos, creators can make their content more accessible to people with disabilities.</p> <p>For federal communicators specifically, <a href="/manage/laws-and-policies/section-508-law/">Section 508 of the Rehabilitation Act</a> requires any information and communication technology (ICT) created by the federal government be accessible to people with disabilities. This includes content federal agencies and departments upload or post to social media.</p> <p>Below are a few digital accessibility terms that are important to know when creating accessible social media content:</p> <ul> <li> <p><strong>Alt text</strong> (short for <a href="/create/alternative-text/">alternative text</a>) is text that is embedded into images or GIFs that conveys the meaning of the image. Alt text is designed to make visual content accessible to people who are using screen readers. In general, alt text should be concise, communicate relevant content provided by the image, and not repeat any information provided in the text of the post.</p> </li> <li> <p><strong><a href="/create/synchronized-media/#audio-description">Audio description (AD)</a></strong> is the addition of verbal descriptions to videos to help viewers who are blind or have low vision understand what is being shown. AD should be provided for visual elements that are not already described by the video narration or soundtrack. For example, AD is included in <a href="https://youtu.be/c-W5iunuL18?si=QAWgbfQCpA9q63r2" target="_blank" class="usa-link--external">Welcome to the U.S. Access Board</a>.</p> </li> <li> <p><strong>Closed captions (CC)</strong> are <a href="/create/captions-transcripts/">captions</a> that can be toggled on or off by the user watching a video. On several social media platforms, creators have the option to upload a SubRip Subtitle (SRT) file containing captions along with the video. Viewers will then have the option to turn CC on or off based on their preference. Many platforms will only accept SRT files and not Web Video Text Track (VTT) or TXT files.</p> </li> <li> <p><strong><a href="/blog/accessibility-bytes/color-contrast/">Color contrast</a></strong> is the difference between the color of text and the color of the background behind it. Certain color contrast ratios can result in the text of a graphic or image being difficult to read. Excluding logos or brand names, it is best to maintain a contrast ratio of 4.5:1 for regular text and 3:1 for large text. This ratio is the minimum required for federal content creators. Use a <a href="/training/web-software/andi-training-videos/color-contrast-analyzer/">color contrast analyzer</a> to determine the ratio of your graphic. There are various <a href="/test/color-contrast-in-nonweb-documents-images/#manual-contrast-checkers">free versions of these tools</a> available online.</p> </li> <li> <p><strong>Emojis</strong> can help make social media posts more engaging for users. However, having too many emojis in one post can be confusing or annoying for users using screen readers, as these programs will individually describe each emoji, which can take a lot of time. Additionally, using several emojis in a row can cause the same problems. Therefore, it is best to limit your overall use of emojis and avoid using several emojis in a row.</p> </li> <li> <p><strong>GIF</strong> stands for Graphics Interchange Format. It’s a type of file that can show still images or animations. GIFs are popular on social media for reactions without words, usually as continuously looping animations. As these animations don’t have user controls to pause, stop or hide the animation, and may include harmful flashing or blinking, we do not recommend using GIFs in social media. Also, if your GIF contains text, then <a href="/test/color-contrast-in-nonweb-documents-images/#manual-contrast-checkers">check its color contrast ratio</a>; if it is not accessible, then do not use the GIF.</p> </li> <li> <p><strong>Hashtags</strong> are useful in directing users to your posts. However, hashtags containing multiple words can present accessibility issues for users of screen readers. These programs may see a multiword hashtag as being one word and they will read it as such, which can result in a confusing or unintelligible pronunciation. Therefore, always capitalize each word in a multiword hashtag. For example: #FourthOfJuly.</p> </li> <li> <p><strong>Open captions (OC)</strong> are <a href="/create/captions-transcripts/">captions</a> that are always enabled or present in a video. Some platforms allow users to upload captions and have them be permanently enabled for all viewers. If this isn’t an option but you want your video to have OC, insert the captions as subtitles into the video during the editing process.</p> </li> <li> <p><strong><a href="https://www.plainlanguage.gov/about/definitions/" target="_blank" class="usa-link--external">Plain language</a></strong> is writing designed to be understood as quickly and clearly as possible. It is best to use plain language when creating public-facing content for social media. Some tenants of plain language include the use of active voice, short sentences, step-by-step instructions, and the avoidance of complicated terminology or jargon.</p> </li> <li> <p><strong>Screen readers</strong> are programs for computers, phones, and other devices that read out loud the text displayed on a screen. These programs are commonly used by people who are blind or have low vision. It is important to have screen readers in mind when writing content for social media.</p> </li> <li> <p><strong>Special characters</strong> are letters or symbols that don’t appear on the QWERTY keyboard. Screen readers may struggle to properly identify special characters, so it is best to avoid using them in social media posts. An example of a special character is the section symbol, which is often found in legal documents and legislation.</p> </li> <li> <p><strong>Videos</strong> are a type of “synchronized media,” a term used within accessibility standards, that presents information using both vision and hearing. For people with limited hearing or who are blind or have low vision, we provide an alternative means of accessing the information by including captions and audio descriptions.</p> </li> </ul> <h2 id="best-practices-for-commonly-used-platforms">Best Practices for Commonly Used Platforms </h2> <p>Using this terminology, below are some best practices for creating accessible social media content on a few of the more common platforms used within the federal government.</p> <h3 id="x-formerly-twitter">X (formerly Twitter)*</h3> <p>Use plain language when writing your X posts——don’t assume all users will understand your industry’s jargon. This especially can be a problem for federal agencies that use a lot of acronyms, as X posts have a character limit and long agency names can take up space. One remedy is to tag any agencies or organizations you reference as opposed to spelling out the full name; this saves character space and links users to the respective agency if they want to learn more.</p> <p>Always double check that you have limited your use of emojis and have not placed several emojis next to each other. Additionally, ensure each word in a multiword hashtag has been capitalized, and that you have avoided the use of any special characters.</p> <p>Additionally, keep the following in mind when implementing different formatting or media into your posts:</p> <ul> <li> <p><strong>Images:</strong> After ensuring color contrast accessibility and uploading the image to your post, click “Add Description” and enter your alt text.</p> </li> <li> <p><strong>Videos:</strong> Before uploading a video to X, ensure you have included any audio description where needed. When uploading the video, ensure you have either closed or open captions. If you are using the closed captions (CC) option, ensure your captions are in the SRT file format, as this is the only file type X accepts. After uploading your video, click “Upload caption file (.srt)” and select your CC file. Don’t forget to link to your audio described version.</p> </li> <li> <p><strong>GIFs:</strong> X has an in-house feature for adding GIFs to posts. It’s recommended not to use animated GIFs unless they are fully accessible—meaning they include pause, stop, and hide features and comply with non-flashing standards. However, if you have your own GIF file and you can be made fully accessible, you may use it. Be sure to include appropriate alt text for the GIF. After selecting your GIF from the GIPHY catalog, click “Add Description” and enter your alt text. If your GIF contains text, then check its color contrast ratio; if it is not accessible, then do not use the GIF.</p> </li> </ul> <div class="border-base radius-lg border-1px padding-1 bg-primary-lighter" style="margin-top: 1.0em;"> <ol class="usa-icon-list tablet:grid-col"> <li class="usa-icon-list__item"> <div class="usa-icon-list__icon text-black"><svg class="usa-icon" aria-hidden="true" focusable="false" role="img"><use xlink:href="/assets/img/sprite.svg#x"></use></svg></div> <div class="usa-icon-list__content"><a href="https://x.com/AccessBoard/status/1830983691566219580" target="_blank" class="usa-link--external">View an example of an accessible X post by the U.S. Access Board</a></div> </li> </ol> </div> <h3 id="linkedin">LinkedIn*</h3> <p>Use plain language when writing LinkedIn posts—don’t assume all users understand your industry’s jargon. Remember LinkedIn does not have a character limit on posts, so make sure to avoid highly technical words and spell out uncommon acronyms or abbreviations.</p> <p>Always double check that you have limited your use of emojis and have not placed several emojis next to each other. Additionally, ensure each word in a multiword hashtag has been capitalized, and that you have avoided the use of any special characters.</p> <p>Additionally, keep the following in mind when implementing different formatting or media into your posts:</p> <ul> <li> <p><strong>Images:</strong> After ensuring color contrast accessibility and uploading the image to your post, click “ALT” and enter your alt text.</p> </li> <li> <p><strong>Videos:</strong> Before uploading a video to LinkedIn, ensure you have included any audio description where needed. When uploading the video, ensure you have either closed or open captions. If you are using closed captions (CC) option, then ensure your captions are in the SRT file format, as this is the only file type LinkedIn accepts. After uploading your video, click “Video title” and enter a descriptive title. Then, click “Captions” and disable “Add auto captions” from the menu. At the bottom of the menu, click “Upload SRT” and select your CC file. Don’t forget to link to your audio described version.</p> </li> <li> <p><strong>GIFs:</strong> LinkedIn does not have an in-house feature for adding GIFs to posts. It’s recommended not to use animated GIFs unless they are fully accessible—meaning they include pause, stop, and hide features and comply with non-flashing standards. However, if you have your own GIF file and you can be made fully accessible, you may use it as if it were an image or video. Be sure to include appropriate alt text for the GIF. After uploading your GIF, click “ALT” and enter your alt text. If your GIF contains text, check its color contrast ratio; if it is not accessible, do not use the GIF.</p> </li> <li> <p><strong>Documents:</strong> LinkedIn allows users to upload documents to their posts. This has the potential to present several accessibility barriers. LinkedIn explains that “for accessibility purposes, LinkedIn members who can view your post will be able to download your document as a PDF.” Nevertheless, <a href="/create/pdfs/">PDFs</a> are usually far more difficult to make accessible than other files, such as <a href="/create/documents/">Word documents</a>. It is best to avoid this feature on LinkedIn and instead link back to an <a href="/develop/software-websites/">accessible web page</a> with the relevant information.</p> </li> <li> <p><strong>Events</strong>: When creating events on LinkedIn, follow the guidance above and remember to add alt text to your cover image for the event.</p> </li> </ul> <div class="border-base radius-lg border-1px padding-1 bg-primary-lighter" style="margin-top: 1.0em;"> <ol class="usa-icon-list tablet:grid-col"> <li class="usa-icon-list__item"> <div class="usa-icon-list__icon text-blue"><svg class="usa-icon" aria-hidden="true" focusable="false" role="img"><use xlink:href="/assets/img/sprite.svg#linkedin"></use></svg></div> <div class="usa-icon-list__content"><a href="https://www.linkedin.com/feed/update/urn:li:activity:7244687214373142528" target="_blank" class="usa-link--external">View an example of an accessible LinkedIn post by the U.S. Access Board</a></div> </li> </ol> </div> <h3 id="facebook">Facebook*</h3> <p>Use plain language when writing your Facebook posts—don’t assume all users will understand your industry’s jargon. Remember that Facebook does not have a character limit on posts, so make sure to avoid highly technical words and spell out uncommon acronyms or abbreviations.</p> <p>In addition to regular text posts, Facebook allows users to customize the background color and design of posts. If you use this feature, ensure there is still an accessible contrast between the text and background colors. Furthermore, some users may struggle to read posts that contain background graphics or patterns as opposed to backgrounds with solid colors. Ensure color contrast accessibility at all points where text overlays the background. If there is doubt as to whether a more complicated background design is accessible, it is best to avoid it altogether. </p> <p>Always double check that you have limited your use of emojis and have not placed several emojis next to each other. Additionally, ensure each word in a multiword hashtag has been capitalized, and that you have avoided the use of any special characters.</p> <p>Additionally, keep the following in mind when implementing different formatting or media into your posts:</p> <ul> <li> <p><strong>Images:</strong> After ensuring color contrast accessibility and uploading the image to your post, click “Edit” and then click “Alternative Text.” Ignore the automatically generated alt text and enter your own under “Custom alt text.”</p> </li> <li> <p><strong>Videos:</strong> Before uploading a video to Facebook, ensure you have included any audio description needed. When uploading the video, ensure you have either closed or open captions. If you are using closed captions (CC) option, ensure your captions are in the SRT file format, as this is the only file type Facebook accepts. After uploading your video, click “Video Options” and then click “Video title” and enter a descriptive title. Further down in the menu, click “Add Captions” and then disable “Add Auto-generated Captions.” Beneath this, click “Upload” under the “Upload Captions” section and select your CC file. Don’t forget to link to your audio described version.</p> </li> <li> <p><strong>GIFs:</strong> Facebook has an in-house feature for adding GIFs to posts. It’s recommended not to use animated GIFs unless they are fully accessible—meaning they include pause, stop, and hide features and comply with non-flashing standards. However, if you have your own GIF file and you can be made fully accessible, you may use it. If you utilize this feature, ensure you include alt text in the body of the post itself, as you cannot currently add alt text to GIFs using this feature. If your GIF contains text, then check its color contrast ratio; if it is not accessible, then do not use the GIF.</p> </li> <li> <p><strong>Events:</strong> When creating events on Facebook, follow the guidance above but note that the platform does not currently allow users to add alt text to the cover image for events. For this reason, do not include any information in the cover image that is not included elsewhere in the title or description. Additionally, avoid using GIFs as cover images for events.</p> </li> </ul> <div class="border-base radius-lg border-1px padding-1 bg-primary-lighter" style="margin-top: 1.0em;"> <ol class="usa-icon-list tablet:grid-col"> <li class="usa-icon-list__item"> <div class="usa-icon-list__icon text-blue"><svg class="usa-icon" aria-hidden="true" focusable="false" role="img"><use xlink:href="/assets/img/sprite.svg#facebook"></use></svg></div> <div class="usa-icon-list__content"><a href="https://www.facebook.com/share/p/rZJ1sijURLJAJ2p7/" target="_blank" class="usa-link--external">View an example of an accessible Facebook post by the U.S. Access Board</a></div> </li> </ol> </div> <h2 id="platform-resources-for-accessibility">Platform Resources For Accessibility*</h2> <p>The social media platforms regularly used by the U.S. Access Board (USAB):</p> <ul> <li><a href="https://help.x.com/en/resources/accessibility" target="_blank" class="usa-link--external">X (formerly Twitter): Accessibility at X</a></li> <li><a href="https://www.linkedin.com/accessibility" target="_blank" class="usa-link--external">LinkedIn: Accessibility</a></li> <li><a href="https://www.facebook.com/help/accessibility" target="_blank" class="usa-link--external">Facebook: Help Center</a></li> <li><a href="https://support.google.com/youtube/answer/2734796" target="_blank" class="usa-link--external">YouTube: Add subtitles & captions</a></li> </ul> <p>Below is the social media policy for other platforms not currently used by the USAB. Neither the USAB nor the General Services Administration (GSA) guarantee this information is up to date.</p> <ul> <li><a href="https://about.instagram.com/blog/tips-and-tricks/advancing-accessibility-on-instagram" target="_blank" class="usa-link--external">Instagram</a></li> <li><a href="https://help.snapchat.com/hc/en-us/sections/14203449466900-Accessibility" target="_blank" class="usa-link--external">Snapchat</a></li> <li><a href="https://help.tumblr.com/accessibility/" target="_blank" class="usa-link--external">Tumblr</a></li> <li><a href="https://blog.flickr.net/en/2016/09/29/improving-accessibility-on-flickr/" target="_blank" class="usa-link--external">Flickr</a></li> </ul> <h2 id="other-resources">Other Resources</h2> <ul> <li><a href="https://www.plainlanguage.gov/" target="_blank" class="usa-link--external">PlainLanguage.gov</a> contains many guides, examples, and trainings on plain language composition.</li> <li><a href="https://digital.gov/topics/accessibility/" target="_blank" class="usa-link--external">Digital.gov</a> houses various resources, articles, and blog posts on digital accessibility topics.</li> <li><a href="https://digital.gov/resources/federal-social-media-accessibility-toolkit-hackpad/" target="_blank" class="usa-link--external">Federal Social Media Accessibility Toolkit Hackpad</a></li> <li><a href="https://www.access-board.gov/webinars/" target="_blank" class="usa-link--external">The USAB holds [bi-monthly webinars</a> on topics pertaining to the accessibility of information and communication technology (ICT).</li> </ul> <p><strong>Reviewed/Updated:</strong> October 2024</p> <div class="border-base radius-lg border-1px padding-1 margin-y-2 bg-primary-lighter" style="margin-top: 1.0em;"><strong>*Disclaimer</strong>: Reference in this site to any specific commercial product, process, or service, or the use of any trade, firm or corporation name is for the information and convenience of the public, and does not constitute endorsement, recommendation, or favoring by GSA. GSA does not guarantee that outside websites or products comply with Section 508 (accessibility requirements) of the Rehabilitation Act.</div> </div> <div class="margin-bottom-05"> <strong>Contributing Organizations</strong> <ul class="margin-top-05 padding-left-1" style="list-style-type:none"> <li class="margin-bottom-1"> <img src="https://assets.section508.gov/files/images/seals-logos/usab.jpg" height="48px" alt="Photo: U.S. Access Board" style="vertical-align:middle"> <a href="/contributors/usab.html" class="margin-left-1"> U.S. Access Board</a> </li> </ul> </div> </main> </div> </div> </div> <footer class="usa-footer__primary-section"> <div class="grid-container"> <div class="grid-row grid-gap padding-bottom-4"> <div class="desktop:grid-col-4"> <p class="text-bold">Government-wide Initiatives</p> <ul class="add-list-reset line-height-sans-6"> <li> <a href="https://www.gsa.gov/technology/government-it-initiatives/digital-strategy" target="_blank" onclick="return navigate(this)">Digital Strategy</a></li> <li> <a href="https://www.plainlanguage.gov/" target="_blank" onclick="return navigate(this)">Plain Language </a></li> <li> <a href="https://designsystem.digital.gov/" target="_blank" onclick="return navigate(this)"> U.S. Web Design System </a></li> <li> <a href="https://www.cio.gov/about/members-and-leadership/accessibility-cop/" target="_blank" onclick="return navigate(this)"> CIO Council Accessibility Community of Practice (ACOP)</a></li> </ul> </div> <div class="desktop:grid-col-2"> <p class="text-bold">Organization</p> <ul class="add-list-reset line-height-sans-6"> <li> <a href="/about-us/" aria-label="About Us in Organization" onclick="return navigate(this)"> About Us</a></li> <li> <a aria-label="Contact Us details" href="/contact-us/" onclick="return navigate(this)"> Contact Us</a></li> <li><a href="/contributors/" aria-label="Section508.gov site Contributors" onclick="return navigate(this)"> Contributors</a></li> </ul> </div> <div class="desktop:grid-col-3"> <p class="text-bold">Tools</p> <ul class="add-list-reset line-height-sans-6"> <li> <a href="/art/" aria-label="Accessibility Requirements Tool" onclick="return navigate(this)"> ART</a></li> <li> <a href="/buy/solicitation-review-tool" aria-label="Solicitation Review Tool" onclick="return navigate(this)"> SRT</a></li> <li> <a href="/content/guide-accessible-web-design-development" onclick="return navigate(this)"> Developer Guide</a></li> <li> <a href="https://digitaldashboard.gov/" target="_blank" onclick="return navigate(this)"> DigitalDashboard.gov</a></li> <li> <a href="https://analytics.usa.gov/" target="_blank" onclick="return navigate(this)"> Analytics.usa.gov</a></li> </ul> </div> <div class="desktop:grid-col-3"> <p class="text-bold">Resources</p> <ul class="add-list-reset line-height-sans-6"> <li> <a href="/content/glossary" aria-label="Glossary for Section508" onclick="return navigate(this)"> Glossary</a></li> <li> <a href="/website-policies" onclick="return navigate(this)"> Website Policies</a></li> <li> <a href="/tools/program-manager-listing/" onclick="return navigate(this)"> Find Your Section 508 Program Manager</a></li> <li><a href="/manage/join-the-508-community/" onclick="return navigate(this)">Join the Community(Listserv)</a></li> </ul> </div> </div> </div> </footer> <div class="usa-identifier"> <section class="usa-identifier__section usa-identifier__section--masthead" aria-label="Agency identifier," > <div class="usa-identifier__container"> <div class="usa-identifier__logos"> <a href="https://gsa.gov" class="usa-identifier__logo" onclick="return navigate(this)"> <img class="usa-identifier__logo-img" alt="General Services Administration Logo" src="/assets/images/logos/gsa-logo.png"> </a> </div> <div class="usa-identifier__identity"> <p class="usa-identifier__identity-domain">Section508.gov</p> <p class="usa-identifier__identity-disclaimer"> An official website of the <a href="https://www.gsa.gov/" onclick="return navigate(this)">General Services Administration</a> </p> </div> </div> </section> <nav class="usa-identifier__section usa-identifier__section--required-links" aria-label="Important links,," > <div class="usa-identifier__container"> <ul class="usa-identifier__required-links-list"> <li class="usa-identifier__required-links-item"> <a href="https://www.gsa.gov/about-us" class="usa-identifier__required-link usa-link" onclick="return navigate(this)">About GSA</a> </li> <li class="usa-identifier__required-links-item"> <a href="https://www.gsa.gov/website-information/accessibility-aids" class="usa-identifier__required-link usa-link" onclick="return navigate(this)">Accessibility statement</a> </li> <li class="usa-identifier__required-links-item"> <a href="https://www.gsa.gov/reference/freedom-of-information-act-foia" class="usa-identifier__required-link usa-link" onclick="return navigate(this)">FOIA requests</a> </li> <li class="usa-identifier__required-links-item"> <a href="https://www.gsa.gov/reference/civil-rights-programs/notification-and-federal-employee-antidiscrimination-and-retaliation-act-of-2002" class="usa-identifier__required-link usa-link" onclick="return navigate(this)">No FEAR Act data</a> </li> <li class="usa-identifier__required-links-item"> <a href="https://www.gsaig.gov/" class="usa-identifier__required-link usa-link" onclick="return navigate(this)">Office of the Inspector General</a> </li> <li class="usa-identifier__required-links-item"> <a href="https://www.gsa.gov/reference/reports/budget-performance" class="usa-identifier__required-link usa-link" onclick="return navigate(this)">Performance reports</a> </li> <li class="usa-identifier__required-links-item"> <a href="https://www.gsa.gov/website-information/website-policies" class="usa-identifier__required-link usa-link" onclick="return navigate(this)">Privacy policy</a> </li> <li class="usa-identifier__required-links-item"> <a href="/website-policies/#reuse-and-copyright" class="usa-identifier__required-link usa-link" onclick="return navigate(this)">Reuse and Copyright</a> </li> </ul> </div> </nav> <section class="usa-identifier__section usa-identifier__section--usagov" aria-label="U.S. government information and services,," > <div class="usa-identifier__container"> <div class="usa-identifier__usagov-description"> Looking for U.S. government information and services? </div> <a href="https://www.usa.gov/" class="usa-link" onclick="return navigate(this)">Visit USA.gov</a> </div> </section> </div>  <script id="_fed_an_ua_tag" src="https://dap.digitalgov.gov/Universal-Federated-Analytics-Min.js?agency=GSA"></script> <script src="/assets/js/uswds.min.js?1732224641581990839"></script> <script src="/assets/js/app.js?1732224641581990839"></script> <script> $(document).ready(function(){ // Check if the user already dismissed alert banner if (window.localStorage.getItem('dismiss_alert')) { $('#alert_banner').hide(); } $("#dismiss_alert").click(function(){ // Save on LocalStorage window.localStorage.setItem('dismiss_alert', true); $('#alert_banner').hide(); }); }); </script> </body> </html>

CINXE.COM

Create Accessible Social Media | Section508.gov