At the core of St. Thomas Libraries web development is:
Decisions about design and content should be focused on evidence, study, and equitable access. User expectations evolve over time and therefore our methods must reflect current best practices. Reviews and reflections must be iterative.
Making content inclusive and equally available to all requires a diverse set of skills, viewpoints, and personal experiences. It cannot be left up to one individual or committee. It takes all of us to create a welcoming online experience.
Always keep in mind the learning goal by getting rid of barriers and keeping the challenge where it belongs.
- CAST: UDL at a glance
Learn more about usability studies and find articles and resources to improve your content and design in the Digital Services SharePoint site for Usability and Accessibility (Library Staff Only)
Buttons, navigation, and links. They all serve a similar purpose and their style and placement on the page can assist the user in understanding what will happen once clicked (and if it is clickable!).
It is up to the designer and developers to make sure buttons and navigation elements stand out. It is up to the content owners to make sure the links in the content part of the page stand out and are usable.
The following list of guidelines is from, and explained in greater detail in, the article "15 Usability Guidelines For Designing Web Site Links" by Justin Mifsud on Usability Geek.
- Be blue
- Be underlined*
- Not be in all uppercase or lowercase characters
- Not consist of generic instructions (e.g. "More", "click here")
- Not start with "e-" or "internet"
- Not look like buttons if they are not clickable
- Not contain made up words
- Not have the same name
- Open in the same window if they link to other HTML pages
- Not open in the same window if they link to non-web documents
- Become highlighted or change colour on mouseover
- Indicate whether they will take the users to a different web site**
- Not contain the company name
- Be long enough to be understood but short enough to avoid wrapping
- Start with keywords
* A more recent article, also on Usability Geek and referenced as updated from with Mifsud's article, supports a different idea: Hyperlink Usability: Guidelines For Usable Links by Cassandra Naji.
** There are plans in St. Thomas LibGuides to implement icons and screen reader text to note that links go outside of a website, open in a new window, or open in a non-web format.
If you are creating a page or guide, make sure to use friendly URLs. They help people and computers identify what content will be on a page when a link is clicked. It also helps in reviewing analytics.
An alt attribute should be used for all images even if the alt attribute is blank.
Need help deciding what to put in your alt attribute? Use the Web Accessibility Tutorial alt Decision Tree!
WebAIM also has a great Alternative Text walk-through that not only helps you decide how to describe images but also how to make your descriptions better for everyone.
The LibGuides content editor does not provide an easy method to add notes on abbreviations. However, if you go into the source view of the content editor you should be able to add the <abbr> tag.
<abbr title="Web Content Accessibility Guidelines">WCAG</abbr>
You can apply the aria-labelledby attribute in HTML source to give lists, images, and other elements context. Think of it as captions.
Sighted users are able to use visual proximity to understand the context of a list or image that is placed just below a paragraph or heading.
Available Games:
But those with screen readers might "skim" the page searching for relevant information and come across the list out of context. Therefore, you can label your list by adding an id attribute to the preceding text and using aria-labelledby in the list element to give it context.
<p id="gamelist-heading">Available Games:</p>
<ul aria-labelledby="gamelist-heading">
<li>Chess</li>
<li>Monopoly</li>
<li>Connect Four</li>
<li>Battle Ship</li>
</ul>
Or, if you are using a heading (h3) tag and want to add a short description using a paragraph:
<h3 id="gamelist-heading">Available Games:</h3>
<p id="gamelist-desc">Games can be checked out for
assignments in the Game Theory department's office
in Gumdrop Hall</p>
<ul aria-labelledby="gamelist-heading" aria-describedby="gamelist-desc">
<li>Chess</li>
<li>Monopoly</li>
<li>Connect Four</li>
<li>Battle Ship</li>
</ul>
During a session for student employee supervisors, when discussing a healthy learning and working environment during COVID-19, a professor said:
Think about everything they have to know and then cut the rest.
Read what Kathryn Whitenton from the Nielsen Norman Group says about cognitive load:
(From Jakob Nielsen on March 14, 1997)
Summary: People read 25% slower onscreen, and they skim rather than read. Web text should be short, scannable, and structured as linked, topical pages.
The 3 main guidelines for writing for the web are:
Is there still a "fold"? Yes and no.
In the above referenced article "Be Succinct! (Writing for the Web) it was mentioned that "users don't like to scroll." The "Be Succinct!" article was written in 1997, and while much of the content still rings true, fortunately it linked to a current (2018) article about "Scrolling and Attention."
Scrolling is a habit that has changed over time, especially with the advent of cell phones. The main takeaway is:
So the time spent below the fold is increasing.
For better or worse, users are now encouraged to scroll more than in the past — but not much more. Information density was probably too high (leading to crowded and busy layouts) in the early days of the web, but page designs definitely tend to be too sparse now.
Content prioritization is still key. Put important, most used stuff at top. Users will scroll to find what they need as long as the page is organized and scanable.
Read the article "Scrolling and Attention" by Therese Fessenden (4/15/2018) Nielsen Norman Group.
What messages are you sending to those with different abilities or experiences than you?
The "House on the Moon" is a short story by William Alexander and was published in the September/October 2018 (issue 24) of Uncanny Magazine: Disabled People Destroy Science Fiction.
A school-aged girl living on the moon is on a class trip to an old castle that was brought up piece by piece from Earth by an eccentric businessman years ago. The businessman has long disappeared and the castle is now a historical monument, but the design and past do not make her feel welcome in such a place.
There is a podcast version of the story read aloud in the link on the magazine's website. The story was also featured and read by LeVar Burton (Roots, Reading Rainbow, Star Trek) on the podcast LeVar Burton Reads (September 30, 2019) available on Apple Podcasts.
