Web

Websites

New and Redesigned Sites

Prior to launch, all new and redesigned official university websites must be reviewed by:

It is recommended you consult with the University Communications and Marketing office when starting to plan a new site.


Web Guidelines

Information on creating content for the main CSUDH website can be found on the web services page.


Web Accessibility

All official university websites are required to comply with accessibility laws and CSU policy. Any exceptions must be approved by the University Web Manager.

The CSU is committed to ensuring accessibility of its websites, web content, and web applications for people with disabilities. Additional information and resources can be found at the CSU Chancellor’s Office Accessible Technology Initiative (ATI) page.


Typography

Proxima Nova

Use of this font on the university main website will be available through preset style guides.

Heading one

Heading two

Heading three

Body Bold

Body

Open Sans

Use of Open Sans is acceptable on websites not created in the CM1 content management system that require the use of a non-licensed web font.


Web Colors

There must be sufficient contrast between the background and text color to comply with Section 508 guidelines. Ensure that colors pass the WCAG AAA standard by using this color contast checking tool. This is also applicable to text written over image files. 

  • Do not use yellow text on a white background or vice versa
  • Do not use the cyan color for small text

CSUDH Branding Color Burgundy

HEX #860038

CSUDH Branding Color Yellow

HEX #EFBA08

CSUDH Branding Color Navy

HEX #00416D

CSUDH Branding Color Cyan

HEX #009DBB

CSUDH Branding Color Black

HEX #000000

CSUDH Branding Color White

HEX #FFFFFF

Content section layout

The University uses Flexbox Grid system to lay out elements in the content section.

col-xs-12: on extra small screens (xs) set width to 12 columns

col-sm-8: on small screens (sm) set width to 8 columns

col-md-6: on medium screens (md) set width to 6 columns

col-lg-4: on large screens (lg) set width to 4 columns

Usage

<div class="row">
    <div class="col-xs-12 col-sm-8 col-md-6 col-lg-4">
        <div>Content goes here</div>
    </div>
</div>

Web Elements

Accordion

Accordion content