Skip Navigation

Navigation

Skip Side Navigation

Navigation

Consistency is key to usability of a website. As visitors jump from site to site within the OU domain, they should have some expectation of consistency in layout and functionality. For this reason, all OU web pages must include the following:

  • Global Navigation Bar.
  • Approved department/college logo or wordmark in the upper quadrant linking back to the department/college homepage.
  • Interlocking OU logo and OU wordmark (typically appears with the approved department/college logo).
  • Global Footer.
  • Unless otherwise noted, left page navigation.

Global Navigation Bar

  • All OU websites must include the global navigation bar.
  • The global navigation bar provides users an easy way to get to navigate selected  pages of the OU Website.
  • Any alterations to the Global Navigation bar must be approved by Web Communications.

Installation Instructions for Global Navigation Bar

Step One

Download the zip file containing the OU global header and install it in your parent directory.

Step Two

Place the code snippet below on the line directly BELOW the opening <body> tag.

<div class="globalheader">
    <div class="globalheader-wrapper">
        <ul>
            <li><a class="tip home" href="http://www.ou.edu/web.html" alt="OU Home link"><span>OU Homepage</span></a></li>
            <li><a class="tip search" href="http://www.ou.edu/content/ousearch.html" alt="OU Search link"><span>Search OU</span></a></li>
            <li><a class="tip social" href="http://www.ou.edu/web/socialmediadirectory.html" alt="OU Social Media link"><span>OU Social Media</span></a></li>
            <li class="wordmark">The University of Oklahoma</li>
        </ul>
        <div style="clear:both;"></div>
     </div>
</div>

Step Three

Place the code snippet below on the line directly ABOVE the closing </head> tag.

<link rel="stylesheet" type="text/css" media="all" href="gloabalheader.css" />
<style type="text/css">.globalheader-wrapper { width:980px; }</style>

Step Four

The default width of the header is 980px. If your site's width is something other than that, edit the line below in your header section.

<style type="text/css">.globalheader-wrapper { width:980px; }</style>

Global OU Footer

The following information is required in the footer:

  • Last updated date with address, phone number and email address for the department.
  • Links to the accessibility, sustainability, HIPPA, OU job search, policies, legal notices, copyrights.
  • Optional: links to department social media accounts
  • Format and design should follow the design seen below (example: ou.edu/admissions)

Approval Process

All new sites and sites involved in a redesign must be reviewed by OU Marketing and Communications (source.ou.edu)