Navigation

Internal Navigation

Page skip-to links

All pages on the ALA website with one or more navigation bars must include a set of non-visible skip-to links for screen reader users. These links, arranged in a list within a div tag, enable screen reader users to more easily navigate to distinct page sections, including the main page content, the section navigation bar, the site navigation bar, the search box, the footer section, etc.

Page table of contents

Long pages that consist of sections should include at the top a list of internal links to the top-level section headings, to provide a table of contents that helps users navigate within the page.

“Return to top” links

Pages with an internal table of contents may include a "return to top" link at the bottom of each section, or on shorter pages, at the bottom of the page.

Duplication of Links

The left-hand navigation menu (see Section A.3.10) is the primary user tool for finding subsections of http://www.ala.org.

Non-duplication of left navigation menu

Content pages (see Section A.4.5) should not contain, within the content area, lists of links that duplicate all or part of the left navigation menu.

Duplication of left navigation menu on landing pages

Landing pages (see Sections A.4.2 and A.4.3) may duplicate portions of the left navigation menu, because they provide additional information in the form of images, and in some cases, descriptions.

Duplication of individual left navigation menu items

Acceptable duplication of left navigation menu items

Where appropriate to the content, an individual item that appears in the left navigation menu may also appear as a link in the body of a content or list page.

Additional information about menu items duplicated in content

When an item from the left navigation menu also appears in the body of a content or list page, it must be accompanied by additional information about its content.

Labeling Links

Link labels encompass not only the link text but also the title attribute (if any) and any other text adjacent to a link that conveys to users what to expect when they click on the link.

Duplicate links

Multiple links to the same page

When a page contains multiple links to the same page, their link text should be identical and must be similar enough to be recognizable as leading to the same place

Multiple links with the same text

When a page contains multiple links that use the same link text, they must all lead to the same page.

  • Exception: If all such links have a title attribute that distinguishes them, they *may* have the same link text.
  • Example: Placing a “Read more...” link at the end of each of several summary items of the same type is acceptable if and only if each such link has a unique title attribute that clearly indicates what the user will be reading more of.

Link text indicative of linked content

Link text should be identical to, and *must* be indicative of, the title of the content to which the link leads.

  • Exception: Link text *may* be an abbreviated form of the title of the linked content.

Non-display of URLs in link text

Link text *should not* display the location’s URL.

  • Exception: Link text *may* display the URL in a list of links that are expected to be printed or used off line for reference.
  • Exception: News items, such as press releases, that are posted online in a printable format should include the URL below the linked text.

Notice of linking to an external site

For any link that leads to a page on a site external to ALA, the page *must* provide a notice of the external link, both next to the link text and within a title attribute for the link. This is often accomplished with an image, as shown in the example:

  • Example: “Committee Roster Linkarrow.png
  • Consideration: If the notice uses an image, the image should have an empty alt attribute because the link’s title attribute performs that function.

Note: If a link both leads to an external site and opens a new window, both 3.3.4 and 3.3.5 apply.

Notice of opening a new window

For any link that opens a new window, the page must provide a notice of the new window, both next to the link text and within a title attribute for the link.

  • Example: “Committee Roster (will open in a new window)”

Note: If a link both leads to an external site and also opens a new window, both 3.3.4 and 3.3.5 apply.

Labeling links to non-HTML content

Every link to non-HTML content (e.g., PDF files, MS Office documents) must be labeled as such, except for JPEG, GIF, or PNG images. For example, “Minutes of May 2008 Meeting (PDF, 1.2 MB)”. More information on file types is available in Section 4.4.

Use of standard name for non-HTML file type

Links to non-HTML content must not use the file extension (e.g., “.pdf” or “.doc”) to indicate the file type but must use the standard name for that file type (e.g., “PDF” or “MS Word”). (Note that “PDF” is all caps.)

Indication of file size for non-HTML links

Links to non-HTML content should include an approximate file size (e.g., 2.5 MB). (This will give users some idea of how long the file is likely to take to download.)

Links to viewers and plug-ins

Every page that contains a link to content that requires software other than a web browser to view it (e.g., Adobe Reader or Microsoft PowerPoint Viewer) must provide a link (one per page) to a place where the user can download the required software (usually on the software vendor’s website).

  • Example: A page includes one or more links to PDF files and provides one link to the page on [www.adobe.com|http://www.adobe.com] that allows for downloading the Adobe Reader.

Note: The Adobe Reader plug-in to a web browser does not qualify as a web browser for the purposes of this guideline.

Links to members-only content

Labeling members-only content

Links to content that is restricted to members only *must* be conspicuously labeled as such, so that users will know whether or not they can access that content.

Indicating type(s) of members eligible for access

The advisory regarding restricted content must include the type(s) of members who are eligible for access, e.g., “Member Referendum on New Policy (ACRL members only).”

Position of link notes

Link text should include only the name of the link and should not include any notes or advisory messages within the link itself.

Note: Notes and advisory messages will be in the link’s title attribute, as specified by 3.3.4 and 3.3.5.

Addresses in email links

An e-mail link may display the recipient’s email address. It should not, however, display the “mailto:” portion of the URL.

URLs in links

If a page contains a long list of recommended web pages for general user reference, the elements of that list may be displayed as URLs below succinct descriptions.

New Windows

Be judicious in the use of “new” windows. You may use a new window when sending users to offsite resources or when providing forms requiring online submittal.

Directory and File Names

File names are an important factor in helping users navigate a website. The following guidelines apply to both directory names and file names, except as noted

Short, meaningful names

Names should be as short as possible and still convey a recognizable meaning.

Recognized ALA abbreviations

Names must use recognized ALA abbreviations wherever appropriate. See [1] for the list of acronyms currently in use.

  • Example: The directory title "libinfotechassocevents" is easily shortened to the preferable "litaevents" and is recognizable by anyone familiar with ALA.
  • Example: The file name "anconfprog.htm" might better be formed as "annualprog.cfm," since ALA's vernacular includes the usage "Annual" for Annual Conference.

Acceptable characters in file names

Directory and file names *must not* include spaces or special characters, with the following exceptions:

  • Exception: File names for XML and other file types *may* contain underscores and hyphens.
  • Exception: Directory names for @your library promotions may include the at symbol, as special programming was done to make this possible.

Folder and file names in lower case

Folder and file names must use all lower-case letters. Although Collage will allow upper-case letters in file names, lower-case characters in URLs are more usable as they are cross-platform compatible.

  • Example: Instead of "LibraryWorkersDay.cfm", use "libraryworkersday.cfm".

Similar names for similar content

New content that is similar to existing content in another part of http://www.ala.org should have similar names for its directories and files.

Note: If you are developing new content and are not sure whether similar content already exists, you can post a message to collage_info@ala.org. Ask if anyone has similar content and can help you with ideas for naming conventions.

Recurring events & publication years

Directory and/or file names for recurring events and periodicals must include the year or year and month in either the directory or file name using a consistent format. (TBD)

References

Determining a good, usable URL is as much an art as it is a science. Here are a couple of useful articles:

  • Towards Next Generation URLs, Joe Lima & Thomas Powell, [2]
  • URL as UI, Jakob Nielsen, [3]

Asset names and metadata titles for navigation and breadcrumb links

Navigation should be created in title case.