STYLE
Guide
|
You can
create your style guide simply by keeping lists of the important decisions you
made as you built the site. Word
documents stored in a folder are easy to manage.
As the project progresses, you can convert the Word documents into HTML,
then link among various topics in the sections of the newly created HTML style
guide, and make the style guide a living document your whole team can use.
This checklist will get you going; you can modify it to suit your site:
Format
and Structure
·
A clear diagram of the
directory structure, showing what types of files will be stored where.
·
A site map or index showing
major areas of the site and major navigational paths.
·
Notes about the site
structure’s overall logic.
·
Guidelines describing what is
stored in databases (your database software might include a feature for mapping
and documenting the database).
·
A flowchart showing how
transaction systems are organized.
·
Notes about how to place
content into the site’s structure.
Visual
Style
·
Notes about how style choices
were made and by whom.
·
Records of which artist or
designer created specific elements of the site (so you can go back to that
person for more work on that style when needed).
·
Where and how to place page
banners, navigational bars, buttons, company logos, navigational bars, special
elements, and so on.
·
Which fonts or font families
to use for page banners, navigational bars, body text, informational tables,
forms, and so on; where those fonts are located and in what size they can be
used.
·
Where art is located.
·
How basic page layouts and
special effects are accomplished.
HTML and
Page Layout
·
Fonts to be used (and
alternate fonts, if you are using <FONT FACE>).
·
Colors (including their
codes) for backgrounds and special elements.
·
Headings—the font, color,
size, weight, and so on for headings for various levels.
·
Whether to use <B> and
<I> or <STRONG> and <EM>.
·
How to code special
characters such as TM, ©, and ®.
·
META tags to be used to
optimize standing in search engines.
·
In page layout tables, the
preferred table and cell widths, as well as cell padding, cell spacing, and
information about where exceptions are allowable.
·
In frames, naming
conventions, targeting and default targets, and directory structure for frame
sets.
·
Any disallowed characters,
such as em and en dashes, which are not part of the standard HTML character set.
Graphics
and Multimedia
·
The maximum size in bytes for
a page.
·
What file types are allowable
in what circumstances (in general, it’s best to stick to Graphic Interchange
Format (GIFs) for simple graphics and Joint Photographic Experts Group (JPEGs)
for photographic images) and what is the maximum suggested size.
·
How and when to indicate the
size of downloadable multimedia and graphics files (this is a convenience for
users, who can then decide whether or not their systems can manage the files).
·
Suggestions for how to avoid
dithering, which reduces image quality, and how to use interlaced files that
load in several passes.
·
Limitations on use of logos,
company colors, and other company-identifying elements (for this, you might want
to link to the visual style, editorial style, and legalese sections of your
style guide).
·
Information on placement of
banner ads.
·
Notes regarding who designed
and who approved various graphic elements, so that in the future you can contact
those involved to make adjustments or have additional material created or
approved.
Editorial
Style and Usage
·
Which reference guides your
sites uses as a basis for editorial style—Chicago Manual of Style or
Associated Press Stylebook and Libel Manual?
Which directory? Which
edition of each?
·
The mission or philosophy of
the site—the goal that making it public is meant to achieve.
·
How to handle
punctuation—for headings, will you use heading style (with the first letter of
all important words uppercased), or sentence style (with only the first letter
of the first word capitalized)? How
will you handle all-cap names like CNET? What
about names that include punctuation, like Yahoo!?
And what about terms like Web site?
Will it be that or website?
·
Are there acronyms that can
stand unspecified, such as AMA (for the American Medical Association, which is
familiar enough to users of a medical site) or HTML? These can appear in an alphabetical list with those less well
known acronyms that need to be spelled out, such as CSS for cascading style
sheets.
·
What to do with various
compound words, for example, whether you will go with e-mail or email.
·
How to handle such special
elements such as captions (how will they be formatted, and how long can they
be?); the use of color or black and white in images; the format of informational
tables and the headings and text within them; the length and tone of headings;
and so on.
·
Policies regarding the use of
logos, linking, and legalese on your site.
·
Online references that will
be of use, for example The Slot (www.theslot.com), which provides insight into making editorial choices.
Linking
and Cross-Linking
·
How many links should appear
in a paragraph or story.
·
Your policy on what sorts of
words to link on. Again, avoid the
generic “click here” and link on the most pertinent phrase instead; for
example, the destination of the link (which is more enticing to users).
·
How to phrase links to
downloadable files, graphics, and media.
·
When to use buttons for links
rather than text and vice versa.
·
How to handle jump links
(those that link to text within the same page).
·
Whether and in what
circumstances it is acceptable to link outside of the site.
Legal
Matters
·
How copyright notices should
be worded and where they should be placed on your pages.
·
How trademarks should be
indicated.
·
Policies regarding gaining
permission for use of copyrighted material from elsewhere.
·
Policies regarding use of
your own material; for example, when it is permissible and what procedures must
be followed by others to gain permission to use your material.
·
Notes regarding who among
your staff is authorized to grant permission to use your material.
·
Any forms or permission
agreements necessary for others to fill out in order to use your material.
Review
and Approval Procedures
·
Who’s who on the review
team as well as what they are authorized to review.
·
How the review and approval
process occurs.
·
How approvals are recorded.
·
Who signals that the material
has been fully approved and can be posted.