ATI project home
Planning

Project Information

Project Proposal
Task Plan

Research & Analysis

Current Site Map
Preliminary Evaluation
User Scenarios
Scenario Paths
Competitive Analysis
Content Audit
Card Sort
Content Analysis

Design

Revised Site Map

Preliminary Wireframes
Cognitive Walkthrough
Wireframes
Construction, Verification
& Deployment


Prototype
Style Guide
Class Presentation

Style Guide

The style guide is documentation of the coding implemented to achieve the redesigned site. It will be used for site maintenance and expansion. This document has been designed to help maintain consistency in design, layout and navigation as the ATI web site continues to evolve and develop. This serves as a guide and should be used to achieve high standards of uniformity throughout the site. The Style Manual should be consulted every time a new document is created for the ATI website.

Responsibilities
Outdated Information
Development Guidelines
Navigation
Content Area Type
Page Layout
Graphics
Palette


Authors’ Responsibilities
ATI web authors are responsible for the following:

  • Updating and revising documents as needed.
  • Removing outdated documents and pages.
  • Assuring that all links are active.
  • Conveying when cross-referenced links should be created.
  • Conveying when information should be posted on the home page.
Dealing with Outdated Information
Authors are responsible for dealing with pages that contain outdated information.

If there is just a section of a page that is outdated, the author’s options are:
1. If the information may become relevant again in the future, the author may comment out the information.
2. If the information will not become relevant in the future the information should be permanently deleted from the document.
If there is a whole part that is outdated the author’s options are:
1. If the page may become relevant again in the future, the page may be moved to a sub-directory named Not-used. This allows the document to be kept for later use, but prevents it from being indexed by the site’s search engine.
2. If the information will not become relevant in the future the page should be deleted from the site.
If an author has a Not-used directory, the author should, on a monthly basis, delete files no longer needed form this directory. This will help keep the server from becoming cluttered and improve server performance.
Development Guidelines

As part of the University of Texas System, ATI must adhere to the UT Austin Publishing Guidelines:

UT Austin Web Publishing Guidelines
The University of Texas at Austin endorses the Guidelines of the World Wide Web Consortium (W3C) as the standard for World Wide Web accessibility. In order to comply with relevant provisions of the Texas Department of Information Resources (DIR) Standards Review and Recommendations Publications (SRRPUB) on World Wide Web Design Standards and Coding Guidelines Section S206.2 Accessibility and Usability of State Web Sites, The University of Texas at Austin has adopted the standards established by Section 508 Subsection 1194.22 of the Rehabilitation Act because they are consistent with the W3C Guidelines and provide achievable, well-documented guidelines for implementation.

Navigation

Primary Navigation

Typeface: Helvetica Neue, 10pt. 7.5 kerning

Font color: #00000 in natural state, #FFFFFF in select state

Secondary Navigation

Normal state: color #6699CC; font-size: 12px; font-family: Arial, Helvetica, sans-serif; text-decoration: none

Hover state: color #6699CC; font-size: 12px; font-family: Arial, Helvetica, sans-serif; font-family: bold; text-decoration: underline

Selected state: color #003366; font-size: 12px; font-family: Arial, Helvetica, sans-serif; font-family: bold; text-decoration: none

Content Area Type

Body text: font-family: Arial, Helvetica, sans-serif; font-size: 12px; color #333333

Link: color: color #6699CC; text-decoration: underline

Link hover: color #FF9933; text-decoration: underline

Heading 1: font-size: 20px; font-weight: normal; color: #003366; font-family: Arial, Helvetica, sans-serif

Heading 2: font-size: 16px; font-weight: normal; font-family: Arial, Helvetica, sans-serif

Heading 3: font-size: 14px; font-weight: normal; font-family: Arial, Helvetica, sans-serif

Page Layout Alignment

Primary Navigation - Centered; 720 px.
Secondary Navigation - Left Justified; 145 px.
Headline - Left Justified in content area; 575 px.
Content - Blockquote in content area
Footer Navigation - Centered

Graphics

Alt Tags
All images require theALT attribute. alt=”Descriptive text” The text should be either a description of the graphic for static graphics or a description of where the user will end up for hyperlinked graphics.

Transparency
Any irregularly shaped (with more or fewer than four sides) graphic on a Web page should either be made transparent or created with a white background.

Hyperlinked Images
Images used as links should have the border turned off using Border=”0”.

Location
Images for use across the site are to be placed in the root directory. If the graphic is to be used in only one section of the Web site then the files belong in a graphics subdirectory.

Size
Graphic files should be no larger than 75K.
The width and height of a graphic should be incorporated into the coding; the page will download more quickly:
Width=”X” height=”Y”

Palette

 

back
end