Banks must consider their approach to web accessibility—the inclusive practice of ensuring that no barriers prevent users from interacting with content—as a key component of making their digital experiences available to all potential and existing customers. In honor of Global Accessibility Awareness Day, Corporate Insight will share a three-part blog series outlining select accessibility-focused best practices we have identified from banks in the following areas: publicly available assistance information, end-user experience operability, and pathways for requesting accessible card and statement formats.
The four guiding principles of accessible web design ensure content is perceivable, operable, understandable and robust. The Worldwide Web Consortium’s Web Content Accessibility Guidelines (WCAG) are built upon these principles and outline ways to create operable experiences for users who employ assistive technology or approach sites without using a mouse. For example, 60% of screen reader users surveyed by WebAIM in 2018 noted that they always or often navigate sites using the keyboard instead of a mouse. While many banks have already ensured their websites adhere to the WCAG’s web accessibility guidelines, they should consider the following best practices for providing inclusive interactive elements.
Enable thorough keyboard-only navigation
Users with certain disabilities related to motor function as well as screen reader users may have difficulty using a mouse to navigate websites, so keyboard-friendly sites are essential to enabling interactions. Three elements distinguish keyboard-only navigation experiences that are more accessible: clear visual indicators of keyboard focus, full functionality throughout the site and the ability to skip navigation and jump to the main page content. Most bank sites provide one or more of these elements, but few supply all three across all site sections and elements. KeyBank and U.S. Bank are two firms that stand out for offering robustly operable and perceivable keyboard navigation experiences across their public sites, serving as good examples of this web accessibility standard for banks.
Clear visual indicators across browsers represent an area where banks can make quick and easy improvements. For example, subtle shading or faint dotted lines that are difficult to see or do not sufficiently contrast with the background can be replaced by thick border lines. PNC does well here by dynamically adjusting the border line color based on the background to ensure consistent color contrast, while KeyBank uses a bold light blue that stands out against all its background colors.
The most frequent gaps emerge when making tools and other interactive elements fully operable via keyboard. Thoughtfully incorporating keyboard navigation into branch locators, application forms and search interfaces better supports users in engaging with interactive site elements. For example, U.S. Bank’s locator tool—including the search field, filter checkboxes and expandable filter sections—is fully operable via keyboard with clear indicators of focus. The embedded map further aids users navigating via keyboard with the inclusion of a keyboard shortcuts summary.
Keyboard navigation is always sequential, so an option to skip over repeating navigation structures and move straight to the main page content can help users avoid the painstaking experience of tabbing through every main navigation link. This is even more burdensome for users who use a keyboard in combination with a screen reader. Most large banks do well here by providing functional skip links across both their public and authenticated sites; behind the login, Chase also offers a second link to skip over messages that the firm embeds in the header.
Equip multimedia with full display and operational controls
When relying on multimedia to communicate information, firms should ensure that the format is usable by all site visitors. This includes users who cannot readily hear audio, see video or physically navigate interactive tools. Additionally, assistive technology such as screen readers may not easily process animated content—such as GIFs or carousels—so firms should provide methods to start, stop, pause or bypass this type of content.
Videos are one of the most common forms of multimedia found on banking sites, especially for instructional and promotional purposes. Many firms provide audio, transcripts and closed captions for videos, which enables users with different needs and preferences to review the content. Banks should also consider several best practices to make video content inclusive:
- Santander incorporates screenshots into video transcript PDFs, providing an additional type of visual aid
- Firms such as Bank of America, Fifth Third and USAA helpfully offer caption settings, which enable users to enlarge or change fonts
- Truist embeds a caption search function into its tutorials, allowing users to jump directly to any point where a keyword appears in the video
- In addition to providing the standard play/pause controls, Citizens Bank lets users adjust playback speed
Firms should limit use of carousels to communicate information. Automatically scrolling content can be difficult for users who need more time to read, become prohibitively distracted, experience neurological responses, or navigate sites with a keyboard or screen reader. Of 10 public sites in the Bank Monitor coverage set that employ carousels, six—including Bank of America, Chase and Discover—do well by keeping carousel content static until users initiate scrolling, while the remaining four provide carousels with content that scrolls automatically, and none of these provide a clear pause button.
Several firms now offer demo tools that guide users through common tasks such as downloading the mobile app or replacing a debit card—another clear best practice for web accessibility for banks. Interactive demos that provide clickable device images along with text instructions invite users to engage with content at their own pace, including repeating steps. All these tools direct users’ focus with a colorful frame or pulsing animation. Most firms also helpfully list the total number of steps in a process, summarize the content in each step and/or provide a transcript of all instructional content.
- Bank of America, U.S. Bank and Wells Fargo enable users to turn off the potentially distracting animations
- TD Bank enables navigation to any step in a process, while many other firms limit users to moving back through steps they have already clicked through
- U.S. Bank uniquely offers both English and Spanish versions of instructions that accompany its demos, though the demos themselves only display the English version of its banking platforms
In general, interactive elements—such as menus, tools, forms, and multimedia—may require closer attention than static page content when assessing web accessibility for banks. Ensuring that all users are met with a fully operable experience is no easy feat, considering the multitude of diverse user needs makes it difficult to create or implement a single, established web accessibility model. However, the best practices and innovative features listed above highlight ways that many banks are thoughtfully implementing supportive features.