Skip to Main Content

LibGuides Standards and Best Practices

Overview

Tips for creating better web content:

  • Do not use color as a way to convey meaning or importance. Colorblind users and screen readers will not understand or convey color changes.
  • Don't mix different font types. Stick to the default font. 
  • Avoid changing the font size unless you have good reason. If you need to convey structure within a text box, use headings.
  • Do not underline text that is not a hyperlink. It causes confusion.
  • Avoid relying on non-HTML content that may not be accessible as the sole means of conveying information. Examples include text-heavy images, PDFs, or PowerPoint documents.

Have questions? Email us at librarywebservices@furman.edu.

Less is More!

Tips for avoiding information overload.

Getting information off the Internet is like taking a drink from a fire hydrant

  • Whenever possible, limit yourself to 10 or fewer pages on a single guide.
  • Avoid sub-pages as much as possible. They can be confusing both in the tab and side nav views.
  • If you have 2 or more rows of tabs/pages on a guide, consider switching to side nav.
  • Break up explanations with bullets, headings, and other visual cues to group content into smaller "chunks" of information.
  • Whenever possible, limit resource lists to 8 resources or less per content box.
  • Keep important information at the top left of the page to avoid scrolling down (regardless of device).
  • Keep your profile box on the top right, so that on mobile devices it will not appear at the top of the page requiring users to scroll past it before reading any other content on the page.

Headings

Screen shot of Format drop down boxJust as chapters help you navigate a book, headings help you navigate website content. Headings serve two purposes: 1) they make content easier to read and understand on a web page, and 2) they allow screen reader users to more easily navigate the website.

  • Within a LibGuides box, use "Heading 3" or <h3> for all major content headings. You can do this by highlighting selected text and choosing "Heading 3" from the Paragraph Format dropdown box.  Heading 4, Heading 5, and Heading 6 can be used sequentially as subordinate headings.
  • Don’t use manual formatting, such as font size or bold to give the visual appearance of headings. This will make it impossible for screen reader users to navigate content efficiently.
  • If you need some uniquely sized or styled text, let us know, and we can help you do this using CSS which won't effect the structure of the website.

Copying & Pasting

Take caution when copying & pasting content from any source. Many times hidden style code will also be copied along that could break with best practices and introduce inaccessible content.

There are a few ways to avoid hidden style code from being placed into your guide. The rich text editor has a few useful tools to use. Screenshot of rich text editor toolbar. Focus on buttons used for removing hidden formatting from text

  • Button to use for removing hidden styles from copied text. This button will show a popup box that will strip out all text formatting and leave behind plain text. Best for simple text.
  • Button to use for leaving the original formatting as in the Word document. This button will show a popup box that will keep a lot of the original formatting from the Word document source. This is also the default behavior when pasting directly into the rich text editor. This does not follow best practices so try not to use this feature unless you plan to go through the source and clean up the formatting by hand!
  • Button to use for removing all formatting from selected text in the rich text editor. This button will remove all formatting from selected text inside the rich text editor. This will generally solve strange formatting issues you may find from copied text. This button will also remove hard-coded widths from tables that may overflow your guide.

Link Assets

Whenever possible, links to resources should be added as link assets. Here are some tips for creating link assets:

  • Don't add the Furman proxy prefix to the URL. Enter the actual URL then click the proxy button and the proxy address will automatically be added.
  • Reuse link assets as often as possible rather than creating duplicate link assets. This makes it easier to batch update.
  • Always link to the specific page that will be needed by the user; don't link to the main page of a large and potentially confusing website
  • Create short and intuitive link descriptions.

Links in Rich Text Boxes

If you add links directly into a rich-text box then those links can't be managed by the link asset manager or the link checker. We strongly advise you use link or database assets for all links in your guides.

If you must use links inside a rich-text box then follow these tips:

  • Whenever possible, link to URLS that begin with HTTPS
  • Do NOT change the target to New Window (_blank) on the target tab. This violates accessibility best practices.Screenshot of "New Window (_blank) with a red x through it
  • Links should make sense if only the linked text is read. Screen reader users can choose to read only the links on a web page, so phrases like “click here” and “more” will mean nothing to them

Lists

Tips for creating effective lists:

  • Always use either the Bulleted List or Numbered list options in LibGuides when creating a list. Screen readers will not understand list items unless they are formatted as a list.
  • List items in order of importance rather than alphabetically.
  • Keep lists short. Consider featuring the top five resources prominently.
  • Consider breaking long lists of resources into different boxes based on similar content type.

Tables

Screenshot of table properties menu in LibGuides.Tips for more effective tables:
  • Only use tables for tabular data that fits well into rows and columns.
  • Avoid using tables for visual layout.
  • Set table width using percentages not pixels.
  • Use table headers to describe the contents of the table columns.
  • Avoid spanned rows as screen readers may not properly parse them.
  • Tables have special styling to make them work well with responsive design. Do not manually change the table's width or cell padding in LibGuides, because this will make them unresponsive.

Creating tables can be very complex. If you have questions that aren't covered here please contact us at librarywebservices@furman.edu, and we'll work with you to figure out how best to proceed.

Making Existing Tables in LibGuides Accessible

The LibGuides visual editor makes it super-easy to make existing tables accessible:

  1. To change a regular table row to a header row
    1. Right-click anywhere in the table and choose Table Properties.
      • Make sure that you're seeing "Table Properties" for this table, and that this dialog box doesn't think you want to insert a new table. The Rows and Columns dropdowns should be grayed out and should show the correct numbers of rows and columns in the table.
      • Now change the Headers dropdown from "None" to "First Row".


screenshot of visual editor in LibGuides, showing the Table Properties dialog box, showing First Row in the Headers dropdown with an arrow pointing at the dropdown

 

That's all there is to it, for an existing table. Note that this example is for a simple table in which the first row, in each column, should be a header, as in the example screenshot below:

Owner Type of Pet Pet's Name
Scott Cat Phoenix
Christy Cat Gracie
Rob Dog Chip