Awesome Tools Web Guidelines
Division of Student Affairs
Writing for the Web
- Most content should be posted as an article. This will allow content to be visible on the front and topic page feeds.
- Articles should be written with a web audience in mind: shorter, scannable, appropriate use of bullets, lists, and subheadings.
- Articles should be at least 2 sentences in length.
- Every article should include a summary of 50-100 words in length. Ideally, the summary is the first paragraph of the article.
- Formatting should not be used in summaries.
- Be mindful of copyright when posting content to the web.
- Ensure text is readable by providing enough color contrast. Black on white is the safest text choice.
- Utilize heading tags in a logical, hierarchical manner.
- Tables must only be used to present tabular data, and must be adequately labeled.
- Text links should be descriptive of the destination page, not “click here”.
- Underlining should only be used on text links. To emphasize a word or phrase that is not a link, use the bold formatting option.
- Links should not open additional windows.
- Color must not be the only indicator of what actions are available to the user (i.e. “click the blue button”).
- When copying text from Word or Outlook, always use the “Paste from Word” or “Paste as plain text” options.
- Refrain from all-caps in headings and body text.
- Tag each article with relevant keywords; use the singular instead of plural form when possible.
- For article images, use .jpg images instead of .png or .gif images. If embedding images with transparent backgrounds, .png should be used.
- Include alternative text for all images.
- Images within the carousel should have an alt tag that matches the title of the destination page.
- Refrain from using text in images.
- Images should be landscape orientation and preferably 480px X 360px in dimension.
- Ensure you have permission for all images you use on your site. This can be done by:
- Having a photo release form on file for the subjects of images you produce. Photo release cards can be picked up from Technology Services.
- Using images from the Creative Commons.
- Credit image creators by adding attribution in the title field.
- Font and blink tags should be avoided.
- Include an opt-out function on all animated content.
- Videos must be accompanied by captions or transcription and presented on an accessible video player.
- All form elements must be labeled.
- Personal private information (PPI) should never be posted on a site nor collected in a web form.
- The official colors of U-M/Student Life are Yellow (#F6D565) and Blue (#3A5E8C).
- All Student Life units must include the standardized Student Life logo in the upper left corner of the site.
- All Student Life units will share a common footer.
- Customizable regions of the site include the identity banner, sidebar blocks, etc. Refrain from using font tags or re-sizing text.
- Identity banner dimensions are approximately 786px X 106px.
- A link to an accessibility statement should be included in each site and displayed prominently on the home page.
- Unit contact information or a link to the contact page should be visible from the front page of each site.
- A "Share Your Story" section is encouraged for all sites.
- Separate words within a URL with a hyphen (i.e. volunteer-application).
- Comments can be enabled for articles at the discretion of the site manager.
- Utilizing the "Sticky at top of lists" setting is discouraged. Instead, feature the article or add it to "On this topic".
- Utilize the scheduling features whenever posting content with a short life.
- Only homepages and topic hubs can host an image carousel.
- New content types are permissible, but Tech Services should be consulted early.
- All features are expected to be shared across Student Life.
- Tech Services does not maintain mail lists or listservs. MCommunity groups are the suggested method for organizing and communicating with groups.
- All modules should be tested by Technology Services for compatibility and approval.
- Consult Technology Services when considering a sub-site.
Technology Services reserves the right to audit and edit all website content to maintain:
- Structure (Information Architecture)
- Visual Design
- Compliance with laws and standards
- Alignment with Student Life mission and goals
- Published: August 8, 2012
- Updated: June 10, 2014