Kingswood Communications Web Style Guide
The intent of the Kingswood Communications Web Style Guide is to provide a consistent style on all web pages.
Active Web Technologies
Breadcrumbs must show how a user can arrive at a given page from the menu. Top level menu items with no associated page (e.g. QuickLinks) should not be shown in the breadcrumb.
Calendars should be embedded as a Google Calendar iFrame. PDF Calendars should not be used as they will be printed and quickly out of date.
Use a “Contact Block” at the bottom of a content page to indicate who can provide additional information. For example:
Ima Webmonkey – Executive Director of Making the Website Go
Phone: 506.432.4400 or 888.432.4400
Fonts should not be specified within WordPress pages. Instead, they must be defined in CSS defined by the template.
The <strong> and <em> tags may be used.
The <u> tag should not be used as it may be confused with a web link.
Font colors should not be defined within pages.
Font rules do not apply to banners or event advertising blocks.
Wufoo should be used for all online forms.
Images should have no border and not link to anything unless they are a button.
In general, images within WordPress pages should be no larger than 300 pixels in either dimension.
General images of campus life should be used where no specific images are available or applicable. However, these images should be limited to one or two on a page.
Images of current students, faculty or staff are preferred over stock images or former students, faculty or staff.
Images must present the institution in a positive light. A such, they should not depict any damaged property or overly inclement weather.
When possible, local links should be relative to the current location.
The <a> tag should not span any more text than is necessary.
Links to Forms
Links to online forms that in-line to text, should use “PDF” or “online form” in brackets between the <A HREF> tags. PDFs should always open in a new page. For example:
When links to forms are not in-line, use a colon followed by “PDF” or “online form”. When both are provided, use a pipe “|” between the two. For example:
Links – External
External links should include the full URL without the protocol (http, https, or ftp). For example:
Find the super-secret information at someone else’s site: www.google.ca
External links must not be used inside menus.
Bulleted lists should be preferred for any list where quantity or order aren’t represented by the list. Images should not be used as bullets. For example:
The following are colors:
Numbered lists should only be used when the order of list items is specific or where the list is demonstrating a quantity (e.g. the following three items must be provided:). For example:
To add a widget to the do-dad:
- Click the button
- Drag the slider
- Press “OK” to save
Only the Kingswood logo approved by the communications department may be used on the website.
All on-site links should be linked in one of the following ways
- Directly from the main menu (preferred method)
- Directly from a parent page for larger volumes of subordinate information (to be used sparingly)
Links should not be included in more than one menu.
Links inside menus should be no deeper than 3 levels below home (e.g. Home > Academics > Programs > TESL).
When no order is needed, alphabetic order should be used. Some menus will be ordered by importance or other means.
Phone numbers should include an area code and be separated by periods (e.g. 506.432.4400)
Unless decimals are required, dollar amounts should be specified as whole dollars and use commas when above $9999 (e.g. $25 or $10,000).
Tables should be used sparingly for layout purposes. They may be used to present data in a tabular form.
Tables should not include borders.
Titles and Subtitles
Titles Should be Presented in Title Case with no Punctuation
For WordPress pages, use the Page Title without duplicating it within the text.
When only a single set of sub-headings is required, use bold text for sub-headings.
When multiple levels of headings are used, use <h1>… <h5> tags.
Title should be left justified.
Use the “Wufoo Embed Form Code” for WordPress inside a page to present a form.
Titles for Wufoo forms should be hidden in favor of the WordPress page on which it is embedded.