All sites managed by or representing a Berkeley entity must be hosted on a platform capable of creating accessible content, and all content hosted on these sites must meet the WCAG 2.1 AA content requirements.
While this toolkit provides a general overview of accessibility requirements for any website managed by or representing any Rausser College entity, it is primarily written for users of the Open Berkeley platform.
What is Open Berkeley?
Open Berkeley is a turnkey, Drupal-based content management platform run by Web Platform Services for campus users. It is designed to be accessible and to make it easy for content editors to create accessible content. Currently, the College and its five core academic units (ARE, ESPM, ERG, MBN, and PMB) have websites built with Open Berkeley.
Rausser College units that do not currently have a website are eligible to sign up for Berkeley Web Builder, the successor platform, as an early adopter. Existing Open Berkeley sites will be migrated to the new platform later this year.
Who is Responsible?
Digital Accessibility is a shared responsibility at Rausser College, which means every unit and staff member plays an important role.
-
Units are responsible for selecting an accessible web platform, ensuring staff are trained on the requirements, and regularly auditing their sites for potential issues.
-
Staff who manage, develop, or edit web content should ensure the content they author complies with digital accessibility requirements.
What should I do?
Because most accessibility work on an Open Berkeley site is content work, please keep the following in mind when building a web page, news story, or other content.
Use the Format dropdown for headings
Headings are how screen-reader users skim a page, so it’s important that you use them correctly. In Open Berkeley, the title you enter when creating a page or news story automatically becomes the Heading 1 (H1). Content added to the page (via the “Edit” or “Customize” features) should start with Heading 2 (H2).
When using headings, it is important to keep two things in mind:
-
Do not skip levels. Jumping from H1 directly to H3, or from H2 to H4, is an accessibility issue and causes problems for screen reader users.
-
Do not use headings for visual style. These should never be used to make a paragraph look bigger or bolder for aesthetic reasons.
Add alt text to all image uploads
All images posted to a Rausser College website should have alt text. This is especially important if an image provides important context or information.
In Open Berkeley, images can be added in two ways:
-
Using the “Add Media” button on the WYSWIG toolbar when editing a Content Page or text box; or,
-
Via the “Add an Image” widget when customizing a page.
In both instances, the alt text must be entered when the image is uploaded. The alt text should be descriptive enough that people using a screen reader can understand its content.
Updating alt text
If you forget to add alt text when adding an image or need to edit the alt text after uploading a photo, you can do so in the Files dashboard of the Admin menu. Click Edit next to the file.
Important: This method only works for images inserted using an Open Berkeley widget. Changes to an image’s alt text will not be carried over to images inserted using the WYSIWYG editor. In that case, you are required to make manual changes to the HTML code for that page.
Use Link to Content for internal links, not pasted URLs
Make link text unique and descriptive, ideally five words or fewer. Avoid “click here,” “read more,” and bare URLs.
Do not use the same link text for two destinations on the same page.
For attachment links, identify the file type in the link text: Annual Report 2025 (PDF), not just Annual Report 2025.
Use the list buttons
Bulleted and numbered lists carry structural meaning that screen readers announce. Always create them with the bullet or numbered list buttons in the WYSIWYG.
When making a list:
-
Press Enter for a new list item.
-
Press Shift+Enter for a line break inside an item.
-
Use the indent/outdent buttons in the expanded toolbar to nest.
Use a numbered list only when sequence or rank actually matters. Use a bulleted list for unordered items. Like headings, lists should never be used for formatting.
Build tables according to accessibility guidelines
Accessible data tables are structured to allow screen reader users to navigate your content and understand what you are presenting. If you do not properly structure your table for accessibility, the context of your material will be lost.
-
DAP has general guidelines about what makes a table accessible
-
Open Berkeley provides step-by-step instructions for building an accessible table.
Like headings, tables should be used only to present data, never for layout.
Make sure the files you upload are accessible
The requirements also apply to any Word, Spreadsheet, or PDF files uploaded to the website. Learn more about accessible document creation.
Resources and Training
Resources
-
Digital Accessibility Program (DAP) is the campus unit overseeing digital accessibility.
-
DAP’s Web Accessibility Basics provides in-depth information on headings, images, links, and more.
-
The Open Berkeley Web Accessibility page has specific information regarding various Open Berkeley widgets, functions, and best practices for accessibility
-
All Berkeley.edu websites should be listed in Siteimprove, a tool that helps users and web managers check for WCAG 2.1 AA compliance.
-
Manual testing is required to find and correct issues that SiteImprove cannot find. DAP offers tips for manual accessibility testing
-
Request an accessibility review of your site by DAP.
Training
-
Open Berkeley hosts recurring training and office hours for staff who would like to learn more about the platform or need a refresher.
-
DAP hosts regular office hours and trainings focused on specific topics.
-
Learn how to create accessible tables in this online course offered by UC Berkeley