Christmasify Plugin? Accessibility Nightmare

By Graham Armfield | 6th December 2017

As Christmas approaches in the UK, all the traditional decorations, imagery and sounds appear. Trees are put up, fake snow dotted about and shopping centres pipe carols at us all. So how does Santa relate to accessibility? Let me share an inclusive Christmas tale with you.

At a WordPress meetup the other day, someone mentioned the digital version of this – a WordPress plugin called Christmasify. This plugin gives site administrators the option of having a selection of Christmassy items added to their website. Options include: snowfall, Santa on his sledge moving across the screen, some Christmassy tunes playing, festive decorations for images, and a Christmassy font for the headings.

Screenshot of website page with content and an image. Snowflakes are passing across the screen - as is Santa's sledge.

Screenshot showing snow and Santa on the screen – provided by the Chistmasify plugin.

Now I know this is not a serious plugin, and it’s supposed to be a bit of fun. But I would urge people to think twice about the impact on accessibility of any site where they might choose to use this plugin.

In my view, if you use this plugin on your WordPress site, you may also need to be prepared to say goodbye to significant numbers of your site visitors – and think what that may do to your bottom line.

This blog post is about the accessibility problems this plugin (and others like it) can cause. I’ll also look at whether there may be changes to the plugin that would save it from being a total accessibility nightmare.

Accessibility problems with movement

Movement within a web page can be annoying or distracting for significant numbers of people.

Dyslexics (who maybe make up around 10% of the population), and others with learning or reading difficulties, can have some problems reading text on web pages. Add in random white snowflakes moving down over the text, and Santa’s sledge coming across from the right, and it will make life even harder for these people.

Some autistic people, and those with Asperger’s or ADHD (Attention deficit hyperactive disorder) will find the continuous movement very distracting, and sometimes actually painful to view. If they can’t stop the movement, they are likely to leave our Christmassy site almost immediately.

People with poor vision are also going to be impacted by the incessant movement as they try to focus on the core content on the page.

Accessibility problems with autoplaying sounds

If you choose to add in the plugin options having a Christmas jingle playing, these are set to autoplay when each page of the site loads.

Unexpected audio and video playing in pages can cause concentration issues for people on the Autistic spectrum or those with ADHD. It can also affect people with reading or learning difficulties in the same way.

Screen reader users may find that autoplaying sounds can obscure what their screen reader is saying. However it’s less likely to be an issue with this specific plugin, as the volume of the music is quite low initially.

When the Christmas jingle is playing, there is an audio control inserted at the bottom of the page, so it is possible to stop the music. But this control is almost the last element within the pages, so sighted keyboard users will have some difficulty finding the controls quickly if they want to stop the music.

Any other accessibility issues?

Screenshot of test page on smartphone screen.

Test page with Christmasify plugin – seen on mobile device.

The controls within the audio player are not labelled, so screen readers will not announce what they are for. Additionally, within NVDA screen reader the audio control plays NVDA’s progress beeps whenever the music is playing. Now that is annoying!

I checked the test site with a mobile screen reader (Talkback) on my Android phone. I was concerned that the snow and Santa could interfere with usage of the mobile screen reader for those users who drag their fingers around the screen to focus on elements. Fortunately, there didn’t seem to be any problems here.

I also noticed that on my mobile, the music did not autoplay as it does when on a desktop or laptop.

The festive decoration on images within pages was provided using a CSS background image, and so was effectively ignored by screen readers and other assistive technologies.

Finally, the plugin substitutes the fonts used in headings on the page with one that is much more decorative. Some may find this stylised font harder to read.

Could the plugin be made better?

The main issues with this plugin are that:

  1. The user has no control over the snowfall and Santa movement – both of which automatically move across text on the page
  2. The audio can be switched off but the audio player exposes no useful screen reader labels for the controls, and the player controls are situated right at the bottom of the page

Both of these issues could be addressed if there was an obvious ‘Stop’ button provided at the top of the page – one that was keyboard accessible and had a sensible label for screen readers.

When operated this button should just disable the entire plugin functionality and remove the extra markup that the plugin adds to pages – including the button. Ideally, the plugin should then set a cookie which means that the plugin is deactivated for all other pages on the site.

Setting a cookie may seem extreme here, but most websites will use cookies for analytics purposes anyway. And this is a good use of a cookie – to remember a user’s preferred setting.

Is this the only snow plugin?

No, it seems there are a few in WordPress… (sighs)

Screenshot from admin screen in WordPress showing multiple results for a search on Snow.

Just some of the WordPress plugins to provide snow on your website.

Any questions?

If you’d like to know more about providing specialist web design and development functionality in an accessible way, please contact us and we’d be delighted to answer your questions.

From all the team here at Open, we wish you all a very happy Christmas – wherever you are.