Web Site Style, Coding and Accessibility Requirements
for academic schools, colleges, departments, faculty, programs, and initiatives
Style
Below are the style requirements for academic schools, colleges, departments, programs and initiatives; administrative divisions and departments; university-wide initiatives; and community partnerships and research collaborations which choose not to use the official U of L templates and where University of Louisville is the primary underwriter. If you have any questions concerning whether or not your Web project is covered under these requirements, please contact Neil Gibbs at 852-6171 or by e-mail.
University header
The University’s main header, which includes the logo, search and global navigation items, must appear at the top of pages with no margins or padding from the edge of the browser window.
If your site will be hosted on the athena or vhost servers, you can use the following code to include the header:
<!--#include virtual=”/_resources/includes/header2.html”--->
Additionally, you must link to the university’s style sheet in order for the header to display properly. Below is the code to do so:
<link rel=”stylesheet” type=”text/css” href=”/_resources/css/main.css” media=”screen” />
If your site will be hosted on other servers, you can request a copy of the header code and all dependent files from Neil Gibbs at (502) 852-6171 or by e-mail.
University footer
The University’s main footer, which includes the contact information, search and global navigation items, must appear at the bottom of pages with no margins or padding from the edge of the browser window.
If your site will be hosted on athena or vhost, you can use the following code to include the header:
<!--#include virtual=”/_resources/includes/footer.html”--->
Additionally, you must link to the university’s style sheet in order for the footer to display properly. Below is the code to do so:
<link rel=”stylesheet” type=”text/css” href=”/_resources/css/main.css” media=”screen” />
NOTE: If you have already included the above code to work with the header, then you do not have to add this code again.
If your site will be hosted on other servers, you can request a copy of the header code and all dependent files from Neil Gibbs at (502) 852-6171 or by e-mail.
Background color for content areas
The background color for content areas is #f2f2f2 (off-white). Inclusion of the university’s main stylesheet (/_resources/css/main.css) will automatically make the background color #f2f2f2. If you would like to use a different background color for content areas, please keep the background color light and the text color dark (#333333).
Text color for content areas
The text color for content areas is #330000. Inclusion of the university’s main stylesheet (/_resources/css/main.css) will automatically make the text color #330000.
Font for body copy
The font for body copy is set up in the university’s main style sheet (/_resources/css/main.css) as the following:
”Lucida Grande”, “Lucida Sans Unicode”, Verdana, Helvetica, sans-serif;
Inclusion of the university’s main stylesheet will automatically set up the font for body copy properly.
Font for headings
The font for headings (<h1> through <h6>) is set up in the university’s main style sheet (/_resources/css/main.css) as the following:
Verdana, Arial, Helvetica, sans-serif;
Inclusion of the university’s main stylesheet will automatically set up the heading font properly.
Link colors for content area
The link colors for the content area of pages are as follows:
- Link: #CC0000
- Visited Link: #E16660;
- Hover: #CC0000
- Active: #CC0000
The CSS code below will define the link colors properly:
a:link {
color: #c00;
}
a:visited {
color: #e16660;
}
a:hover {
color: #c00;
text-decoration: none;
}
a:active {
color: #c00;
text-decoration: none;
}
Red/Black colors
The official Web color for the university red is #CC0000 and the official black is #333333.
Related links
- Standards based design overview (Maxdesign)
- CSS overview (The Site Wizard)
- Server-side Includes overview (George Dillon)
Coding
The university is using the XHTML 1.0 Transitional standard and document type (www.w3.org/TR/xhtml1/). In addition, all pages should validate using the World Wide Web Consortium’s (W3C) validation service (validator.w3.org/).
For most page layouts, please use CSS instead of the <table> tag for layout purposes. Use tables for structured data.
For more information or if you need assistance or training with creating XHTML Web pages, please contact Neil Gibbs at (502) 852-6171 or by e-mail.
Related links
- Standards based design overview (Maxdesign)
- CSS overview (The Site Wizard)
- XHTML vs. HTML (W3 Schools)
- Overview of differences between XHTML & HTML (Web Developer's Virtual Library)
Accessibility
University accessibility policy and Kentucky state law mandates that all new university Web designs and redesigns of current Web sites conform to Priority 1 of the W3C’s Web Content Accessibility Guidelines 1 .0 (www.w3.org/TR/WCAG10/). For more information or if you need assistance or training with creating accessible Web pages, please contact Neil Gibbs at (502) 852-6171 or by e-mail.
Related links
- Official U of L Web Accessibility Policy
- U of L Webmaster Accessibilty & Template Training & Certification program
- U of L Web Accessibility Team
- Resources