WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Suggestion required for Facebook iframe feed provided in a web page

for

Number of posts in this thread: 5 (In chronological order)

From: Mohith BP
Date: Thu, Sep 10 2020 2:22AM
Subject: Suggestion required for Facebook iframe feed provided in a web page
No previous message | Next message →

Hi Team,

One of the sites is using the iframe and loading the Facebook posts dynamically.
The iframe is in the main region of the home page and there is content
after and before the iframe.
Issues Found:
1. Elements to like, comment and play video are not labelled. At times
NVDA just reads button.
2. Tab navigation: it is infinite scrolling as it is a feed and older
posts gets continuously loaded.

Queries:
1. As it is an external content what is the requirement of WCAG
conformance? Developer states there is no control over the data as it
is loaded from Facebook.
2. What is the best keyboard mechanism can be implemented here?
3. Is "3.11 Feed" pattern from ARIA Authoring document good?

Thanks & Regards,
Mohith B. P.

From: Patrick H. Lauke
Date: Thu, Sep 10 2020 2:35AM
Subject: Re: Suggestion required for Facebook iframe feed provided in a web page
← Previous message | Next message →

On 10/09/2020 09:22, Mohith BP wrote:
> Hi Team,
>
> One of the sites is using the iframe and loading the Facebook posts dynamically.
> The iframe is in the main region of the home page and there is content
> after and before the iframe.
> Issues Found:
> 1. Elements to like, comment and play video are not labelled. At times
> NVDA just reads button.
> 2. Tab navigation: it is infinite scrolling as it is a feed and older
> posts gets continuously loaded.
>
> Queries:
> 1. As it is an external content what is the requirement of WCAG
> conformance? Developer states there is no control over the data as it
> is loaded from Facebook.

It's embedded in your page, so initial responsibility still falls on you
as the site owner. You're adding something to your site that has
accessibility issues, so in the end visitors that are on your site are
affected. I suppose you could make a statement of partial conformance
https://www.w3.org/TR/WCAG21/#conformance-partial - but ultimately,
consider that, 3rd party or not, this affects your visitors directly.

> 2. What is the best keyboard mechanism can be implemented here?

I'd say weigh up whether the benefit of having those embedded FB posts
outweighs the accessibility impact, first and foremost. It's been a
while since I dove into this, but wondering if there's a developer API
provided by FB that let you grab content, process it yourself, and show
it on your site with a template/format that you have control over
(rather than embedding in an iframe). That would be the ideal situation
- showing the latest few posts or whatever using your own controlled
method, plus then a link to FB directly if users absolutely want to go
and see more.

If the iframe turns out to be a black hole for keyboard users (once they
enter it, they get stuck in an endless/continuously updating list of
posts), a quick interim patch could be to provide a skip link
before/after the iframe to let keyboard users at least bypass it. Not
elegant, but could at least mitigate some of the issues for this user group.

P
--
Patrick H. Lauke

https://www.splintered.co.uk/ | https://github.com/patrickhlauke
https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
twitter: @patrick_h_lauke | skype: patrick_h_lauke

From: Mohith BP
Date: Thu, Sep 10 2020 9:54PM
Subject: Re: Suggestion required for Facebook iframe feed provided in a web page
← Previous message | Next message →

Hi Patrick,

Thank you for the response.
I will ask the developer to check on the FB API.
Patrick wrote:
"If the iframe turns out to be a black hole for keyboard users (once
they enter it, they get stuck in an endless/continuously updating list
of posts), a
quick interim patch could be to provide a skip link before/after the
iframe to let keyboard users at least bypass it. Not elegant, but
could at least mitigate
some of the issues for this user group."
Query: Is it okay to provide Ctrl + Home and Ctrl + End to move before
and after the iframe as documented in Aria Authoring Practices Feed
along with the skip link in the beginning of the iframe?

Thanks & Regards,
Mohith B. P.

