Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 4.0

...

Page names, content headings, column headers, and navigation and tab labels all appear in  title case -- the first letter of each major word is capitalized (not the, a, for, by and other conjunctions and prepositions). For form field labels, only capitalize the first word of the label (see below for more).

1.2 Colors

The color contrast between backgrounds and text should be 67% or greater when converted to gray scale. To meet accessibility guidelines for color blindness, the following colors were selected for their strong contrast against one another when paired appropriately. Nowhere is color used as a sole indicator of status or state. It is always paired with a symbol and/or text. The color palette is extensive due to a foreseeable need for charts and graphs in the system. Several of the colors mentioned below are not used in RAFT v 3.1, but will be used in future releases.

 

The color contrast between backgrounds and text should be 67% or greater when converted to gray scale. The pairings below meet that criterion.

Image Added

1.2.1 Colors in charts and graphs

...

The logo is typographic using Source Sans in all caps, semi bold. The abbreviated name of the application is White, 24 pt. 22.5 pt (30 px or 1.9em) The long form of the application name is in Dark Orange, 24 pt.10.5 pt (14px or.9em).

Image Added

1.6 Logo, MIT

...

The MIT logo should appear in the footer area of the web application, and it should be hyperlinked to web.mit.edu.

Image Added

Hyperlinks should always be underlined. Links within body copy appear the same size as the copy. For specific usages, see the Pattern Library.

1.8 Icons

The icon system was hand drawn for RAFT, therefore the symbols depicted may or may not be relevant to other DM-BI applications. The icons are selected using CSS and an icon sprite in which the icons are place within 20 x 20 squares.

...

The top or header of every page should include a 100 90 px tall space with a background color that may be customized with alternate colors from the color library. RAFT uses the Maroon background color (#5A1D17) that holds the branding and key persistent features.

Wiki Markup
\[This language pending Mike approval\]
The header includes the typographic logo in Source Sans in all caps, semi bold in 24 px. It also includes the global navigation links, a search box, advanced search link, a text welcome and log in/out links, and other global tasks. 

Image RemovedImage Added

2.4 Page Footer, persistent

The footer appears at the bottom of every page of the application. It is a 90 50 px high block using background color Maroon that includes 

  1. the MIT logo in white 
  2. the standard copyright in Light Orange, Source Sans 13 pt
  3. two hyperlinks to pages About this Application and Help; these hyperlinks take users to new pages with this information; hyperlinks are underlined Light Orange, Source Sans 13 pt pt  

Image RemovedImage Added

2.5 Forms

Forms should be designed in accordance with the standards above. All fields should include field labels. Labels appear above their fields left aligned with the beginning of the field (except in cases of very long forms i.e., more than 1 full page of scrolling; in this case, labels can appear to the left, aligned left). Buttons should appear at the bottoms of the forms, left aligned with the form fields (not the field labels).

...