Web Accessibility Evaluation of Sample pages

Evaluated By: Sivaprasad. PContact: sivaprasad2020@gmail.com

Document prepared & shared in connection with the application for the position of “Accessibility Specialist” @ RBC.

Royal Bank of Canada : Web Accessibility Evaluation of Sample Pages

Introduction • What tools to be used for this evaluation? Browser: Internet Explorer 11 Screen reader: Windows Eye, JAWs Speech Recognition software: Dragon Naturally speaking Windows Accessibility toolbar

• Accessibility Standards Meeting the baseline Section 508 standards and practical WCAG 2.0 (Web Content Accessibility Guidelines. Considerations with the use of colors on web sites in recognition of color blindness and related impairments.

Note: This evaluation is done only for a set of sample pages. They are by no means comprehensive and the pages are selected at random without considering the priority of user tasks on the site.

Accessibility GuidelinesItem Purpose

Text Alternatives All non-text content that is presented to the user has a text alternative that serves the equivalent purpose

Image maps Client-side image maps are used and alternative text is provided for image map hot spots. Equivalent text links are provided if a server-side image map is used

CaptionsCaptions are provided Audio and Video (Pre-recorded)

Live MultimediaInformation and Relationships Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in

textMeaningful Sequence When the sequence in which content is presented affects its meaning, a correct reading sequence can be programmatically de-

terminedForms Form element labels can be programmatically determined

Tables Table cells and relationships between cells can be programmatically determinedCascading style sheets Web pages are readable without requiring style sheetsSensory Characteristics Instructions provided for understanding and operating content do not rely solely on sensory characteristics of components such as

shape, size, visual location, orientation, or soundUse of Color Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a

visual elementAudio Control Ensuring that when a user with a hearing disability does not attract unwanted attention or unintentionally disturbs those around

them

Keyboard Users with a physical disablement may be unable to use a mouse. The most common form is when a user has an injury affecting the arm they usually use to control it. But equally the user could be completely unable to use a mouse permanently

Scripts Scripts are keyboard accessible. If the content affected by scripting is not accessible, an alternative is provided

Applets, plug-ins, and non-HTML content Should a plug-in be used which in itself is inaccessible to users with disabilities, it may result in that user being unable to perform required activities.

No Keyboard Trap For users unable to use a mouse, should they be tabbing through a page and be unable to tab forwards or backwards, they will need to have to go to a previous page and try again. This may result in loss of web page tasks they have already performed

Accessibility GuidelinesItem Purpose

Adjust time responseIf the user has a disability, it is likely they may need more time to perform the actions they need to do on a web page. Automated time responses can pose a problem here if the site does not take in to account the abilities of the user. There are very simple rules for managing this which depending on the sensitivity of the data, may be appropriate.

Pause, Stop, HideA user with a disability may not be able to respond to where a fast response by the user is expected. Where feasible, there should be a way for the user to control that speed. It should also be recognised that such a feature may not be interpreted by screen reading software correctly.

Flashing Content or Below Threshold Users who (or may not be aware of) having an epilepsy related illness may experience seizures if exposed to flashing content.

Navigational features Screen reading software literally reads the content to the user. If web pages contain content that is repetitive and does not need reading out every time, it should be possible for the user to quickly skip over the content if they do not need to read\hear it.

Frames Screen readers can read FRAME’s just like other HTML tags but in order for them to be able to be read, they require a meaningful title, and their content should be readable by the software. This is key for users with difficulty in seeing.

Page Titles and Link PurposeAs the first piece of HTML content read on a page by a screen reader, it is essential that how it is described fully reflects the purpose of the page. Without doing this, it can make pages difficult to understand by users with difficulty in seeing.

Focus Order This is important to ensure that when users are unable to navigate a page by mouse, they can still get around it efficiently via a keyboard.

Link Purpose Link information is read out to users using screen readers. If they are not descriptive, a user who has difficulty seeing may not be able to fully understand the purpose of each link.

Language of Page There are solutions delivered in a multilingual format. Users are also likely to read a page in a language that is most native to them if possible.

On Focus On Focus implies that the user knows where focus is on a web page. Since a user with difficulties with seeing may not be aware of this, it should not be used in any way that makes usage of the application reliant upon it.

On Focus On Focus implies that the user knows where focus is on a web page. Since a user with difficulties with seeing may not be aware of this, it should not be used in any way that makes usage of the application reliant upon it.

Accessibility GuidelinesItem Purpose

On Input A screen reader user is dependant on what the software tells them about a web page, if the web page behaves in what they would determine as “in an unexpected way”, it can make the web site difficult to use for users with difficulty in seeing to use

Error Identification When an application provides error feedback, it needs to do it in such a way that a screen reader can interpret and communicate them to the end user. Otherwise users who have difficulty in seeing may have trouble fixing the errors

Labels or InstructionsPeople with disabilities may face difficulty when errors occur on a Web-based form. The purpose of this checkpoint is to ensure that Web inter-faces contain unambiguous labels, input format examples, and instructions for completing forms, which enable users to avoid errors when input is required.

ParsingEnsuring that web pages are well formed and can be parsed according to the HTML and XHTML mark-up standards is necessary to ensure that screen reading software can interpret web pages correctly. It is also a means of future proofing web pages for continued support in later ver-sions of web browsers.

Name, Role, ValueIn the rare event that a new HTML control is created, this is to ensure that screen readers and other assistive technology can access the prop-erties and attributes it requires.

Text-only page There may be features in a solution which just do not work with screen reader access in an effective way. In the event of this occurring, an al-ternative text only page should be provided and all efforts should be made to ensure that where possible equivalent functionality is available.

Accessibility-SupportedTechnologies Only

If a solution has been delivered to be accessible, but does not work with Accessible Technologies, it is still “inaccessible”. It is therefore import-ant to ensure that when delivering an accessible solution, that it works with the expected Accessible Technologies.

Use of colorColor-blindness (Color Vision Deficiency) is one of the most common forms of disability in the workplace. It affects approximately 10% of males but a much lower proportion of females. With an organisation of around 150,000 people, ithat would indicate the firm has at least 7,500 em-ployees with a color-blindness.

Use CSS to control color choicesSome users with color-blindness find that it helps to use their own customised CSS stylesheet. This ensures that key information is clear E.g. links and headings.

Findings SummaryPages Violated EY Accessibility Guideline Priority

Home Text AlternativesLabels or instructionsKeyboard Access to screen elementsMeaningful information

Bank Accounts Text AlternativesLabels or instructionsKeyboard Access to screen elements

Credit Cards Labels or instructions

Keyboard Access to screen elements

Mortgages Labels or instructions

Keyboard Access to screen elements

High- Errors that prevent users from performing a task

Medium - Errors that make tasks difficult to perform for the user

Low – Errors which if fixed, will improve the ease with which tasks can be per-formed

Findings SummaryPages Violated EY Accessibility Guideline Priority

Loans Labels or instructions

Keyboard Access to screen elements

Investments Labels or instructions

Advice Text Alternatives

Labels or instructions

Keyboard Access to screen elements

High- Errors that prevent users from performing a task

Medium - Errors that make tasks difficult to perform for the user

Low – Errors which if fixed, will improve the ease with which tasks can be per-formed

Detailed findings

Non-compliance issues• Accessibility Check point: Text Alternatives• Issue Noted: Missing alt text or Absence of relevant alt text for various screen

elements like icons, images etc.• Remediation: Make sure all non-text elements on screen has relevant and

meaningful alt text to enable screen reader reading.

Non-compliance issues• Accessibility Check point: Information and Relationships: • Issue Noted: Too many abbreviations shown on the page. • Remediation: It will be always in the best interest of the users not to use full

names instead of abbreviations

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Top of the page, screen reader announces, Francoise and Welcome to

Canada. This is not announced without announcing any context that is screen reader does not announce that these two options are part of the language toggle combo box.

• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Screen reader announces "Welcome to Canada" link, this is infact the

Chinese option in the language toggle option. Announcement should ideally be Fran-coise and Chinese. Wrong alt text given. see the code: <li><a href="http://www.rb-c.com/chinese/canada/" class="nohover" lang="en"><img src="/uos/_assets/im-ages/header/chinese.gif" alt="Welcome to Canada"...

• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: For Global nav like Bank accounts, credit cards etc., there is a mega

menu which is available on mouse over but not announced by screen reader• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Screen reader does not announce the options available inside "You are

in" combo box.• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Find a branch or ATM near you banner at the bottom middle of the page

is not being announced by the screen reader. It only announces the radio buttons of branches/ATMs etc..

• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: In auto read mode, screen reader announces Advance search option

soon after the radio buttons of Branches and ATMs. Visually, cursor should reach ad-vance search option after postal code.

• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: RBC Advice centre banner is not being announced properly by screen

reader. This banner has no alt text available. So this banner does not convey any-thing to differently enabled user.

• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Screen reader does not announce the Current selection that is Home

page is currently loaded• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: When the tab selection reaches a link, there is no selection highlight-

ing.• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: On auto read mode, under language toggle option, only the options are

announced by screen reader. Screen reader does not announce Francoise and Chinese are options available under language toggle option. This language toggle option is recognised by screen reader only when tabbing.

• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Screen reader does not announce the content open in the Vertical tabs

in the middle of the page. The radio buttons inside the tab cannot be accessed by keyboard tab. This can only be accessed through mouse. This can be like the check boxes in the Investments page where the check boxes may be selected with arrow keys.

• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Screen reader does not announce the Current selection that is Bank Ac-

counts page is currently loaded• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Screen reader does not announce what's available inside each of the

tabs that are in the closed state.• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: What does your some day look like combo box, the content gets

changed with down arrow, but there is a description for each goal, which is not an-nounced by the screen reader.

• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Contact a mobile financial planner banner is not announced by the

screen reader.• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: The headings of the articles in the carousal is not proper. For instance,

the heading "How to effectively negotiate for a car at a dealership" is announced by the screen reader as How dash to dash effectively dash negotiate dash for dash a dash car dash at dash a dash dealership

• Remediation: Labelling and instructions should primarily aim at providing users clear understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Carousal controls have no proper alternative text. Screen reader an-

nounces a link when the tab arrives on any of the carousal control.• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Labels and Instructions• Issue Noted: Before every article headline on the right, there is cursor stop point

where the screen reader announces the same article heading with each word in the heading separated by a dash. This confuses the users. See the cursor located just above the line “Stay on top of your finances with a line of credit” in the screen shot below.

• Remediation: Labelling and instructions should primarily aim at providing users clear

understanding about the context so that users can effectively make use of every screen element.

Non-compliance issues• Accessibility Check point: Accessibility through Keyboard• Issue Noted: Under locate a branch near you, it is not possible to select the check-

boxes near "Open Saturdays", "Open late evenings" with keyboard. On entering after placing the tab over any of the checkbox, the search result page loads. However, it should be possible to run a search after selecting both the check boxes.

• Remediation: User should be allowed to access all the relevant screen elements through keyboard.

Non-compliance issues• Accessibility Check point: Accessibility through Keyboard• Issue Noted: Manage your card functionality cannot be accessed by tab• Remediation: User should be allowed to access all the relevant screen elements

through keyboard.

Non-compliance issues• Accessibility Check point: Accessibility through Keyboard• Issue Noted: Article carousal cannot be easily accessed by tab or by screen reader in

auto mode. The timing of the carousal and the screen reader announcements do not match.

• Remediation: User should be allowed to access all the relevant screen elements through keyboard.

Thank you