Web Style Guide

This page lists the technical requirements for publishing on the Duke Law website. If you need blackboard support please see our blackboard tutorials.

To achieve consistency across our site, and make our content usable to a variety of visitors and devices, display properties are managed in separate CSS files.

Beginning users may type or paste their content into the content manager and the CSS files will control their display.

Intermediate users may modify the default display properties of content using the following CSS classes:

Advanced users may also edit their own style sheets through the header area of the content tool

Headings

The purpose of headings are to help the viewer identify the role of a section of content in relationship to the overall document. Headings should not be used simply as a means of making text stand out. If you would like to draw attention to particular items in your content not related to document structure please enclose those in either a paragraph (<p>), or list (<li>) tag and assign it a class from our style guide.

First and second level headings are already assigned by our site templates and will be discarded by our content editor. All headings in the content editor should begin with a level three heading.

Images

To work seamlessly with our fluid template design, images must meet the following standards:

News Item images must be 75px Square
Feature images must be 200px Wide
Content images should be no wider than 300px
If no feature is present, images should be no wider than 500px wide

Classes

Classes should use the format: <tag class="class name">text</tag>

Formatting

highlight
callout
caption
fineprint (decreases text size by 80% use sparingly)
nobreak
imagetag
hide (hides elements that are only needed when the page is printed)
show (displays on otherwise hidden element)
hide_bullet (hides list bullet)
alpha_list (Converts numerically ordered list to alphabetical)

Colors

The following colors are pre-approved for use on this site.

red {color:#b32500;}
blue {color:#0040d9;}
purple {color:#800067;}
green {color:#005711;}
brown {color:#805900;}
black {color:#000;}

You may also wish to review our extended color palatte (.pdf).

CSS Editing

Except in rare circumstances, creating additional styles for content should not be necessary. In particular, user created styles have not undergone the same rigorous cross-browser testing as our style sheets and in some instances may conflict or even break the presentation of your content. We encourage you to consult with Web Services if you feel your content may require additional styling.

The following guidelines explain the organization and structure of Web Services CSS. Our approach condenses all of the style sheet properties onto three lines to help speed up searching and editing.

Positioning Properties: margin; padding; height; width; display; float; clear; position;
Font and List Properties: font; text-align; color;
Background and Border Properties

The following CSS abbreviations are preferred:

margin: top right bottom left; -or- top left/right bottom; -or- top/bottom left/right;
padding: as for margin;
font: style variant weight size/line-height family;
background: url(image) repeat left top color;
border: width style color;
border-width: as for margin;