Skip to Main Content
  

LIBRARY

Home Research Services About

Daniel A. Cannon Memorial Library: Layout & Design

Work on for our Instiution

Best Practices for LibGuide Layout

Website Design

ORGANIZING YOUR PAGES

  • Place the most important content where users are most likely to read it
    • At the top (above the "fold")
    • In the Center
    • Along the left column
  • Avoid large blocks of text, especially when using a one-column format

STRUCTURING YOUR GUIDE

  • Avoid double/triple (or more) rows of tabs
  • Avoid a LibGuide that is only one page of content

VISUAL APPEAL

  • Add an on-topic picture to draw interest and add appeal
  • Utilize the recommended library color schemes whenever possible for tabs and boxes.
    • The dark green tab is the active tab; color: 205c40
    • The light green tab is the inactive tab; color: 6fa287

 

Examples of the Different Navigation Options

To Tab or Not to Tab?

LibGuides 2 allows you to stick with traditional tab layout OR you can switch and have a side navigation menu on the left of the screen. Click on the Side Navigation tab above to see what this new display looks like.

Make LibGuides More Like Tutorials

LibGuides 2 allows you to easily attach Preview and Next buttons to the bottom of your pages. Click on the Tutorial Buttons tab above to learn more.

 

The side navigation option creates a left-side menu bar for each of your pages. 

Example: CHE 124: General Chemistry II

Compare the side tab navigation to the top tab version of a similar LibGuide: CHE 123 - General Chemistry I

Screenshot of Guide Navigation Layout option to select Side Navigation instead of Tabbed

 

To use the Side Navigation option:

  1. Select Guide Navigation Layout under the Edit Guide icon. 
  2. Select the Side Nav. option
  3. Check boxes if you wish to display sub-pages or box headers in the navigation.

 

 

The Previous / Next buttons are easy ways for users to navigate through your guides. When this option is selected, the previous and next buttons will automatically show using the titles you have created for your pages.

Screenshot view of previous and next buttons at bottom of page

To add Tutorial Buttons:

     1.  Click on Prev / Next Links in the Edit Guide menu

Screenshot of Previous and Next buttons

     2. In the box that pops up, check the box to display the buttons and click Save.

Naming your Pages

When labeling content items and pages, be CONCISE, CLEAR, and CONSISTENT.

AVOID JARGON. Always consider your audience. For example, Find Articles is a lot less ambiguous than Databases or search the catalog. Remember that students are less likely to click on something that they don't understand, so even having an explanation on the page will not necessarily be enough.

THE NAME: Does it reflect the purpose of the Guide?  If the page includes links to websites, books, and journals, make sure the link says Recommended Resources instead of just Websites. 

ESTABLISH A CLEAR PURPOSE AND NAVIGATION FOR THE GUIDE. If you want students to progress through your guide in a certain way, rename the homepage, add prev/next buttons, or add Step 1, Step 2 to help users navigate through the guide pages.

Good and Not-So-Good Examples: Based strictly on the information provided in the name of the link, can you tell the purpose of the resource?