Modern Campus, CSUB's Web Content Management System (WCMS), is an application for creating, storing, managing and publishing web content. It allows web editors to not only create web content in a WYSIWYG editor, but also create accessible content with its built-in accessibility features that comply with CSU Remediation WCAG 2.1 AA.

Built-in Accessibility Features

Accessible Headings

• Modern Campus provides accessible heading styles (Heading 1, Heading 2, Heading 3...) to help create a semantic structure for web content. The text you put in the Page Heading field will be your Heading 1 for the page.
• Do not create your own Heading 1 in the main content region. This will duplicate the Heading 1.
• After Heading 1, select Heading 2 to Heading 6 to build up the semantic structure of the content. Webpages should be structured in a hierarchical manner (H1 to H6) without skipping heading levels.
• Do not use text formatting, such as font size or bold, to give the visual appearance of headings — use the actual heading.

Here is an example of how headings should be structured in a continuous hierarchy. This is correct semantic structure:

• Heading 1 (used once, generally containing the page's title)
  • Heading 2
  • Heading 2
    • Heading 3
    • Heading 3
      • Heading 4
    • Heading 3

Alternative Text for Non-Text Elements

• Upload images to Modern Campus
• Add the image to a page
• Under Alternative Description, insert a brief description of the image
• Validate that the alt text does not contain the text: .jpg, .jpeg, .png, .gif, or any other file extension
• Validate that the alt text does not use the word "image"
• Validate that the alt text is greater than 6 and less than 81 characters in length for best practice

Accessible Table

All tables require a caption and header row, and cells cannot be left empty. Tables are only to be used to represent data and should not be used for layout.

To insert a table caption, right-click on the table. Go to Table Properties and check the box for 'show caption.' Hit Save. A new field will appear at the top of the table to insert your caption.

There are two parts to creating a header row:

1. Highlight the row. Right-click and go to Cell, then Cell Properties. For Cell Type, change it from Cell to Header Cell. For Scope, change it to Column.
2. While the row is still highlighted, right-click again. Go to Row, then Row Properties. For Row Type, change it from Body to Header.

Other tips for making an accessible table include:

• Split a large, complex and complicated table into smaller, simpler tables
• Do not use headings in a table

Link Text

• Incorrect link text: If you want to learn more information about CSU Bakersfield, click here.
• Correct link text: Find more information about CSU Bakersfield.

Avoid using non-descriptive link text, such as click here, read more, learn more, etc.

Avoid using two or more links to different resources with the same text.

• Same text link must go to the same destination
• Different text link must go to the different destination

Flashing, Animation Elements, etc.

Avoid using any flashing, animation elements, etc.

• These elements are very difficult for people with a visual impairment
• These elements are also a barrier for people with a mobility disability

Multimedia (Video, Audio)

• Provide captions for video on the web
• Provide transcripts for audio on the web

Bulleted Lists and Numbered Lists

Use bulleted lists or numbered lists to display a list of items.

• Item 1
• Item 2
  • Item 2a
  • Item 2b
• Item 3

Color and Contrast

• Do not use color alone to convey information. Use a secondary method to convey the information, such as text.
• Ensure colors have sufficient contrast between background and foreground. CSU Bakersfield requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. 
• Visit the WebAIM color contrast checker to test your color contrast.

Links and Spelling Check

• When you publish a page, under the Final Check section of the Publish pop-up window, check for broken links and/or spelling by clicking the circle icon after each item.
• After clicking the icon for Links, the page will be scanned for broken links. Once it is done, the link check results are displayed (issues or warnings). Replace any broken links with the correct ones. If you verify the link is a false positive, you can click the Make Exception button to mark it as an exception.
• After clicking the icon for Spelling, the page will be scanned for misspelled words. Once it is done, the spell check results are displayed. You can review each word and either correct them or add them to the dictionary.