APSU-Specific Style Guidelines
Background and Link Colors
- Text: #000000 (0,0,0) (Black)
- Background: #FFFFFF (255,255,255) (White)
- Link: #000000 (0,0,0) (Black)
- Visited Link: #000000 (0,0,0) (Black)
- Active Link: #000000 (0,0,0) (Black)
<body bgcolor="#ffffff" text="#000000"
link="#000000" vlink="#000000" alink="#000000">
Case Sensitivity
Use lowercase letters for filenames and in hypertext reference links. You will have fewer problems with
links if you stick with an all-lowercase format.
Colors
Austin Peay State University uses specific colors for pages maintained by the Web Team.
These colors most closely match the Pantone Matching System (PMS) colors used
in print publications and the APSU athletic logos.
Check pages in 256 colors and higher. Use a "Web
palette," when creating graphics. The Web palette contains the 216
colors that looks the same on Mac, Windows and UNIX platforms.
Common Information
Explore APSU Web pages for existing university information rather than developing
duplicate sets of data or graphic files. Check the Common
Pages list.
Contact Information
On the initial page of your site, include the department's mailing address,
e-mail address, telephone and fax number and office hours. On subsequent pages,
include an e-mail address of a full-time staff or faculty member. A phone number
is also helpful.
xxxx Department
Building Name and Number
Austin Peay State University
P. O. Box xxx
Clarksville, TN 37044
Telephone: (931) 221-xxxx
Fax: (931) 221-xxxx
E-mail: contact_person@apsu.edu
Copyright Information
Create a link to APSU's copyright information on the initial page of your Web site.
Creation
Page to Your Area - Limits
Departments, offices, and individuals should limit the
creation of pages to their area of responsibility. If information
needs to be publish on the Austin Peay Web, contact the respective
office responsible that area and request the information be posted.
-
Include the following code at the beginning of any HTML documents. The
declaration tells the browser which version of HTML is being used and the
language declaration identifies English as the language used on this page.
Identifying the language is an accessibility requirement.
<!DOCTYPE HTML
PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html lang="en">
-
Include the following META declaration in the head section of the HTML
document. The content type declaration tells the browser which character set
to use.
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
Filenames
-
Never use spaces in filenames; use an underscore instead.
-
Don't use special characters in filenames (e.g. ? " &)
-
Always use 'index.htm' as the filename for the initial page of a site.
Fonts
- The Austin Peay Web
site uses a .css (cascading style sheet) for all top
and side navigation bars. When using the .css,
do not modify the font sizes or colors within your HTML
document or FrontPages font drop down menu. The
font will automatically appear in the appropriate format.
- Fonts used
in the information portion of Web pages should be <font
face="arial,helvetica,sans serif" size="2">,
and no larger.
Graphics
-
alt
Always use the alt attribute within an img tag to describe graphics
and photos in case viewers are not downloading graphics or are using a screen
reader. If a graphic serves as a function, describe the function.
-
"bullet" for graphics which precede list items. Use "separator"
or "page divider" for graphic lines that provide separations on
a page.
-
Banner Graphics for the top of your Web page
For a customized banner graphic, which coordinates
with the overall APSU Web design, send a request to
wilsons@apsu.edu.
-
GIF Format
When saving graphics in GIF format, try using smaller color depths (bits per
pixel) to improve file size. Use interlaced row order to allow the viewer to see entire image as it loads.
-
JPEG Format
Use JPEG format for photos, and when color depth is important. Don't make changes to a JPEG file and then resave. Use the original image (usually
eps, tiff or Photoshop format). Be sure 'baseline' (standard) is chosen for the format options.
Use level 4 or 5 compression unless quality is compromised. Try using smaller
levels of compression for optimum quality vs. file size.
-
Size
Graphics should be 580 pixels wide or less. Always include the correct image
size, width and height attributes to improve load time.
-top-
Hyperlinks
NOTE: The Web Policy also states, "The words 'Austin Peay State University'
must appear at or near the top of the top-level page of the department/unit
Web site as text or a graphic image (be sure to include a text alternative
-- see the Accessibility Guidelines).
In addition, academic area Web sites must clearly identify with which college
they are associated. Spell out the college name rather than using the acronym.
Subsequent pages of the site must identify, minimally, the department name."
Because you've written out "Austin Peay State University" at the top of your
page, using "APSU Home" for the bottom link is acceptable. The abbreviated
"APSU" should not be used on its own on a page -- we need to initially identify
our institution as "Austin Peay State University" to avoid confusion for the
user.
- Navigation (link) list format
When providing a series of links (e.g. at the bottom of a page), use the following
format, which provides space between each link, making it more accessible:
[ About APSU |
Academics | Admissions ]
- Server Absolute or Relative Paths
When linking to pages that reside on the www.apsu.edu server, ALWAYS use
server relative paths. For example, linking from this document to the
Web Resources page, use:
<a href="/web/resources/">Web Resources</a>
- Trailing '/' on Directory Links
When linking to a directory, always include a trailing slash in the path name.
This speeds up response time and ensures access.
Meta Tags
Example:
<html>
<head>
<title>APSU - Web Style Guide</title>
<meta name="description" content="Austin Peay State University
Web Style Guide">
<meta name="keywords" content="Web,guide,style">
</head>
- Only when absolutely necessary, you can use a meta tag to redirect a
viewer from one page to another. Redirects can confuse the Web visitor.
<meta http-equiv="Refresh" content="N; url=pagename">
- Where PAGENAME is the URL to the new page, and N equals the number
of seconds before the page is redirected. Allow enough time to display and
read a message similar to this, "The page for [add title of page] has been
relocated to http://new_web_address.edu. You will be redirected to this site
if your browser supports meta tags." The message should also include a link
to the new page. This allows viewers using older browsers that don't recognize
the meta tag to manually forward to the new page.
Tables
Remember that speech synthesizers, like Jaws for Windows, reads tables beginning
with the top, left cell and then proceeds to the right.
- Using tables as a layout tool can cause your page to be inaccessible for those
using a screen reader or a text-only browser. Check your pages with Bobby
-- a Web-based tool for analyzing Web pages for their accessibility.
- Table width should not exceed 580 pixels.
-
Use the <th> tag, not <td> for table headings.
-
Center your table, so high-resolution monitors won't have excessive 'white
space' on the right-hand side of the screen.
-
If you specify a table width, also specify widths for each table cell.
-
<table border="0" width="580" cellpadding="0"
cellspacing="0">
<tr><td>
Page content...
</td></tr>
</table>
Title
All Web pages must include a descriptive title within the <title> tag. The title appears in the bar across the top of your browser -- it doesn't appear on the Web page itself. The title of a Web page is indexed by search engines and used as the title that's displayed on the search engine "results" page.
The HTML coding looks like this:
<title>APSU - Page Name</title>
Where Page Name is the title for the page.
Within FrontPage, in the "Normal" view, right-click on your Web page; choose "Page Properties." Click on the "General" tab. Type the title into the "Title:" window.
University Logos and Wordmarks
|
Search
APSU
