Content Style Guide

How to Format Headings

The use of headings is useful to break up lengthy text and allows screen readers to navigate to the section of information that they need instead of reading all of the text.

• Be descriptive in the text of your heading

• Use title case(capitalize principal words and only capitalize articles and preposition when at the beginning of a heading) or sentence case(capitalize the first word only) when heading is a punctuated sentence.

• Don't use all caps.

• Don't include a colon at the end of the heading.

• Use active verbs where appropriate but avoid gerunds(verbs ending in "ing".

• Use the heading style selections offered in LibGuides. Don't make text make the text bigger and bold. Using the heading in the text puts in the right coding for screen readers.

• Make sure headings are properly nested as you would in an outline (H3 is nested under an H2 and H2 is nested under an H). Don't select a heading based on visual style.

• In LibGuides, headings 1 and 2 have been reserved. H! is for the page title and H2 is for the box titles.

Images, Graphics, Videos, and Audio Content

Use Graphics in moderation.

• Don't use an image if the subject of the image is just text( for example don't use an image that says "About Us" because you want a special font.

• Don't use animated graphics(unless the graphic is still by default and the motion can be triggered by the user.

• Use purely decorative images sparingly.

• Avoid clipart and generic stock photos.  This one is a little iffy.   Just make sure your images are clear, good quality and relative to the subject matter. Clipart can look cartoonist and amateurish. 

Use appropriate image alt text.

• 125 characters or fewer

• Alt text should describe the mage for users who can not see.

• Follow WebAIM guidelines for alt image text.

Use only images we have the right to use.

• Ideally, the images would have a creative commons license.

• Give attribution to the creator by adding text under the image.

• If creative commons, sure you follow what the image's license dictates.

Video and audio should provide text-based alternatives.

• Videos should include captions.

• Audio files should include transcripts or text equivalent.

​

Language, Voice, and Tone 
Although we are in an academic environment, plain language will help all of our users get their work done more quickly. Plain language will also ensure our content is easy and accessible to our many diverse users. Plain language is so important that there is a federal mandate to use it on all government websites. 

Aim for a "Casual" voice. 

• Libraries are about collections, resources, and services but they're also about people. Showing our people side will help users find the library less intimidating.

• Be friendly, direct, and helpful.

• It's ok to address the user as "you" and ourselves as "we."

• Contractions are OK.

Use the active voice

• Active: Renew your library books ... Passive: Library books can be renewed ...
• Tip: Sometimes it's hard to identify the passive voice. Dr. Rebecca Johnson suggests inserting "by zombies" after the verb and if the sentence still makes sense, you're using the passive voice. 

Use future-friendly voice 

Link Labels should be Unique and Descriptive.

Many users scan web pages for links to help figure out where to go next. Link labels should clearly indicate where the user is headed. Users of assistive technologies often browse web pages by only reading the link labels and not the text surrounding it so it's important that they are unique and descriptive. Good link labels also help search engines find your content.

• Do use descriptive language but concise language so the user understands where the link is taking them.
• Don't use naked links for example. Use the library website https://www.tcc.edu/LibraryPage
• Don't use generic labels.
  • For more information click here
  • More information can be found here
  • Read more about our website
• Don't use extraneous words around your links
  • Click here to access the librarywebsite instead use Access the library website
• Don't have multiple labels that say the same thing
  • Try this website or this website

• Make sure there aren't any extra spaces before and after the link  Try The Know it All website for more information. The extra spaces will sometime hinder screen readers .

• Do not repeat links in boxes that are on your navigation tabs. Screen reader users get confused and lost of their location on the page.

Create Once, Edit Once: Avoid Duplicate Assets

When reusing content, keep in mind that Mapping/Linking is better than Copying because it's easier to maintain consistency and currency of your guide content. It is suggested that you:

• Go to the Assets library (Content>Assets) to review and manage content assets in all of your guides, including: links, RSS feeds, documents, books, media/widget...etc.
• Deduplicate Assets: Type your name in the Owner column to sort and find all the assets owned (created) by you. If you found duplicate assets:
  • Find the duplicate(s) and click on the number in the Guide Count column.
  • Click on the guide title to go to the guide.
  • Remove the duplicate asset from the guide.
  • Add the correct asset by reusing the existing links or other asset to the guide.
  • Go back to the assets page and repeat this process until the Guide Count of the duplicate asset(s) is at 0.
  • Delete the duplicate asset(s) from the assets page.

Lists

An Ordered List.
Use a numbered list for explaining sequential steps. Use bulleted lists to group like items together to simplify lengthy and dense paragraphs. Lists with full sentences, you should capitalize the first word of each item and use a period at the end of the sentence. Don't end with commas, semicolons.

Example of an ordered list.

How to find an article

1. Click on the Library Databases" link located in the "Quick Search" box.

2. Choose "Academic Search Complete."

3. Fill in keywords in the search boxes.

4. Click on the search button.

An Unordered List
if you are just listing items, capitilize the first word of each bulleted item but don't add punctuation at the end.

Example  of an Unordered List

Grocery List

• Apples

• Peanut butter

• Detergent

• Bread

• Celery

• Milk

Text

Be extremely selective in your use of colors, bold, italics, and increased size when trying to emphasize something in the text. Don't use more than one style at a time (for example, don't do THIS). Adding too many styles will lessen the effect and distract the user.

