WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Embedding Social Media Best Practices

for

From: John Foliot
Date: Feb 7, 2020 1:05PM

Hi Kathryn,

(No paywalls here... ;-) )

So, I think to better answer your question, we need to know what *type* of
social media you are talking about: are you looking to embed a twitter feed
(or similar: LinkedIn, Instagram, etc.), or are you looking to embed
YouTube videos or similar multi-media content? Is it 3rd-party social media
content, or is it user-contributed content on your site?

Effectively, per WCAG, *ALL* content on the page is required to be in
conformance to make a (W3C - WCAG) claim of conformance [1], although if
you are seeking to issue a VPAT, VPATs do have a "meets with exceptions"
classification that you could use (and then detail which WCAG SC are
non-conformant), but that's kind of a lousy place to be in.

So, when evaluating Social Media content for inclusion on your page, all of
the WCAG A & AA SC are applicable. Common issues are often related to
keyboard navigation (including keyboard traps - infinite scrolling, visible
tab focus, color contrast issues related to 3rd-party content, etc.). If
the SM content has any of these issues, they become your problems when you
embed the content (or, at least, that's what WCAG states today).

Q: is this Social media content you are generating for a SM channel,
that you want to also re-post on your website?

The reality today is achieving full WCAG compliance while embedding SM
content today is (last I checked) nearly impossible, because the embedded
content often does not meet all of WCAG's requirements. This is not to say
*DON'T*, but I'd suggest a multi-pronged approach: do everything you can at
your end to support as much accessibility as possible (avoid really
egregious content feeds), and have an internal policy that notes that your
organization has done everything in its power to ensure accessibility, but
that some 3rd party content may still not be fully accessible. (Put that in
your publicly facing Accessibility Statement)

If it is content you are creating for, say, YouTube (or any other
multi-media posting/hosting platform), then chances are those platforms do
not support (for example) audio-description. None-the-less, as a content
*producer*, you are still responsible for that audio-description to be
created. Then, when you post your 'video' on YouTube or Facebook (for
example), you can (SHOULD) also post a link to that accessible content,
which you should host on *your* corporate site. It's not ideal, but at
least you are making it available (and from a legal compliance perspective,
you are demonstrating that you are trying as hard as you can to meet the
spirit of WCAG, even if you occasionally cannot fully meet it).

HTH

JF


[1] https://www.w3.org/TR/WCAG21/#conformance

On Fri, Feb 7, 2020 at 12:06 PM glen walker < <EMAIL REMOVED> > wrote:

> Gian Wild from AccessibilityOz has spoken several times about the
> accessibility of social media. There are two archived presentations from
> her on https://www.accessibilityassociation.org/archivedwebinardirectory
> (search for "social" on the page) but that requires IAAP membership to
> watch them and I think it's about the accessibility of the various social
> media platforms themselves rather than embedding them on your website.
>
> She does have an article about embedding social media but it requires a fee
> to access but might be worth it ($39). (The fee gives you access to lots
> of articles, not just that one. Depending on your budget for the redesign,
> an extra $39 out of your budget might be a drop in the bucket.)
>
>
> https://www.accessibilityoz.com/products/ozwiki/social-media-embed-accessibility/
>
> (I'm not affiliated with AccessibilityOz in any way. I just know Gian has
> spoken about this topic several times so just wanted to pass along the
> info.)
>
> From my perspective, having social media embedded can be good or bad. They
> often have infinite scrolling so you need a way to get out of the embedded
> content or skip over it completely. Having a visually hidden "skip over"
> link before the embedded content that lets you jump over the content would
> be helpful. If you're feeling ambitious, a "skip over" link *after* the
> embedded content can be helpful too if you are tabbing backwards through
> the page.
>
> You could also consider having a disclosure widget (
> https://www.w3.org/TR/wai-aria-practices/#disclosure) for the social media
> content so the user has to expand the content to see it. That would make
> tabbing over the content pretty easy (when it's collapsed).
>
> You'd still have to consider providing a way to get out of the embedded
> content if the user has tabbed significantly through the content. That is,
> if I'm tabbing through the page and get to the social media content, then
> start tabbing through the content, after I've gotten into it for a ways, I
> might decide I want to get out. If it has infinite scrolling, then I can't
> keep tabbing forward because I'll never reach the end. I could tab
> backwards to retrace my steps but if I'm way into the content, that might
> take a long time. At that point, having some kind of shortcut key to get
> out of the content is a possibility, but shortcut keys are often hard to
> discover. The user would have to be notified what the shortcut key is.
> Maybe a note before the social media content. You can either implement
> your own shortcut key (ctrl+<somekey>) or use the accesskey attribute.
>
> You also run the risk of the social media content itself not being
> accessible, but that's out of your control.
>
> On Fri, Feb 7, 2020 at 7:15 AM <EMAIL REMOVED> <
> <EMAIL REMOVED> > wrote:
>
> > Good Morning,
> >
> > I am helping implement accessibility features on a website redesign for
> my
> > organization. They're wanting to embed social media content on the
> website
> > homepage. Can you please direct me to WCAG guidance and/or accessibility
> > best practices in this regard?
> >
> > Thank you in advance for your assistance.
> >
> > Sincerely,
> >
> > Katie Frederick
> > > > > > > > > >
> > > > >


--
*​John Foliot* | Principal Accessibility Strategist | W3C AC Representative
Deque Systems - Accessibility for Good
deque.com