[ skip to content ]

Web Style Guide & Best Practices"P" Topics

Page Layouts

Most pages should follow one of the following layout pageframes:

Main Layout - Type 1Main Layout - Type 1
Main Layout - AlternateMain Layout - Alternate
Main Layout - Type 2Main Layout - Type 2

(left) This layout should only be used in rare circumstances, where the main three cannot be used.


(right) This layout choice should only be used for hub-style pages where the only purpose is to direct the user to other parts of the site.

Main Layout - Type 3Main Layout - Type 3
Major Router LayoutMajor Router Layout

  • Flexibility and creativity in displaying your content are encouraged, but within the context of providing consistency in user experience.
  • When laying out a new page or changing the layout of an existing page, look to pages that were created by the University Web Team for acceptable layouts.
  • New York University's website (www.nyu.edu) is a good example of being flexible yet consistent.
  • When in doubt, ask the University Web Communications (webcomm@odu.edu).

Page Length

  • Avoid long, scrolling pages. Exceptions are for policies and handbooks.
  • Be concise in verbiage.
  • Break up large blocks of text by:
    • Employing the Heading component and anchors.
    • Using the Tabs component to organize large quantities of information.
    • Requesting separate pages for each major section of content.
  • Your page should be easily skimmable so users can quickly find the content they're seeking.

Page Themes/Colors

Page themes for the major sections of the site are defined in triads, with the primary section theme and then two supporting themes (see table below). Other page theme sets are academic college and vice presidential area. Page themes are set by section and may not be changed without permission from University Web & Electronic Communications.

Page theme triads by site section

themes-color-triads-table

Page theme by academic college

Arts & Letters Red (3)
Business & Public Administration Steel (7)
Continuing Education & Professional Development
Blue (1)
Education Purple (8)
Engineering & Technology Orange (4)
Health Sciences Green (6)
Sciences Yellow (5)

Page theme by VP area

President's Office Blue (1)
Academic Affairs Red (3)
Administration & Finance Orange (4)
Human Resources Steel (7)
Office of Research Purple (8)
SEES Green (6)
University Advancement Yellow (5)


Password Protection

MIDAS Protection/Authentication redirects here
  • The ODU website is for public and open information about the University
  • The WCMS does not have any support for password protecting pages or assets (through MIDAS or other authentication

Digital Assets

There is a limited mechanism for placing digital assets behind MIDAS protection. This mechanism will only be used in cases where there is a need for wide distribution of information that must be limited to the campus community.

  • Only digital assets may be placed behind MIDAS protection - the mechanism does not accommodate pages
  • Updating and adding of assets must be done through a WebComm liaison - the online forms in the CQ toolkit may not be used
  • There are two options for MIDAS authentication:
    • All - Any person with a MIDAS account can access the content. This will include students, ODURF, Aramark, Global Spectrum and other affiliated employees.
    • Faculty & Staff - Only those with a faculty & staff role in MIDAS will be able to access the assets. This will exclude students, ODURF, Aramark, Global Spectrum and other affiliated employees.
  • Content managers are responsible for adding the links to their pages in the WCMS once the assets are loaded into the secured space
  • Links to the assets will not carry the medium-identification icons like the assets in the digital asset manager carry