Definition
A situation that arises from difficulty orienting to a DL (text with tooltip) The acronym for digital library (DL) due to its complex structure and unclear layout.
Factors Leading to the Situation
- Complex information presentation: excessive information or features
- Complex information presentation: illogical structure (text with tooltip) A structure of a digital library (DL) that does not present page elements in a logical way.
- Unclear instruction: unclear structure of a DL (text with tooltip) The acronym for digital library (DL)
Guidelines
- Maintain a simple and logical structure.
- Maintain a simple and clear layout.
- Ensure that structural elements are understandable.
Rationale for Suggesting the above Guidelines
DLs (text with tooltip) The acronym for digital library (DL) are commonly characterized by their layered and complex structures and layouts. Inappropriate design (e.g., illogical structure (text with tooltip) A structure of a digital library (DL) that does not present page elements in a logical way. , complex information presentation) further contributes to users’ difficulty in understanding DL structure and layout. For BVI (text with tooltip) The acronym for Blind and Visually Impaired. It refers to BVI users who rely on screen readers to interact with digital libraries (DLs). users, navigating a DL may be challenging, when they are unable to recognize the structure of a DL, thereby failing to take appropriate action in using the library. A simple, predictable, and hierarchical structure is more understandable and appropriate.
Techniques and Methods to Comply with a Specific Design Guideline
1.1. Organize a
DL’s
(text with tooltip)
The acronym for digital library (DL).
structure from general to specific.
1.2. Place the most frequently used information first.
1.3. Maintain a hierarchical heading structure.
2.1. Maintain a single column page layout.
3.1. Assign meaningful titles to sections of a page that describes the content of the sections.
3.2. Present help information to explain a DL’s structural elements.
Features Suggested for Users
1.1.1. General-to-specific structure (See example 1.1.1.a./ 1.2.1.a1.)
1.2.1. Frequently used information at the top (See example 1.1.1.a./ 1.2.1.a1. and 1.2.1.a2.)
1.3.1. Hierarchical heading structure (See example 1.3.1.a.)
2.1.1. Single column layout (See example 2.1.1.a.)
3.1.1. Section title label (See example 3.1.1.a.)
3.2.1. Tutorial/instruction/tips (See example 3.2.1.a.)
Examples of Best Practice
1.1.1.a./ 1.2.1.a1. General to specific structure with frequently used information at the top
HathiTrust’s structure starts from a simple and general homepage to a specific item’s content page (COM1 Figure a1). Its homepage has a simple and general layout and frequently used information with the most important features (e.g., search box and Help) located at the top of the page.
COM1 Figure a1. An example of simple DL structure
1.2.1.a2. Important search results information
The search results list page provides more information and additional features compared to the homepage. Important information (e.g., the number of search results) is located at the beginning of the section (COM1 Figure a2).
COM1 Figure a2. An example of search result information placement
1.3.1.a. Hierarchical heading structure
COM1 Figure a3 show the use of headings for main features and contents such as search results (h1), search features (h3) in the filter section “refine your search” (h2), and item names (h2) in the search results list.
COM1 Figure a3. An example of hierarchical heading structure
2.1.1.a. Single column page layout
If users predominantly access content via mobile devices, the single column page layout offers a more navigable experience such as example of COM1 Figure a4.
COM1 Figure a4. An example of single column page layout
3.1.1.a. Meaningful section labels
The DL in COM1 Figure a5 provides clear meaningful labels that represent the featured Collections Section on the page.
COM1 Figure a5. An example of meaningful section labels
3.2.1.a. Tutorial/instruction/tips
In COM1 Figure a6, the DL presents brief instructions to explain the DL’s structure.
COM1 Figure a6. An example of instruction on DL structure
Examples of Poor Practice
1.1.1.b. Difficulty understanding a digital library structure
According to COM1 Figure b1, the participant noted that the complexity of the DL made it difficult to explore and access potentially useful information. The structure and layout of the DL containing multiple components or sections of varying levels are too complicated for BVI users to comprehend while navigating the DL.
“There’s a lot of good information here, but it’s more complex, unnecessarily complex than the application. I guess laid out in a more complex fashion than it needs to be.” (S1-B-M.web)
COM1 Figure b1. Screenshot of difficulty understanding a digital library structure
Resources
- Croxford, S., & Rundle, C. (2013). Blind people and apps on mobile phones and tablets–challenges and possibilities. In contemporary ergonomics and human factors. (pp. 343-346).
- W3C. (2018). WCAG 2.1 Guideline 3.2 Readable.
- W3C. (2018). WCAG 2.1 Guideline 3.2 Predictable.
- Xie, I., Babu, R., Joo, S., & Fuller, P. (2015). Using digital libraries non-visually: Understanding the help-seeking situations of blind users. Information Research, 20(2), paper 673.