On 9/10/20, Patrick H. Lauke < = EMAIL ADDRESS REMOVED = > wrote:
> On 10/09/2020 09:22, Mohith BP wrote:
>> Hi Team,
>>
>> One of the sites is using the iframe and loading the Facebook posts
>> dynamically.
>> The iframe is in the main region of the home page and there is content
>> after and before the iframe.
>> Issues Found:
>> 1. Elements to like, comment and play video are not labelled. At times
>> NVDA just reads button.
>> 2. Tab navigation: it is infinite scrolling as it is a feed and older
>> posts gets continuously loaded.
>>
>> Queries:
>> 1. As it is an external content what is the requirement of WCAG
>> conformance? Developer states there is no control over the data as it
>> is loaded from Facebook.
>
> It's embedded in your page, so initial responsibility still falls on you
> as the site owner. You're adding something to your site that has
> accessibility issues, so in the end visitors that are on your site are
> affected. I suppose you could make a statement of partial conformance
> https://www.w3.org/TR/WCAG21/#conformance-partial - but ultimately,
> consider that, 3rd party or not, this affects your visitors directly.
>
>> 2. What is the best keyboard mechanism can be implemented here?
>
> I'd say weigh up whether the benefit of having those embedded FB posts
> outweighs the accessibility impact, first and foremost. It's been a
> while since I dove into this, but wondering if there's a developer API
> provided by FB that let you grab content, process it yourself, and show
> it on your site with a template/format that you have control over
> (rather than embedding in an iframe). That would be the ideal situation
> - showing the latest few posts or whatever using your own controlled
> method, plus then a link to FB directly if users absolutely want to go
> and see more.
>
> If the iframe turns out to be a black hole for keyboard users (once they
> enter it, they get stuck in an endless/continuously updating list of
> posts), a quick interim patch could be to provide a skip link
> before/after the iframe to let keyboard users at least bypass it. Not
> elegant, but could at least mitigate some of the issues for this user
> group.
>
> P
> --
> Patrick H. Lauke
>
> https://www.splintered.co.uk/ | https://github.com/patrickhlauke
> https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> > > > >

From: Patrick H. Lauke
Date: Sat, Sep 12 2020 2:15AM
Subject: Re: Suggestion required for Facebook iframe feed provided in a web page
← Previous message | Next message →

On 11/09/2020 04:54, Mohith BP wrote:

>> If the iframe turns out to be a black hole for keyboard users (once they
>> enter it, they get stuck in an endless/continuously updating list of
>> posts), a quick interim patch could be to provide a skip link
>> before/after the iframe to let keyboard users at least bypass it. Not
>> elegant, but could at least mitigate some of the issues for this user
>> group.

I'd say users are likely not to know/guess those key combinations, so
you may need to give them a clear hint. Also, this won't help users on,
say, touchscreen+AT scenarios (nothing new, ARIA practices has long had
a major gap/hole when it comes to anything that isn't the traditional
desktop+keyboard+AT setup). Maybe a humble skip link is more robust.
(and if the Facebook embed is present on more than one page, arguably
this all falls under 2.4.1 Bypass Blocks and the need to provide a
mechanism).

P
--
Patrick H. Lauke

https://www.splintered.co.uk/ | https://github.com/patrickhlauke
https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
twitter: @patrick_h_lauke | skype: patrick_h_lauke

From: Mohith BP
Date: Sun, Sep 13 2020 9:19AM
Subject: Re: Suggestion required for Facebook iframe feed provided in a web page
← Previous message | No next message

Hi Patrick,

Thank you for the suggestions.
FB iframe is only on the home page.

Thanks & Regards,
Mohith B. P.

On 9/12/20, Patrick H. Lauke < = EMAIL ADDRESS REMOVED = > wrote:
> On 11/09/2020 04:54, Mohith BP wrote:
>
>>> If the iframe turns out to be a black hole for keyboard users (once they
>>> enter it, they get stuck in an endless/continuously updating list of
>>> posts), a quick interim patch could be to provide a skip link
>>> before/after the iframe to let keyboard users at least bypass it. Not
>>> elegant, but could at least mitigate some of the issues for this user
>>> group.
>
> I'd say users are likely not to know/guess those key combinations, so
> you may need to give them a clear hint. Also, this won't help users on,
> say, touchscreen+AT scenarios (nothing new, ARIA practices has long had
> a major gap/hole when it comes to anything that isn't the traditional
> desktop+keyboard+AT setup). Maybe a humble skip link is more robust.
> (and if the Facebook embed is present on more than one page, arguably
> this all falls under 2.4.1 Bypass Blocks and the need to provide a
> mechanism).
>
> P
> --
> Patrick H. Lauke
>
> https://www.splintered.co.uk/ | https://github.com/patrickhlauke
> https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> > > > >