Pat Ramsey, Principal, slash25.com. What’s your definition of social media? From participants: 1) where content is user-generated, 2) forums, 3) e-mail groups, listservs, 4) online space where people can communicate and collaborate, 5) any space that allows you to build community, 6) media away from the Web. From traditional media sources, on-line communities–broad term.
Define: Social Media (Wikipedia, Bottle PR, Search Engine Watch). Ramsey defines as the online equivalient to “The Kitchen At A Party.” Increasing number of social media sites, some are beginning to fold, being compared to the .com bubble.
Social Media succeeds: 1) people come together with little regard to geographic barriers, 2) allows the crowd of humanity to reach information otherwise unattainable, 3) sparks creativity and imagination.
SMS is the only tool for much of sub-saharan Africa. Convert text to e-mail messages and send.
Hash tags on Twiter.
Social Media steps in it: 1) when there is no method of skipping repetitive content (skip-naves, skip links), 2) when there are not text equivalents (alts) for images–social media sites tend to lean towards the heavy-image category of sites, 3) when there are little to no means of identifying the purposes of inputs, controls, and text areas.
Facebook–automatically generated link names that go on forever, have no clue what it is. Other problems: form labels. No title attributes–no way of knowing what to put where. Has no area for alts for photos. Twitter does alts on thumbnails in timeline, automatically generated by user name, so can link to other users.
Competitive market causes folks to rush stuff out without planning in accessibility. User-generated, and users are not educated about accessibility. Ex.: YouTube. Even developers don’t know–lack of awareness, certainly no testing.
Text alternative problems: thumbnails in discussion threads, images in user photo galleries, avatars in forums. CAPTCHAS–alt attributes can be problematic for CAPTCHAS as their purpose it to reduce accessibility for computer programs (robots), but maintain accessibility for ONLY normal sighted humans.
Audio CAPTCHAs offer greater flexibility, but still pose challenges to user. Difficult to understand. Possible solution: validating questions (”What color is the sky?”). When you make it difficult for users to interact, you’re not serviing your folks. CAPTCHAs have already been broken. Better to rely on your e-mail spam functions. If commercial products offer solutions, most likely Black Hat hackers already broke them two years ago.
Information, relationships, and labels are problematic. Labels must be properly associated with a field via the “for” and “id” attributes. Jaws sees title attributes used in fields.
Looked at how three social media sites do 3 major functions. Facebook minuses: form fields unlabeled, no title attributes; audio CAPTCHAs difficult to hear; lack of alts on images. Facebook pluses: help page available regarding accessibility. Works better on mobile site: m.facebook.com. text/xhtml+xml means it works with IE, simpler version of site, easier to use for most things, faster loading, *login and other form fields still unlabeled, much easier for screen reader use.
Twitter: “What are you doing” textarea properly labeled. Images conveying information have appropriate alt attributes. Skip nav present. “Following,” “followers,” “updates” links start with number value rather than object–maybe invert them. Greasemonkey scripts (Firefox add-on, can write them yourself) available to enhance accessibility. Third-party accessible alternative. Hover function that shows links isn’t readable by screen reader.
Twitter Mobile: application/xhtml+xml will load in Firefox, not IE. No images, stripped down text, no sidebar, etc.
New solution for Twitter w/Jaws: “Jawter.” Allows you to get updates, with audial alert. SXSWi broke AT&T’s network, killed Twitter. SMS worked, however! Don’t activate “all text messages” or will kill your phone.
WordPress (.org, not .com): 2 areas of concern–accessibility of published content, accessibility of the administrative interface. Function of their CMS system. Make sure headings are correct, forms labeled properly, colors aren’t out of whack–test with the same steps you do for any Web page. Templates then build pages, propagating accessibility code throughout all pages.
Administrative interface: can be edited just as theme templates, but edits will be lost when you upgrade. Post title input has no label or title attrib, no skip nav, Visual Editor uses ifram with HTML page for textarea–body of the post. Good: alt-z jumps straight to the body of the post, however, this should be made known to users, using a heading or label that’s positioned offscreen. A few other keyboard shortcuts, but the code doesn’t tell the screen reader.
Developers know that things can be better. The developer community is making strides–distributed, back-channel development: TPG-notifier. WAI-ARIA.
Iterate: find the accessibility hooks in your social media app of choice; share your findings so others don’t slog through unnecessarily–you may find people have written workarounds and fixes. Communicate with developers, submit patches if possible.