Mid-Atlantic ADA Center
Slide 1
ACCESSIBLE SOCIAL MEDIA FOR ALL
Facebook logo
Twitter logo
YouTube logo
Blog logo
State of Maryland logo "Changing Maryland for the Better"
Lori Markland
Director, Access Maryland & Accessibility
Programs
Maryland Department of Disabilities,
Technology Assistance Program
Slide 2
SOCIAL MEDIA CONNECTS US
“The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.”
–Tim Berners-Lee
Slide 3
SOCIAL MEDIA CONNECTS US
Governor Larry Hogan's Facebook page – screenshot
Slide 4
THE IMPORTANCE OF SOCIAL MEDIA
Graphic - Among all American adults, % who use social networking sites, by age. Data reflects nearly 90% of those between 18-29 in 2014; about 75% for those between 30-49 in 2014; about 50% for those between 50-64 in 2014; and over 30% for those 65 and older in 2014. Data reflects and upward use of social media across all age spans from 2006 - 2014.
Age differences: Seniors make strides –Young adults (ages 18 to 29) are the most likely to use social media –fully 90% do. Still, usage among those 65 and older has more than tripled since 2010 when 11% used social media. Today, 35% of all those 65 and older report using social media, compared with just 2% in 2005.
Statistics via @AccessibilityOz, MD Department of Disabilities and the Pew Research Center
Slide 5
THE IMPORTANCE OF SOCIAL MEDIA
Know your audience in order to better craft your message!
• 65% of adults now use social networking sites –a nearly tenfold jump in the past decade
• The employment rate of working-age people (ages 21 to 64) with disabilities in Maryland was 41.2%; the percentage of people with disabilities working full-time, year-round jobs was only 27.3%.
• The percentage of people with disabilities in Maryland who were not working but were actively looking for work was 12.2%
2016 Statistics via @AccessibilityOz, MD Department of Disabilities, and the Pew Research Center
Slide 6
ALTERNATIVE ACCESS TO MEDIA
Your audience connects in a variety of ways:
• Keyboard only (no mouse)
• Voice input software & apps
• Alternative mice & keyboards (eyegazesystems, switches, etc.)
• Refreshable Braille displays
• Text to speech tools (screen readers, voice over, etc.)
Image: Refreshable braille display
Image: Multicolored keys on a large-key keyboard.
Image: User in wheelchair using a laptop
Slide 7
ENSURE UNIVERSAL ACCESS –5 TIPS
Tip 1 -The Rule of Reciprocity
Universal access means information is offered in multiple formats. All audio should be captioned, all images should include alternate text, and all content should work with a screen reader.
If you provide it accessibly, your constituents will engage with you!
Slide 8
ENSURE UNIVERSAL ACCESS –5 TIPS
Tip 2 -Caption All Photos
Twitter allows users to add alternate text to each photo.
Facebook allows each photo to include a written caption (that screen readers can access). It also now utilizes automatic alternative text.
Instagram & Pinterest DO NOT allow for captions or alternate text. So, it’s best practice to include the image description in with the text accompanying the image.
Image: Toddler Talk AAC app, Photo courtesy iTunes, Screen shot of common words and image prompts
Slide 9
ENSURE UNIVERSAL ACCESS –5 TIPS
Tip 3 -Caption All Video
Facebook allows several options for captioning audio content within videos, including their own native video feature.
Twitter, Instagram & Pinterest must have videos captioned prior to posting.
YouTube maintains its own captioning program, but it is HIGHLY unreliable.
Instead, either self-caption and upload the transcript or use an outside captioning program.
Slide 10
ENSURE UNIVERSAL ACCESS –5 TIPS
Tip 4 –Be careful with infographics and text content embedded in images
Infographics and memes are an eye catching and convenient mode of communicating information which can often feel stale in other formats. However, text readers can not read words that are part of an image. Therefore, captions must contain either all text found within the image or a link to that information.
Slide 11
ENSURE UNIVERSAL ACCESS –5 TIPS
Tip 5 –Use Plain Language
• Be mindful of acronyms.
• Shorter messages lead to higher engagement.
• Avoid technical jargon.
• Translate difficult topics for non-experts.
• Use clear, common language.
Slide 12
WAYS THAT WE CONNECT
Just a few –
Social engagement or chatting: Facebook, Twitter, Tumblr
Images: Instagram, Snapchat, Pinterest
Video: YouTube, Vine
Networking: LinkedIn
Slide 13
USE YOUR SOCIAL MEDIA
Facebook
Image: Like us on Facebook link logo
• Program events (pictures and updates of things happening currently within your program)
• Updates on state laws, regulations or calls to action
• Upcoming program-related events, conferences, webinars, etc.
• Don’t post too often –no more than 3 posts a day, tops!!! But, post every day
*Facebook is a way to share relevant actions, to engage discussion, and invite the community to action
Slide 14
USE YOUR SOCIAL MEDIA
Twitter
Image: Follow us on Twitter link logo
• News articles SPECIFIC to your industry/field
• Blog posts
• Live tweeting key moments and/or quotes at related events
• Consider hosting your Twitter feed on your website for optimum access to the latest industry news
• Tweet often & tweet all day long
*Twitter is a medium best used to share news, especially current articles on local, national, and international happenings specific to your field.
Slide 15
USE YOUR SOCIAL MEDIA
YouTube
Image: View our videos on YouTube link logo
• Videos that you create
• Industry specific videos that support or advance the knowledge base
*YouTube is a fantastic way to share videos that promote the mission of your program. Whether it is to provide hands-on reviews of AT or to share relevant videos that demonstrate the impact of technology for people with disabilities, it can be a powerful way to communicate.
Slide 16
TO CROSSPOST OR NOT TO CROSSPOST?
• What we put on Facebook goes to Twitter, but not the other way around, because it’s always about frequency and type of message
• Vary your posts by platform and audience
• Consider the length of your post and how it will appear on the social media platform
• Consider the content focus (Is this better suited for Facebook or Twitter?)
Slide 17
TO CROSSPOSTOR NOT TO CROSSPOST?
Image: Screenshot of MDTAP Facebook feed with a post that originated from Constant Contact
Slide 18
TO CROSS-POST OR NOT TO CROSS-POST
Image: Screenshot of MDTAP Twitter feed that shows tweets that generated from Facebook and Constant Contact
Our Facebook post and Constant Contact Announcement both appear in the MDTAP Twitter feed. Just one more way to ensure that the message cross pollinates!
Slide 19
SOCIAL MEDIA PROFILE BANNERS
Profile banners are what you see at the top of a Twitter or Facebook page -
• Most banners do not have options for alt tags
• Many include embedded text or pictures of text
• Any content on your banner should be readily accessible on your social media page, within your program information (i.e. program name, phone numbers, agency associations, etc.)
Image: Maryland Technology Assistance Program Facebook banner
Image: Transitioning Youth Facebook banner
Slide 20
SOCIAL MEDIA PROFILE BANNERS
Image: MDTAP's Twitter Home page. Content located in banner is also found in the bio section of the site.
Ensure that all text in banner art is available elsewhere
Slide 21
FACEBOOK –THE NITTY GRITTY REALITY
Image: Facebook logo
What works
• No longer requires CAPTCHA on signup
• Headings, landmarks and lists are used extensively (for keyboard and screen reader users)
• The Facebook Androidand iOSapps are quite accessible
• 2016 roll out of automatic alternative text using Facebook’s artificial intelligence (AI) for people using screen readers. This uses object recognition to generate descriptions (up to 17 different activities such as walking, running, etc.)
• Facial recognition-if someone isn’t tagged, a person using a screen reader will still know if their friend (or his/herself) is in a photo
Slide 22
FACEBOOK –THE NITTY GRITTY REALITY
Image: Facebook logo
What Will Work (in the future)
• Facial recognition will integrate with photo viewer via a touch screen device, allowing users to move their finger around a photo and be told about specific objects of the photo
• Automatic Alt Text (AAT) to include the ability for user to touch the image and ask questions about it. AAT would provide more description based on question key words.
• Alt text tool for video that will provide audio description for videos that are posted
Slide 23
FACEBOOK –THE NITTY GRITTY REALITY
What doesn’t work (with some older browsers)
• Keyboard focus indicator is NOT very visible (can hardly see what you’re tabbing on when tabbing through Facebook)
• Order of columns is incorrect when read with a screen reader
• Zooming breaks the site –content does not display properly when zoomed in
• Facebook shortcut keys can conflict with browser shortcuts when using a screen reader’s quick navigation commands
Slide 24
FACEBOOK –THE NITTY GRITTY REALITY
What you CAN Do to make it more accessible
• Always include web address and contact info on your page
• When posting video, post the link of your video from your YouTube channel –this will preserve the captioning. However, FB has rolled out its Native Video feature, allowing users to upload and caption videos directly in the FB feed.
• Always spell out acronyms in your posts
• Until automatic alt text improves, add descriptive captions to any images that you post
• Don’t use hashtags (or no more than one)
• Test your content with a screen reader!
Slide 25
TWITTER–THE NITTY GRITTY REALITY
Image: Twitter logo
What works
It’s mostly accessible
• No longer requires CAPTCHA on signup
• Full keyboard accessibility
• Both theiOSand AndroidTwitter apps are quite accessible using VoiceOveror TalkBack
• Launched in 2016, Image Descriptions can be added when using the Twitter app on iOS or Android, as well as through . Enabling is simple and instructions can be found online.
Slide 26
TWITTER–THE NITTY GRITTY REALITY
What doesn’t work
• Twitter shortcut keys can conflict with a screen reader’s quick navigation commands when accessing Twitter from the Twitter website.
Slide 27
TWITTER–THE NITTY GRITTY REALITY
What you CAN Do to make it more accessible
• Put your 800 number in bio line
• Precede tweets with [PIC], [VIDEO], [AUDIO], so that screen reader users know what to expect.
• Add Alt Text to your photos
• Place hashtags, mentions, and links at the end of tweet (not IN the tweet) –
o This: We’re celebrating the 28thAnniversary of the ADA today! #ADA28
o Not this: We’re celebrating #ADA28 today!
• Use only a few hashtags
• Use “CamelCase” for multiword hashtags (use #AccessibleMedianot #accessiblemedia) so screen readers don’t run the words together. No more than one to two hashtags per use (for optimal engagement)
Slide 28
YOUTUBE–THE NITTY GRITTY REALITY
Image: YouTube logo
What works
• All videos auto-play
• Both the embedded YouTube player and the YouTube site are more keyboard accessible
Slide 29
YOUTUBE–THE NITTY GRITTY REALITY
What doesn’t work
• Not fully keyboard accessible (when tabbing through a page, you must backwards-tab multiple times to access the play, pause or stop buttons. The keyboard focus can highlight a button but may not activate it.)
• Order of items is incorrect when tabbing through the page
• Upload button is not keyboard accessible
• Zooming breaks the site
• Not fully Voice-over accessible (when accessing Search feature using VoiceOver, you cannot exit to access content –the feature remains overlapping the content)
• Auto-captioning is problematic
Slide 30
YOUTUBE–THE NITTY GRITTY REALITY
• ALL videos should include captioning. This can be done via your own written transcript or accessing a free tool (suggestions on next slide)
• Do NOT use the YouTube feature that will automatically caption your video. It isn’t accurate!
• Any caption/transcript should capture info and sounds in video that may not typically be captioned, such as sound of clapping, phone using voiceover, etc.
Image: Screenshot of captioned video on MDTAP's YouTube station
Slide 31
YOUTUBE–THE NITTY GRITTY REALITY
• For creating or editing captions:
o Overstream: web-based captioning tool
o Amara: Free tool that links directly to your YouTube Videos
• How to upload your own captions/transcript
o Sign into your YouTube Account
o In the Captions and Subtitles pane, select ‘Add captions’ option
o Select the ‘Browse’ option and locate the captioned file
o Select ‘Upload File’
Slide 32
HYPERLINKS, WEBSITES & EMAILS
Check text & hyperlink color against background colors of each site to ensure high contrast when possible.
Test your website in various high contrast modes to see what information is visible and what gets lost.
Include your social media links on all email correspondence and on your website.
If your medium is a paper brochure or handout, include all social media extensions.
Image: Twitter logo @MDTAP
Image: Facebook logo MDODTAP
Image: Blog logo blog.
Slide 33
Image: Screenshot of MDTAP homepage viewed in regular contrast
MDTAP’s website viewed in regular contrast
Slide 34
Image: Screenshot of MDTAP homepage viewed in high contrast black background
MDTAP’s website in high contrast.
Slide 35
INFOGRAPHICS& MEMES
Image: Screenshot of CDC's disability infographic
All infographic information that is hosted should include a text-only and tagged PDF option. The “Disability Impacts” infographic found on the CDC website includes a link to the PDF, a text version, and the option to view an enlarged infographic.
Slide 36
INFOGRAPHICS& MEMES
Image: Inigo Montoya meme - You keep saying “Accessibility.” I do not think this word means what you think it means.
You keep saying “Accessibility.” I do not think this word means what you think it means.
If you share memes via your social networking sites, be sure to caption the text and, if needed, describe the context of the image.
Slide 37
ALTERNATE WAYS TO ACCESS…
Image: Screenshot of the MDTAP web interface for simplified Facebook format
Alternative methods to the desktop interface for Facebook:
• FacelyHD (an app for mobile devices)
• M. (simplified format for Facebook info)
• Also integrates FB Messenger, Twitter, Instagram, and more
Slide 38
ALTERNATE WAYS TO ACCESS…
Image: Easy Chirp screenshot showing simplified Twitter interface
Alternative methods to the desktop interface for Twitter:
• EasyChirp-A simplified interface and fully accessible Twitter application. Works with older browsers and assistive technologies. A unique feature of Easy Chirp is the ability to tweet a link to an image with alternative text (both short and long descriptions).To date, it is the only Twitter application which provides this service.
Slide 39
ALTERNATE WAYS TO ACCESS…
Image: Accessible YouTube screenshot showing larger print, simplified YouTube format
Alternative methods to the desktop interface for YouTube:
• Accessible YouTube –designed for users utilizing a mouse or two switches at a time. Not keyboard-only accessible. Works with iPhone and iPad as well.
Slide 40
LAST BUT NOT LEAST…
LinkedIn –Professional networking
• More accessible via keyboard with improved navigation for those tabbing between professional content and features.
• Alt Text options are available site wide.
• Realtime notifications are available to those navigating by keyboard, and actions like sending messages, and interacting with dialog boxes can be done with the keyboard or screen reader.
• Mobile app requires Captcha at sign up –not accessible to blind users.
Pinterest –A visual pinboard
• In 2018, Pinterest improved color contrast, screen reader support (so that Voiceover and TalkBackcan work with the Pinterest metadata), customizable text size, clearer focus indicators (for people using a keyboard to navigate the screen), and implemented an accessibility check for all new features that roll out on the platform.
Slide 41
CONTACT US
For more information, contact
Lori Markland
Director, Access Maryland and Accessibility Programs
MD Department of Disabilities,
Technology Assistance Program
lmarkland@
Lori.markland@
410-554-9477
1-800-832-4827 (Toll free)
Image: Changing Maryland for the Better logo
................
................
In order to avoid copyright disputes, this page is only a partial summary.
To fulfill the demand for quickly locating and searching documents.
It is intelligent file search solution for home and business.
Related searches
- atlantic coupon redemption center
- the atlantic dentistry article
- atlantic coupon service
- atlantic city golf courses
- ada city utilities ada ok
- brooklyn nycha office atlantic ave
- atlantic city golf courses map
- atlantic city area golf courses
- best atlantic city golf courses
- golf courses near atlantic city
- north atlantic university in qatar
- atlantic city activities