Accessibility Testing Case Study
The client is a one of the largest online employment website in the United States. Their Job site online application had over half a million hits per day. Client was looking for improvising on the Accessibility of the application.
Problem Statement
Job portal being a B2C application was targeted for a larger audience. Job portal allowed seeking and posting jobs for all industries across various job profiles. Analysis on their existing job seekers user base reviled that less than 7% of their user base consisted of physically disabled users, of which most of the profiles were left incomplete.
Some of the clients end customers on the Job posters side also had reported difficulties in using the application by their physically disabled team members. Accessibility and usability issues impacted productivity for two of the major job providers using this service and was a risk on customer retention.
Client wanted to increase their Job seekers and Job posters user base by making the application better accessible to people with disabilities while addressing general usability issues. They chose us as a partner based on their vendor evaluation and we supported them in addressing both these goals as two separate parallel running engagements.
Client wanted to increase their Job seekers and Job posters user base by making the application better accessible to people with disabilities while addressing general usability issues. They chose us as a partner based on their vendor evaluation and we supported them in addressing both these goals as two separate parallel running engagements.
Accessibility Testing Case Study
The client is a one of the largest online employment website in the United States. Their Job site online application had over half a million hits per day. Client was looking for improvising on the Accessibility of the application.
Problem Statement
Job portal being a B2C application was targeted for a larger audience. Job portal allowed seeking and posting jobs for all industries across various job profiles. Analysis on their existing job seekers user base reviled that less than 7% of their user base consisted of physically disabled users, of which most of the profiles were left incomplete.
Some of the clients end customers on the Job posters side also had reported difficulties in using the application by their physically disabled team members. Accessibility and usability issues impacted productivity for two of the major job providers using this service and was a risk on customer retention.
Client wanted to increase their Job seekers and Job posters user base by making the application better accessible to people with disabilities while addressing general usability issues. They chose us as a partner based on their vendor evaluation and we supported them in addressing both these goals as two separate parallel running engagements.
Client wanted to increase their Job seekers and Job posters user base by making the application better accessible to people with disabilities while addressing general usability issues. They chose us as a partner based on their vendor evaluation and we supported them in addressing both these goals as two separate parallel running engagements.
Solution
NetServ started the engagement with the Requirement Elicitation Phase. Some of the key information gathered and analysed to get to the root of the problem were:
- Stakeholder and End customer analysis
- Categorisation and sizing of the end customers based on the type of disabilities
- Functional walkthrough of the application
- Technical walkthrough of the overall application underling framework
- Technical walkthrough of the application Client layer
- Code walkthrough of the application Client layer
- List of tickets, emails and issues reported by the end users
Towards the end of the requirement elicitation phase a high level report was submitted highlighting the gaps in the client layer that will address the basic Accessibility issues.
Post the Requirement Elicitation Phase a comprehensive Test Plan document was submitted for signoff detailing the Scope of work, Solution approach, Resource requirements, Tools & technology selection, Timelines and Deliverables with the aim to achieve WCAG 2.0 Level AA standards.
NetServ with expertise appreciates that Accessibility testing is not limited to verifying implementation against requirements, it involves design suggestions, engineering recommendations and adherence to guidelines proposed.
We used a combination of automated with manual testing to ensure the goal is achieved.
- Evaluation through mix of automatic accessibility tools
NetServ understands that sticking on just one tool would not result in comprehensive testing. We extensively used AChecker, Wave and Chrome accessibility developer tools extension to do detailed testing ensuring better coverage with cross validation. - Manual Evaluation by test engineers
Tools can identify only 30% of the issues. Manual checks are required to validate Keyboard functionality for ease of navigation, validation of Forms labels etc. Testing the subjectivity of the applications simulating different combination of data was also achieved using manual testing. - Manual Evaluation by a team of specially abled members
NetServ has an Accessibility Test team comprising of specially-abled professionals who are trained on Accessibility testing. Testing of an application by people with specific disabilities helped unearth issues which cannot be caught by tools or by other test engineers.
Over 450 accessibility issues were identified and reported across job seekers and job posters applications. Some of the major accessibility improvements suggested can be categorized as below:
Problems Identified: Auto play animations including adds, events, promotions, premium jobs was causing issues for visually impaired users
Recommendations: Removal of auto play animations across the portal and suggested to use static images
Problems Identified: Pop-ups designed for confirmations and user alerts were displayed with a thin borders and were modeless in behaviour. This caused irritation due to overlapping text for visibly impaired users mostly due to thin border used and ability to click outside the pop-up.
Recommendations: Proposed model overlays with shadowed background for all such confirmatory questions with choices and user alerts across the application.
Problems Identified: Identified form fields/controls getting highlighted with green on getting focus and highlighted in red when the mandatory fields lost focus without having any data fed. This was challenging for visually impaired users to interpret or infer any action until submission of the form when they would be displayed with appropriate messages.
Recommendations: We suggested use of patterns instead of colours to highlight both these conditions. Form Fields/Controls getting focus was highlighted with a preceding pattern suggesting users that the field was highlighted. Mandatory fields losing focus was suggested to be filled with pattern to attract user’s attention.
Problems Identified: Pagination used for navigating through huge set of job listings for job seekers and profile listings for job posters was monolithic in nature and users with mortar impairment had trouble navigating through various pages in sequential manner.
Recommendations: Suggested to provide an edit box along the pagination bar, allowing users to enter a page number to navigate users to specific page of their choice.
Problems Identified: Pop-ups used across the application for both job posters and seekers to view candidate profiles and job details respectively. Pop-up caused disturbance in viewing for visually impaired users and also caused problems for users with mortar impairment. Pop-ups closed due to accidental clicks outside the real-estate of the details viewer pop-ups.
Recommendations: Replacement of all pop-ups with accordions across the application solved the issue.
Problems Identified: Identified use of small actionable Icons with appropriate images across the application. The size of these icons were inappropriate for users with mortar impairment. The images used on the icons were pretty unintuitive for visibly impaired users.
Recommendations: We suggested replacing those with bigger sized buttons along with supporting text suggesting the action description. We suggested use of SVG images with embedded text so that screen readers could read them when the icon/button gets focus.
Problem Identified: Since the time the application was designed and developed, some of the form fields used were not so disability friendly, having smaller actionable real-estate, like radio buttons and check boxes. This created resistance among users with mortar impairment during our testing.
Recommendations: We proposed use of bigger buttons with appropriate size and space, supporting suggestive images/icons along with supporting text for all such control with an idea to keep the form look simple and easy for all kinds of users.
Problems Identified: All controls, images and components across the application was tab ordered. However there was no clarity in terms of web component that had focus at any point of time. For form fields, we already had suggested use of patters, however this would be invalid for static contents with text and images. Although the screen readers would read out the content based on focus but users with visual issues had difficulty identifying what area of the static content is being read out.
Recommendations: We recommended use of dotted patter around the boundary of component that had current focus on all static content, to enable visually challenged users.
These are some of the additional recommendations we suggested for over-all improvement of the application from accessibility perspective. All of these suggestions are based on manual testing of applications for job seekers as well as job posters.
- Proper placement of controls and maintaining required distance between the control enabling ease of selection and operation.
- Form field to have appropriate label, title attribute and tool tips.
- Dynamic elements such as drop-down menus, tab pages etc. to be additionally accessible with ease using keyboard.
- Portal images and content are readable on zoom in and out. JPEG images to be converted into SVG images.
- Advanced controls like Tool Bars, Menus and Accordion controls to be additionally actionable using keyboards.
- Complete operation on the portal to be enabled using Keyboard shortcuts as they make site navigation for the visually as well as mortar impaired users much easier.
- Usage of ‘even’ word spacing for the visually impaired users.
- Recommended usage of bold fonts instead of italics within text content wherever appropriate.
- Recommended usage of a base font size across the application to avoid font sizes below the recommended base size.
- Avoid usage of just colours to indicate status and suggested use of appropriate supporting text wherever applicable.
- Line length ending to be in the range of 50-65 characters avoiding splitting words at the ends of lines which is helpful for the visually challenged individuals.
NetServ being a true partner to their customer extended the support beyond testing in addressing the reported issues using the expert team of UI/UX engineers. Portal was subjected to continuous regression test till the desired accessibility standards were met.
Benefits
Post the release of updated portal into production a constant analysis on its usage was performed which reported:
- Disabled Job seekers user base increased to 13% within 2 months of the release.
- Large amount of positive feedback on the portal usability from Job posters enabled higher customer retention.
- Clients’ operational cost was substantially reduced due to reduction in end user training and support hours.
- Faster profile posting, job posting and processing increased efficiency and resulted in growth of resume database which is the key asset for the client.
- Overall application hits increased to one million per day over eight month period of release.