• Don't use underlines (underlines are reserved for links only).
• Don't use all caps.
• Don't set the text to centered or full justify (keep it at the left-aligned default setting).
• Text font should be Arial. The font size should be 14.
• Headings should be Arial. The font size for headers can be a larger size. The font size can be set or resized. Don't make them too large. H3 18px and H4 18px.

Tips on Adding Text

It is recommended that you type directly into the rich text editor; then use the functions in the text editor to add style and formatting. Creating the text elsewhere and attempting to copy / paste it into the text editor will bring in a lot of unnecessary HTML code and formatting, which will also introduce inaccessible content.

• If you've already pasted your text into the text editor, highlight it and click on the Tx icon in the text editor. This will remove all the formatting from your text.
• If you haven't pasted yet, then use the Paste from Word option (clipboard with W icon) when paste content from Word. Or, use the Paste as Plain Text option (clipboard with T icon) when paste content from other places. This generally removes some, but not all, of your formatting.

Microsoft Word 

   Links from WebAIM

Creating Accessible Documents

Word 2016 for Windows

• Creating and Editing Headings

• Adding Alternative Text

• Creating Tables

• Editing Hyperlinks

• Creating Lists

• Creating Columns

• Using the Accessibility Checker

• Saving as HTML

• Converting to PDF

  • Adobe Acrobat Add-in

  • Saving PDF to Word

Word 2016 for MAC​​

• Creating and Editing Headings

• Adding Alternative Text

• Creating Tables

• Editing Hyperlinks

• Creating Lists

• Creating Columns

Acrobat and Accessibility 

1. Introduction

2. Tags Pane

3. TouchUp Reading Order

4. Other Tools and Features

PowerPoint 2016

• Introduction

• Templates and Themes

• Slide Layouts

• Slide Reading Order

• Alternative Text for Images

• Tables

• Links

• Check Accessibility

• Other Accessibility Principles

• Convert PowerPoint to PDF

Excel 

 Data Tables

• Marking Up Data Tables
• Table Captions
• Identify Row and Column Headers
• Associate the Data Cells with the Appropriate Headers
• Use Proportional Sizing, Rather than Absolute Sizing
• Other table markup

Tables

• Use tables mainly to display data that fits well into rows and columns.                             
• Add table headers to describe the contents of the table columns. (Table Properties>Headers.)
• Add table caption and summary to provide more information about the table for screen reader to pick it up.
• Avoid spanned rows as screen readers may not properly parse them.
• If tables were used for layout purpose (layout tables), then DO NOT add table caption or headings (<caption>, <th>, etc.) to it. Otherwise, the screen reader may incorrectly present the table as a data table causing increased overhead and confusion.