This guide will provide standards, best practices, and guidelines for authors to follow when creating and updating guides, and will help create usable, readable and well-designed guides for IOT Libraries.
Fundamental Usability Ideas
CHOICE Media Channel - Are you looking to get the most of LibGuides built-in features to increase consistency across your guides? Seeking out ideas for creating your own style guidelines? Looking for tips on how to make your guides more accessible while building in a ‘positive library experience’ for all? Or are you looking to pick up some writing for the web and design tips to make your guides more effective? Then this session is for you! The purpose of this session is to give regular and admin users an overview of some best practices for managing and designing your LibGuides content. Event page: https://www.choice360.org/webinars/be...(1:19:37)
Springshare - Overview of LibGuides, Accessibility, and Best Practices
The Springshare LibApps platform provides a variety of tools for librarians to help users find resources and information, answer user questions 24/7, promote library services, events and spaces, and maximize the use of library services.
LibGuides: LibGuides is an easy-to-use content management system deployed at thousands of libraries worldwide. Librarians use it to curate knowledge and share information, organize class and subject specific resources, and to create and manage websites.
LibCal: LibCal provides four modules to handle libraries' calendar needs: hours and locations management; room and equipment reservations; event registration and management; and librarian appointment scheduler.
LibWizard: Build interactive tutorials and test users' research skills using forms and surveys, or by building gradable quizzes.
LibAnswers: LibAnswers provides a ticketing system and FAQ builder, as well as LibChat and "Ask Us" widgets for direct communication with users.
LibChat - Live chat with students, tied to LibAnswers and ticketing.
LibInsight - Tool to gather & analyze all library statistics.
All webpages use headings to clearly organize and label sections for users. Headings also help users with screenreaders to move around a page and jump to sections that are relevant to them.
If you want to add headings or sections to your website, use heading styles instead of simply enlarging or bolding text. Heading styles are already formatted to stand out from regular paragraph text and help screenreaders to skip directly to the information that the user needs.
Heading styles should always be used in numerical order:
Headings should be in order, so do not go from h3 to h5 (meaning you would be leaving out h4).
Example: <h3>Section 1</h3>
<h4>Section 1.1</h4>
<h4>Section 1.2</h4>
<h5>Section 1.2.1</h5>
<h4>Section 2.1</h4>
<h3>Section 2</h3>
In the example below, the title of the webpage is “Institutional Review Board (IRB): IRBManager” and is a Heading 1. There are 3 boxes on the page, and each box label/name is a Heading 2: “Contact the IRB,” Calendar,” and “Introduction to IRBManager.” Within the “Introduction to IRBManager” box, are Level 3 Headings for “Student Researchers” and “Faculty Chairs/Mentors.”
Add hyperlinks as click-tracked assets under the Asset Manager and add as individual links in a content box. Hyperlinks should be a specific text or phrase that clarifies where the link will take users and should be clear outside of context. No "click here" statements.
Adding hyperlinks within your webpage or content box is at times more logical than adding a separate list of links. Caution: Links within text are not added to the Asset Manager or tracked through the Link Checker.
When linking to a document or webpage, don't just copy and paste the URL onto the page. URLs can be long and complicated for screenreaders to read and don't clarify where the link will take users.
Instead, place the link onto a specific phrase that clarifies where the link will take users. This word or phrase should also be clear outside of context, as screenreaders can read off all the links on a page without their surrounding content. An example would be a link to the IOT Library Catalog or a link to the WebAim standards for web accessibility. In both cases, you know that the links will take to the IOT Library Catalog website and WebAim website, respectively. Furthermore, if the link will lead to a page outside of your LibGuide, such as a link to another IOT department or another organization, the link should open the site in a new window. This prevents users from getting lost and not being able to return back to your LibGuide.
To add a hyperlink:
People generally scan for information on web pages. Use different types of lists to group information according to its nature to provide orientation and easier consumption.
Unordered lists
Ordered lists
Best practice according to ADA guidelines when adding images is to provide a textual description of the image. If an image is on your web page, it is important to ensure that images that convey important information have appropriate text alternatives or descriptions. A description of an image will ensure that it is accessible to everyone. Alternative text and captions are the most commonly used methods to describe images. However, depending on an image's complexity or overall functionality, other image description approaches may be more suitable. When placing images on your website, be mindful that some users won’t be able to see your image or read content placed within an image. All images should have a textual alternative that can be read by screen readers. Alternative text (or alt text) should always be provided for images that are not decorative. Here are some tips for writing alternative text:
To add alt text for an image:
The first example is an image that does not contain text or act as a link. The alt text should just describe what you want people to notice in the image:
Example: This image will be used on a page about track tryouts.
Poor Alt Text: "Harvard Runners."
Useful Alt Text: "Harvard Stadium with two lone runners bounding up the steps."
Alt text for logos should reference the image's purpose. They may or may not include the word logo.
Example: This is the Institute of Technology's classic logo used on many branded materials.
Poor Alt text: "Institute of Technology."
Useful Alt text: "The Institute of Technology's Reaching for the Stars branded logo."
Alt text for icons should be the equivalent to the information intended by the icon, such as “Download PDF” or “Visit our Facebook Page.”
Example: This printer icon will be used on a page with a schedule of events.
Poor Alt Text: "Printer icon."
Useful Alt Text: "Print the Event Schedule."
If the image is being used to link to another page, the alt text should describe what will happen when the image is clicked (rather than what it looks like).
Example: This question mark links to a help page and is intended to encourage users to click if they need support.
Poor Alt Text: "Question Mark."
Useful Alt Text: "Contact Support."
Accessible multimedia (visual and auditory content that is synchronized) must include captions—text versions of speech and other important audio content—allowing it to be accessible to people who can't hear all of the audio.
According to US government figures, one person in eight has some functional hearing limitation, and this number will increase as the average age of the population increases. Beyond people with disabilities, captioning helps people who only partially understand the language presented. Captions are also useful in noisy environments like airports, in quiet environments like libraries, and for multimodal learning.
All multimedia content with speech should have accessible captions that are:
For multimedia, a transcript can also help users who can neither hear the audio nor see the video. Beyond the spoken words, a transcript should include descriptions of important audio information (like laughter) and visual information (such as someone entering the room). Transcripts help deaf/blind users interact with content using refreshable Braille devices.
Transcripts allow anyone that cannot access content from either web audio or video (or both) to read a text transcript instead. Beyond the spoken words, a transcript should include descriptions of important audio information (like laughter) and visual information (such as someone entering the room). Transcripts help deaf/blind users interact with content using refreshable Braille devices. For most web video, both captions and a text transcript should be provided. For content that is audio only, a transcript will usually suffice—captions are not necessary for audio-only media like a podcast.
Transcripts make multimedia content searchable by search engines and users. Screen reader users also may also prefer a transcript over real-time audio, since most proficient screen reader users set their assistive technology to read at a rate much faster than natural human speech.
All documents on the website should have the option to open in PDF along with a Word document. Word documents are more accessibility-friendly because screen-reading software is able to go through the document and read it aloud to the patron. PDF does not comply with accessibility standards and is not compatible with screen reading software.
Documents: Most of us do not think we have a role in accessibility — that is for web designers. But that is simply not true. We make documents every day that we put online for our students. Creating accessible documents (MS Office, Google Apps, PDFs) is key to accessibility for all. It not only makes our work more useful but it can save us time
Questions? Need an account?
Request via IOT-Library@iot.edu