Skip to Main Content

Standards for Creating LibGuides

Requirements

  Responsive Design
  Guide has been viewed on multiple devices to check responsiveness

Responsive Design

The LibGuides CMS is built using responsive design. Responsive design makes it easier for users to view content across a variety of devices. With responsive design, content is reordered and optimized depending on the screen size of a user’s device. This ensures that your guide content looks good across devices, including desktops, tablets, and phones.

Because your content is reordered automatically as screen sizes decrease or increase, you should order your content so that the most crucial content appears first. Using the template, content reorders according to column. For instance, content in column 1 appears first in the mobile view, followed by content in column 2, column 3, and so on.

Here are some tips to take advantage of responsive design:

  • As you design your guide, resize the width of your browser.
  • View your guides on your own mobile devices.
  • Consider the order of your content on each page. If the user is viewing from a mobile device, the first box in row 1, column 1 is what the user sees. While your guide homepages must adhere to the layout standards here, you have free reign over the content on other guide pages. Place the most pertinent information in this space. Ask yourself "what's the first thing a user is looking for when they arrive at this page of my guide?"
  • Keep tab and guide titles brief, no more than 3-6 words. Longer tab and guide titles will take up more screen real-estate, creating a cluttered look on smaller screens.

Checklist for Responsive Design

  • Guide has been viewed on multiple devices to check responsiveness
  • Tab and guide titles are no more than 3-6 words