Social media feeds update - a11y issues and more

Hung, Jonathan jhung at
Thu Oct 19 18:48:27 UTC 2017

I'll follow-up my email with my personal recommendation.

Option 2 seems to be the first step. The issue here is whether any of the Wordpress plugins provide enough functionality to let us use CSS customizations and UI Options.

If such plugins do not exist, then we will have to go with Option 3 where we have to make our own solution.

- Jon.

Jonathan Hung, Inclusive Designer
Email: jhung at
OCAD University
Inclusive Design Research Centre

From: fluid-work <fluid-work-bounces at> on behalf of Hung, Jonathan <jhung at>
Sent: October 19, 2017 2:19:17 PM
To: Fluid Work
Cc: Roberts, Vera; Pereyra, David
Subject: Social media feeds update - a11y issues and more

Hi everyone,

This email is concerning the BIG IDeA website, and some issues uncovered with the accessibility of the social media feeds we've implemented. Since this may have some impact on other projects, I saw this relevant to discuss openly with the community.

Erica has helped implement the social media feeds on the development site for Big Idea. You can see it here:

I did some initial testing of it and a number of issues come up; here some of the major ones:

  1.  The social media feeds provide default styling, but the defaults aren't all WCAG compliant, and do not work with UI Options.
  2.  There is a keyboard focus trap in the Facebook feed where you can tab into the FB panel, and you can't exit the panel because FB keeps adding more and more content.
  3.  Window / device scaling doesn't happen nicely if you resize the window. This may not be a huge issue as it seems to only happen if the user resizes the window (and it fixes itself when you reload the page).

Fixing these problems will take some extra time. Here are the possible options:

  1.  Don't fix things and go with it as-is. We can try to fence off the social media feeds with some ARIA to keep ATs from accessing those feeds, but it can be very confusing for some users (i.e if someone has partial vision they will be confused as to why they can't access areas with their screen reader even though they can see content there).
  2.  Try to find a way to fix the issues using the 3rd party API or find a Wordpress plugin that enables us to override the CSS so we can do some customization. I estimate it will take 4-6 days to do the research and the implementation, plus ongoing maintenance ensuring plugin gets updated regularly and that it doesn't break our integration. (Does anyone know of any FB, Twitter, and Instagram plugin which has customizable CSS and is accessible?).
  3.  Roll our own solution using their developer API that will be more customizable, accessible, and transformable. Going this way may be relevant to Floe as we can create a resource which can be reused by ourselves and by our partners. A very rough estimate 8 to 10 days + ongoing maintenance.
  4.  Other options? I'm open to suggestions.

I hope I have provided enough detail. I welcome your input in how we might go forward with this.

- Jon.

Jonathan Hung, Inclusive Designer
Email: jhung at
OCAD University
Inclusive Design Research Centre

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <>

More information about the fluid-work mailing list