Going Mobile? How to Ensure Accessibility

In today’s race for talent, more and more employers and human resources (HR) professionals are turning to mobile apps to power their online job applications. In fact, the Society for Human Resource Management reports a 70% increase in 2016 over the last three years in organizations investing in mobile-enabled technologies for HR. Why? Because mobile is the key to reaching more talented candidates quickly.

According to a 2015 study by Pew Research:

94% of job seekers have looked for and researched jobs online using their mobile device.
50% of job seekers have filled out online job applications using their smartphones.
23% of job seekers have used their smartphone to create a resume or craft a cover letter.

So it’s more important than ever to meet job seekers where they are by offering easier, faster ways for them to search for and apply for jobs on any device. As CIO.com’s Sarah K. White puts it, “More job seekers are turning to mobile devices to find and apply for positions, but your job postings might get overlooked if they aren’t optimized for smartphones.”

Mobile is the key to reaching more talented candidates quickly. There’s another important reason to optimize your eRecruiting apps for mobile: It can widen your talent pool, particularly as it relates to job seekers with disabilities.

Providing mobile access to your eRecruiting website, or creating an app version of your eRecruiting tools, can help you reach a younger generation of job candidates, and reduce the time it takes to recruit a candidate and convert them to a new hire. Recruiters and marketers can even target candidates by sending specific job leads to specific individuals’ phones, based on their fields of interest.

But there’s another important reason to optimize your eRecruiting apps for mobile: It can widen your talent pool, particularly as it relates to job seekers with disabilities.

You see, many people with disabilities own, and prefer to use, mobile devices due to their convenience and built-in accessibility features. But unfortunately, online job applications are not always optimized for mobile access, or built accessibly. In fact, PEAT’s national survey of people with disabilities found that while 56% have searched for jobs on a mobile device, only 28% applied for a job this way—likely because web-based applications are not designed for optimal viewing or interaction on a mobile device. As a result, users with disabilities often encounter website display issues and cannot complete form fields or upload resumes using a mobile device.

This fact sheet features tips and exemplary practices that HR professionals can share with the technology designers and developers who are building their mobile eRecruiting apps. PEAT developed it in collaboration with Perkins Solutions, which provides innovative accessibility consulting services.

Mobile Accessibility Considerations

When it comes to the web, people with disabilities tend to face the same accessibility issues whether they’re using a desktop computer or a mobile device. So there is significant overlap between design solutions for both.

Reminders for HR Professionals

When developing or enhancing mobile applications to power your recruiting efforts, be sure to keep the following best practices in mind, and work with your IT development team to incorporate them:

Present information in multiple ways rather than by color, shape, size, or position alone.
Present a list of materials needed to complete the job application process at the beginning of your site or app so that users can prepare.
Number the steps for completing the application/tasks.
Ensure that users can save their work and return to where they left off.
Allow users to skip steps and preview the entire application at will.
Provide a simple navigation system that allows users to seamlessly move from viewing a job announcement to applying for it (i.e., a direct link).
Avoid generic link text (e.g., “click here”) which can confuse those using a screen reader to access your app.
Present a confirmation screen at the end of the application process that communicates what job was applied for, what files were uploaded, and when to expect a response from the employer.
Provide a link that allows users to return to the main screen to search for/apply for more jobs.
Offer a mechanism by which job postings can be saved so that the user can apply for them later and not have to relocate them. (Many people use their mobile phone to locate jobs of interest and then use their desktops to complete the application process, so allowing for a fluid connection between both steps is helpful.)
Allow users to download the job description so that they can view it on another device if needed.
Consider a built-in remote help desk feature for troubleshooting problems.

Reminders for Technology Developers

Here’s where it gets more technical. In addition to the points above, there are numerous best practices that web designers and technology developers should follow when creating and programming mobile eRecruiting tools.

Responsive Web Design

According to Jonathan Avila of SSB Bart Group, one key way to ensure that an application is optimized for mobile is to practice responsive web design (RWD), “an approach aimed at delivering flexible web page layouts to provide optimal viewing across a wide range of devices. RWD allows for easy reading and navigation on a variety of different-sized devices—from oversized desktop monitors to mobile phone screens—with a minimal amount of resizing and scrolling.”

Avila points out four key components at the heart of responsive web design, all of which can have an impact on accessibility:

Media queries and media query listeners help a device decide how to view the website depending on screen size. Adapting your site to the device size will help users who require magnification and reduce the amount of zooming required. Additionally, customizing the amount of content on the site based on the device width will ensure a more focused view of the content for users with cognitive disabilities.
Fluid design and flexible grid-based layouts promote the reflow of content when it is resized and helps to ensure a correct reading order. These practices tend to render content in the order it appears within the document object model (DOM), which is the same order that screen readers render content to users with visual impairments. So fluid design is a key accessibility practice.
Flexible images and media, through dynamic resizing or CSS (a style language that defines the layout of HTML documents), allow images to resize to the area that is available to them. This allows images to take up more room if it’s available and to not overlap other content if less room is available.
Establishing the viewport is important, but unfortunately, many RWD sites restrict whether the viewport can be changed by the user and may limit the scale level. The Web Content Accessibility Guidelines (WCAG)¹ require that sites be scalable without assistive technology up to 200%. This means that in the case of the mobile browser, the browser’s pinch zoom feature must allow for zooming up to 200% without using the assistive technology zoom on the mobile device.

For more on these and other accessible RWD practices, read Avila’s article, “What Does Responsive Web Design Have to do with Accessibility?”

Other responsive design leading practices include the following:

App Structure and Labeling

To ensure your website and/or app content can be read correctly, your design and development team should consider the following:
- Code the app/site content so that it will read correctly with the built in accessibility VoiceOver feature on the iPhone and Talkback on the Android.
- Ensure that all of the app’s content collapses to one column, and that the collapsed content does not have overlapping text or background images.
- Use a clear, linear heading-level structure (i.e., the title should be an H1 font).
- Label all form fields.
- Tag all images with alt-text (unless decorative).

Visual Design

To ensure that your visual design supports the accessibility of your mobile tools, your design and development team should consider the following:
- Ensure all font-background combinations have at least a 4.5:1 color luminosity difference/ratio.
- Avoid similar color families, such as red text on a pink background; but, if present, aim for at least a 7:1 luminosity difference.
- Incorporate radio buttons and checkboxes in favor of more complex things, such as pop-up windows with grayed-out text behind them.
- Make sure any error messages generated are clear to the user.

Workflow & Functionality

Present job-announcement content in a consistent manner (and leverage consistent headings).
Use gesture functions (i.e., non-keyboard/mouse input commands) that mirror other similar or common programs and provide a help menu that explains any customized gesturing.
Ensure that when the user selects items (such as a checkbox or a radio button), the items do not initiate a change in the content. Instead, provide a confirm/okay button that will institute the change.
Install a search function complete with common search terms and FAQs.
Limit the length of search results to prevent infinite scrolling; consider structuring the content to be only a few “swipes” long and then have a link to another page if the content is continued.
Use “breadcrumbs” (graphic elements that allow users to keep track of their locations within programs, documents or websites) to make it clear where a user is in the larger scheme of things.
Offer different ways in which job search results can be rendered (by location, by title, by salary) so that users can get to the most relevant choice as quickly as possible.
Alert users if certain features/links are opening in a new browser window or application screen.

Learn More:

Footnotes

“Resize Text: Understanding SC 1.4.4,” World Wide Web Consortium; https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-scale.html

Download PDF Version