Overview
Libraries and universities can customize the Vega Discover UI to tailor it to their institutional and user needs. The purpose of this article is to provide recommendations on common accessibility considerations that should be maintained during customization.
The Vega Discover UI includes accessibility features in its standard user interface. Refer to the Vega Discover Accessibility Statement for more information on accessibility features and gaps in the Vega UI. Libraries that choose to customize the Vega Discover interface must take some steps during customization to ensure accessibility is maintained.
These recommendations will continue to be developed and refined with additional examples and best practices. If you have recommendations for material to include, send an email to accessibility@clarivate.com.
Accessibility responsibilities during library customization
When customizing the Vega Discover UI, libraries should validate that:
-
Content and functionality remain keyboard accessible.
-
Color and contrast continue to meet accessibility requirements.
-
Images include appropriate alternative text when they convey information.
-
Custom widgets and embedded content work with assistive technology.
-
Interactive components (buttons, links, forms, and menus) expose meaningful names, roles, states, and properties to screen readers.
-
Focus indicators remain visible and predictable and maintain a minimum 3:1 contrast ratio.
-
Focus should move in a logical order that follows the visual reading sequence.
-
Libraries should test their customized UI to verify accessibility after customizations are applied.
Branding, themes, and visual styling
Review changes to brand colors, typography, button styles, and promotional areas against the following accessibility criteria, especially when text appears over images, gradients, or custom backgrounds.
-
Use sufficient contrast for text, icons, and user interface components.
-
Normal Text should maintain a minimum contrast ratio of 4.5:1 against its background.
-
Large Text (18pt / 24px regular or 14 pt/ 18.66px bold and larger) should maintain a minimum contrast ratio of 3:1.
-
User interface components, icons, focus indicators, and graphical elements that convey meaning should maintain a minimum contrast ratio of 3:1 against adjacent colors.
-
-
Do not rely on color alone to communicate status, availability, errors, or required actions.
-
Verify hover, focus, selected, and disabled states against customized background colors.
-
Maintain visible, consistent focus styling for links, buttons, menus, and form controls.
-
Check that custom typography remains readable when users increase browser zoom up to 200%.
Homepage and promotional content
Custom homepage content
Many libraries may customize the Vega Discover homepage with promotional content, featured collections, announcements, or links. These areas should support clear structure and predictable navigation.
-
Use descriptive headings, maintaining a logical heading hierarchy that communicates page structure.
-
Use meaningful link text that clearly describes the destination or action.
-
Avoid images of text whenever possible.
-
Ensure that every library added or modified interactive element can be reached and activated using only a keyboard.
-
Confirm content remains readable and functional at 200% zoom and with increased text size.
Banners and promotional panels
-
Provide meaningful alternative text when an image conveys information.
-
Use empty alt text for purely decorative images.
-
Maintain sufficient contrast (4.5:1 for normal text and 3:1 for large text) for text placed over images or gradients.
-
Test layouts on desktop, tablet, and mobile screen sizes.
-
Avoid embedding critical information in images when equivalent text can be provided.
Logos, images, and media
Library logos
If your custom header uses the library logo as a link to the Vega Discover Home page or your library home page, provide appropriate information about the purpose and function of this link/button.
Additional images and media
-
For informational images your library inserts into custom headers and footers, provide text alternatives that communicate the purpose of the image.
-
For video or audio content added through custom areas, provide captions, transcripts, or other media alternatives when applicable.
Vega Guide, announcements, and user guidance
Vega Guide content, announcements, surveys, polls, or tours the library should follow these accessibility principles:
-
Keep language concise and task-oriented.
-
Avoid automatic focus movement unless it is necessary and expected.
-
Ensure announcements do not block navigation or trap keyboard focus.
-
Make dismiss buttons and controls accessible by keyboard and screen reader.
-
Ensure modal dialogs announce themselves properly to screen readers.
-
Verify keyboard users can dismiss pop-ups using escape when appropriate.
-
Confirm that focus returns to a logical location after a tour, guide, or modal is dismissed.
-
Confirm surveys and forms have visible labels, clear instructions, and meaningful error messages.
If your library has accessibility concerns with standard Vega Discover guides, reach out to Customer Support for assistance.
Showcases and featured collections
Showcases and featured collections help patrons explore library materials without introducing navigation or readability barriers. Many accessibility features of showcases and other featured collections are maintained by Clarivate. When creating showcases and featured collections keep the following in mind:
-
Use clear headings and group labels.
-
Avoid relying on cover art to identify content.
Embedded third-party content
Libraries may embed third-party content such as calendars, chat widgets, surveys, forms, digital content providers, or event tools. Third-party content should be reviewed before it is enabled in a patron-facing experience.
-
Review the vendor’s accessibility documentation or conformance report where available.
-
Test keyboard navigation through the embedded component and back to the main page.
-
Verify screen reader output for labels, instructions, controls, and error messages.
-
Check color contrast and zoom behavior at 200% browser zoom.
-
Confirm embedded content remains usable on mobile devices.
-
Report any issues to the third-party content provider.
Troubleshooting accessibility issues
When an accessibility issue is identified, first determine whether the issue originates from Vega Discover, local customization, or embedded third-party content.
-
Replicate the issue with customizations enabled.
-
Temporarily remove or disable local customizations to isolate the source. Documentation here.
-
Document the browser, operating system, assistive technology, steps to reproduce, actual result, and expected result.
-
Test the corrected customization in a non-production environment before deployment.
-
If the issue appears to originate from Vega Discover, submit a support case with reproduction steps and supporting evidence.
Recommended accessibility references and testing resources
We suggest reviewing some of the following sources when evaluating local Vega Discover customizations. These links are included as practical references, not as an exhaustive conformance checklist.
W3C Web Content Accessibility Guidelines (WCAG) 2.2
W3C Understanding SC 1.4.3: Contrast (Minimum)
W3C Understanding SC 1.4.11: Non-text Contrast
