Ensuring an Accessible Domestic Violence Awareness Month Creating Accessible Social Media Posts Alice Wong Alice Wong (she/her) is a disabled activist, writer, editor, media maker, and consultant. This image is from her new book “Year of the Tiger: An Activist’s Life” (Vintage Books, 2022) Image Description: Drawing of Alice Wong, an Asian American disabled woman in a power chair with her arms folded over each other and her eyes looking up to the left. She is wearing a zipped hoodie and has a BiPAP mask over her nose attached to a tube. There is a conversation box with Alice saying “Social Media was a lifeline for me.” Below that quote are four symbols: response, retweet, like, and share. Inclusive Design * Recognize exclusion * Solve for one, extend to many * Learn from diversity Source: Microsoft Image Description: Large dotted line circle with “Human-Centered Design” on the top middle part of the circle. There are 4 smaller circles overlapping. Purple circle with “Inclusivity” at the top, green circle with “Accessibility” on the bottom left, blue circle with “Usability” on the bottom right, and a black circle with white borders in the middle with “Inclusive Design” Make Text Accessible * Write in plain language * Stronger contrast * Don’t overuse caps * Camel Case for multi-word hashtags * Avoid saying “click here” * Limit emoji use * Short line length * Write in Plain Language  * Keep it short * Use lists and tables * Avoid jargon, slang, or technical terms * Use concrete, familiar words * Simple statistics or figures * Use active voice Contrast & Caps Image Description: Nine lines of wording. 1st Line in light font color: “Contrast makes text easier to read.” 2nd Line in a light font color with a bit more contrast: “The contrast of size.” 3rd line in black font color: “The contrast of color.” 4th line in black font color: “And the contrast of” 5th and 6th line in black font color and all caps: The word “shape” written 5 times on each line for a total of 10 words. 7th line in black font color: The word “shape” in all caps at positions 1, 2, 4, and 5. The word “shape” with a capital “S” and lower case “hape” in position 3. 8th and 9th line in black font color and all caps: The word “shape” written 5 times. Camel Case Hashtags Capitalize the first letter of each multiple word. This makes it more accessible for people to read and understand. This makes it accessible for screen readers. PSA...blacklivesmatter is pronounced by screen reader software something like "black live (the verb) smatter" BlackLivesMatter is announced as you might expect: "Black Lives Matter" #SocialMedia #Accessibility 2:14pm July 9, 2020 Twitter for iPhone 3 Retweets 3 Quote Tweets 17 Likes Reply icon. Retweet icon. Heart icon. Share icon Avoid Saying “Click Here” Use descriptive call-to-actions like: * Sign up * Try it for free * Subscribe * Watch the webinar * Limit Emoji Use * Accessible * Using one or two emojis ???? Putting any important information before the emojis ???? Limiting yourself to no more than three emojis per message ???? Not Accessible Repeating an emoji over and over ?????????????????????????? Placing emojis throughout a message Please email ?? Activating Change ?? anytime ?? Putting a call to action after the emoji Thank you for attending this webinar ?? Subscribe for more information. * Short Line Length * Less is more * Keep it simple * Limit to 7-10 words per line * Use bullet points * Make Audio & Videos Accessible * Captions/Subtitles Transcripts Caption Your Videos * Image Description: 2 circles overlapping. Top circle light blue: 40% increase in views for captioned videos. Bottom circle purple: 80% increased likelihood that a viewer watches a video to completion when CC are available. * Transcripts * Make Images Accessible * Alt Text Image Descriptions Alt Text * Keep it short and sweet. * Ask yourself: What visual elements are essential in order to understand the image? That’s your alt text. * If an image has text in it, make sure to write out the image text verbatim as alt text. * Is there vital information contained in this image? (e.g. date/time of an event) If yes, then it should go in your alt text. * Include the names of people when their identities are important to the image’s context. Image Descriptions * Describe image more fully and with greater details then you would in alt text. * You can talk about color, where things are located, what people are wearing etc. * Length: be thorough enough to paint a full picture. * Stick to the same location (e.g. in the caption, body of the post, or in the first comment) * Is there vital information contained in this image? (e.g. date/time of an event) If yes, then it should go in your alt text. * Include the names of people when their identities are important to the image’s context. Website Accessibility Why should I make our website accessible? By making your website accessible, you are ensuring that all of your potential users, including people with disabilities, have a decent user experience and are able to easily access your information. By implementing accessibility best practices, you are also improving the usability of the site for all users. Guiding Principles of Accessibility POUR POUR There are four main guiding principles of accessibility that the Web Content Accessibility Guidelines were created around, these four principles are known by the acronym POUR for perceivable, operable, understandable and robust. POUR is a way of approaching web accessibility by breaking it down into these four main aspects. Perceivable * Means the user can identify content and interface elements by means of the senses. For many users, this means perceiving a system primarily visually, while for others, perceivability may be a matter of sound or touch. * An interface is a point where users interact with the website they're using. Operable * Means that a user can successfully use controls, buttons, navigation, and other interactive elements. * For many users this means using assistive technology like voice recognition, keyboards, screen readers etc. Understandable * Users should be able to comprehend the content and learn and remember how to use your OER site. * Your OER should be consistent in its presentation and format, predictable in its design and usage patterns, and appropriate to the audience in its voice and tone. * Open Educational Resources (OER) are teaching and learning materials in the public domain or released under an open license that permits their free use, adaptation, and redistribution Robust * Content must be robust enough that it can be interpreted reliably by a wide variety of users, allowing them to choose the technology they use to interact with websites, online documents, multimedia, and other information formats. * Users should be allowed to choose their own technologies to access OER content. Website Evaluation Tools Easy Checks – A First Review of Web Accessibility https://www.w3.org/WAI/test-evaluate/preliminary/#markup This check looks at the following aspects of a web page. * Page title * Image text alternatives ("alt text") (pictures, illustrations, charts, etc.) * Text: * Headings * Contrast ratio ("color contrast") * Resize Text * Interaction: * Keyboard access and visual focus * Forms, labels, and errors (including Search fields) * General: * Moving, Flashing, or Blinking Content * Multimedia (video, audio) alternatives * Basic Structure Check Easy Checks Web Developer Toolbar for Chrome, and Firefox ("WebDev Toolbar") Chrome Extension https://chrome.google.com/webstore/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm Firefox Extension https://addons.mozilla.org/en-US/firefox/addon/web-developer/ Web Accessibility Toolbar for Internet Explorer ("IE WAT") https://www.tpgi.com/world-of-accessibility/ Juicy Studio Juicy Studio Readability Test, analyses the readability of all rendered content. https://juicystudio.com/services/readability.php Contrast Analyzer Contrast Analyzer, an application that helps you determine the legibility of text and the contrast of visual elements. https://www.tpgi.com/color-contrast-checker/ WAVE Web Accessibility Evaluation Tool * WAVE Web Accessibility Evaluation Tool a suite of tools for facilitating web accessibility evaluation by providing a visual representation of accessibility issues within the page. https://wave.webaim.org/ * Web Accessibility Evaluation Tools List * Web Accessibility Evaluation Tools List https://www.w3.org/WAI/ER/tools/ Accessibility of In-Person Events * Types of DV Awareness Events * Candlelight vigil * Poetry readings/speak outs * Awareness walks/5K’s * Luncheons * Other (Type in Chat) Considerations for Access – Vigils/Speakouts Considerations for Access – Awareness Walks/5K’s Registration * Ensure versatility in how bibs can be adhered to racer * Ensure registration area allows for clear, 36 inch pathways * Course * Start: Is the starting point on an accessible transportation route? Is there accessible parking? * Path: Designate a clear path for accessibility. If the walk/5K is on a roadway, ensure a broad enough shoulder and avoid left turns on the path. Considerations for Access -- Luncheons * Choose an accessible venue * RSVP should provide option to note dietary restrictions, allergies, and need for pre-cut meals * Avoid buffets * Place food, cutlery and china within easy reach * Nothing on risers * Stack cups 2 high * Have bendable straws on hand * Stick to scheduled meal times Site Visit * Always conduct a review of the space where you are holding your event * Parking lots * Entryways * Restrooms * Elevators * Event Space Parking Lots * Accessible spaces must be designated by signs displaying the access symbol. These can be mounted on walls or posts and should be mounted at a height of at least 60 inches. * Van-accessible spaces should have a minimum height clearance of 98 inches and a side access aisle of at least 96 inches. * Accessible spaces for cars must have a side access aisle of at least 60 inches. * Accessible spaces should be located near the entrance and built-up curb ramps should not project into access aisles. * The number of accessible parking spaces required for visitor and employee lots is determined by the number of spaces in each lot. At least one of every eight accessible spaces must be van-accessible. Entryways * Doors must be a minimum of 36 inches wide. * A minimum of 60 inches of clearance space where the door opens. * Doors should require no more than 5 lbs of force to open. * There should be no more than a one-inch slope at the doorway. * If steps are present at the entrance, there must be an accessible ramp available for use in the same location. * Accessible entrances should be designated by the access symbol. * Accessible ramps must have a maximum slope of 1 inch for each foot. * Accessible ramps must have a minimum width of 36 inches. * There should be curb cutouts, and a clear, accessible entry to the building. Elevators * Accessible elevators should be clearly marked with the access symbol. * Accessible elevator doors should be a minimum of 36 inches wide. * The floor space in the elevator should be 48 inches both ways. * Accessible elevator buttons should have Braille markings. * Accessible elevators should have auditory signals. Restrooms * Bathroom counters should be between 28 inches and 34 inches in height, a maximum of 19 inches deep with knee clearance of 27 inches high. * Metal pipes underneath should be covered to prevent burns. * Sink handles should be levers that can be easily pulled. * Accessible toilets should be between 17-19 inches high. Venue Deal Breakers Entryway * Any structural issue that prevents people with disabilities from coming through the main entry way * Any barriers that create a safety hazard for people with disabilities * For example, stairs, no curb cut outs, no space to safely exit taxi/shuttle. Venue Deal Breakers (2) Restrooms * No accessible public restrooms. * Public restrooms that are not accessible (not enough grab bars, uneven thresholds, lack of turning radius. Venue Deal Breakers (3) Attitude * If the venue staff are unwilling to address access concerns (especially if they are easy fixes) * Any history or pattern of racist/ableist behavior Outreach and Community Engagement Outreach and Community Engagement Outreach * Relationships are for the purpose of completing a project * Relationship can be limited to a few community members Community Engagement * Is continually built between and among people and groups. Continuous * Relationship are built not just with current leaders, but also with people with an interest and potential Outreach and Community Engagement (2) Outreach * Relationships are short term, so staff have to rebuild them as other projects or issues come up * Activities include flyering, surveys, focus groups, workshops Community Engagement * Relationships are transformational and long term, community can engage in projects as they come up * Activities include listening sessions, one-to-one meetings, celebrations, leadership development, community building projects Outreach and Community Engagement (3) Outreach * Staff/institutions generate ideas they think the community will support * Staff/institutions generate solutions to a problem they have defined Community Engagement * Staff/institutions support community members in generation their own ideas * Staff/institutions engage in continual self-reflection to incorporate peoples ideas, feedback, talent