1. Guidance for 3rd party content providers
Ba.com accessibility
Guidance for 3rd party content providers

2. Accessibility refresh
The law
USA DoT requires all CORE functions (selling and servicing) to be AA compliant to the WCAG 2.0 accessibility standards by June 2016
All non-core to be compliant by December 2016
The customer and business benefits
Customers with disabilities should be able to access services and buy products online without prejudice
Making a web product more accessible not only increases revenue, but increases efficiency gains and customer satisfaction
A customer with a disability will see from the start of their journey that British Airways go the extra mile for them

3. Types of disability Blindness (total or partial)
Customers will require a screen reading aid or braille
Customers may require high contrast/ larger text
Visual impairments (Colour, luminosity, tunnel vision, etc.)
Customers require things to be easy to see and differentiate
Relying on colour could lead to customers making mistakes
Learning and communication difficulties
Content and instructions should be easy to read and understand
Dyslexia, Autistic scale, low level of English/ core language, etc.
Mobility impairments (Arthritis, MS, broken limbs etc.)
Customers should be able to use the web product with other user-agents (keyboards, pointers, wheels, etc.)
Others
Epilepsy, hearing, Alzheimer's, Dementia, Parkinson's, etc.….

4. Accessibility as part of your processes

5. ‘The rules’ for content providers

6. Correct content heading hierarchy

7. All images must have alt text
Unless an image is truly offering information that is useful to a reader, alt should be alt=“”
If the title of the image is present in text, alt=“”
If the image is offering information useful to a customer and this information is not present anywhere else, alt=“description”
A banner image containing text will either need a descriptive alt tag or a LONGDESC. Best to avoid using text as images

8. All images must have alt text

9. Content and focus order
Focus order specifies how customers who don’t use mice navigate through content on a page
In most cases, components have been designed to cater for the correct logical focus order
AA guidelines recommend that focus order is logical and makes sense to the customer
This may mean that content needs to be structured and presented in such a way that customers can follow what is being said in a logical manner

10. Example – focus order

11. Example – Focus and Screenreader flow
An example on how to illustrate the screen reader reading order as shown in green, with the focus order in purple.

12. HTML title All pages must have a unique HTML title
This is what you see in the browser tab
Needs to be SEO friendly and clear to the customer

13. Content and Aria role tags
ARIA role tags announces to screenreader users that the state of the page has changed
You should not need to do much with role tags unless
You are building forms and changing a form field causes the page to update (example, select country)
You are offering a link that opens up a modal or popup (State that Aria tag needs to be added, don’t worry about the syntax)
Or you are designing a page where a user interaction will change the state of the page (Opening an accordion)

14. Links and buttons Links should make sense when read out of content
Avoid the use of ‘Click here’ or similar
Try to succinctly remind the customer where they will go if they interact with the link
Where ‘More’, ‘More information’ etc need to be used, if you think the link means nothing out of context, add an anchor (<a>) title
Don’t overdo anchor titles
Be clear what the will happen when a customer interacts with a button
Avoid ‘Next’, use verbs such as ‘Buy’
Avoid ‘View’ as blind people can’t view!

15. Forms and errors
All form fields must have a label that makes sense to the customer
Grouped items such as radios should have a fieldset group assigned
Errors either need to be explained at the top of the page or made clear near the form field so that customers know what they need to do to correct the error

16. IDD – Forms and labelling

17. Colour and contrast To be AA compliant, contrast must be at least:
At a ratio of 4.5:1 for normal text and
3:1 for large text (14 point and bold or larger, or 18 point or larger).
Remember though that a point is not a pixel, so 14pt text is not 14px.
WebAim’s contrast checker can be used to check foreground and background contrast compliance
For gradients and text on images. If you have white or light text, check the text against the lightest part of the gradient. Visa-versa for dark text

18. Using Webaim contrast checker
Passes contrast on all copy larger than 11pt
Passes contrast on all copy larger than 14pt bold or 18pt regular
FAILS on anything else

19. Videos All videos must have a transcript
A transcript should appear in a popup window (not modal) as html mark-up
A transcript only needs to explain elements of the video that are of use to the customer
Captions are not required
A transcript should be linked from a link underneath the video

20. PDFs Portable document format files must be made to be AA complaint
This will mean that the source file will need to have been created to AA levels of complaince
PDFs should be saved as accessible PDFs if converting from Office or similar
Image/ brochureware PDFs will need alternative text if images are conveying information