FSP Web Standards

This page will evolve continuously. Refer also to the Create Content Procedure for step-by-step instructions for creating pages and images.

Metadata

Naming Conventions

For page titles, file names, and path aliases, do not abbreviate unnecessarily. Use longer, descriptive names and complete words. These are more easily recognized by your fellow content maintainers and picked up by search engines. Especially for file names consisting of many words, start with the most significant word (the reverse of English grammar). Examples:

  • Title: "FSP Web Standards" rather than "Standards"
  • Title: "Operations Meeting Minutes 2005-12-31" rather than "December Meeting Minutes"
  • Path alias: "/it/web_standards" rather than "webstds"
  • File name: map_nh_large.gif rather than large_nh_map.gif

Every path alias should begin with the Center to which the page will be assigned. At present there are ten Centers, which generally correspond to one of the FSP's departments: org, press, news, events, merchandise, photo, nhinfo, community, volunteer, advertising, and it. Paths should be *entirely* in lower case.

Keywords, Categories, and Taxonomy

Pages should be assigned a Center and, if appropriate, an Issue, Strategy, and/or State. These help to categorize pages for easier searching.

Layout

Choose a one or two-column layout depending on the nature of your content. As a general rule, one-column layouts are appropriate for "documents" (e.g. something you might bang out in MS Word), while two-column layouts are better for home pages, or other information-dense pages. But narrower columns are also easier to read, as the human eye has a hard time following long lines of text and finding the beginning of the next, so consider using two columns even for ordinary documents.

Try to include a photograph or other graphic! These catch the user's eye, and make the page more memorable. However, keep all images less than 500px in width to avoid breaking the layout at screen widths of less than 1024.

Linking

When linking to another page on the FSP site, leave off the domain name, e.g. use /org/presidentscorner instead of http://freestateproject.org/org/presidentscorner.

Semantics Before Style

Avoid forcing styles--concentrate primarily on the content and not its style. Use *semantic* tags like H1, H2, p, ul, ol, strong, etc. That way the look and feel of the entire site will be consistent, even if changes are made.

Colors

Our standard colors:
  • Dark Blue (logo): Blue (logo): PMS 2766 C  
    Approximate hex: #2b265b
  • Tan: Tan (logo): PMS 465 C

    Approximate hes: #c1a875
  • Light Gray: #DDDDDD = RGB (121, 121, 121)

Submitted by stevecobb on April 15, 2006 - 5:37pm.