7:3 Use a Clickable 'List of Contents' on Long Pages
Strength of Evidence:
Document Type: Guideline
On long pages, provide a 'list of contents' with links that take users to the corresponding content farther down the page.
For longer pages with multiple content sections, create a short and clickable list of the sections at the top of the page. These are often called ‘Anchors.’ Anchors provide a preview of the content, so users can determine if the page contains the desired information. Anchors also provide quick access to the information.
Create a heading for the anchors (e.g., On this page…) to notify users that the links will go to other parts of the page. At the end of each section, create 'back to top' links.
To ensure accessibility, prevent pages from refreshing when users select an anchor link, and do not include a time and date stamp on a page with anchor links.
Bieber, M. (1997). Enhancing information comprehension through hypertext. In C. Nicholas & J. Mayfield (Eds), Intelligent Hypertext: Advanced Techniques for the World Wide Web (pp. 1-11). Berlin: Springer-Verlag.
Farkas, D.K. & Farkas, J.B. (2000). Guidelines for designing web navigation. Technical Communication, 47(3), 341-358.
Haas, S.W. & Grams, E.S. (1998). A link taxonomy for Web pages. Proceedings of the 61st Annual Meeting of the American Society for Information Science, 35, 485-95.
Levine, R. (1996). Guide to Web Style. Sun Microsystems.
Nall, J., Koyani, S.J., & Lafond, C. (2001, January). Lessons learned while usability testing the CancerNet Web site. National Cancer Institute, Communication Technologies Branch Technical Report.
Spool, J.M., Scanlon, T., Schroeder, W., Snyder, C., & DeAngelo, T. (1997). Web Site Usability: A Designer’s Guide. North Andover, MA: User Interface Engineering.
Spyridakis, J.H. (2000). Guidelines for authoring comprehensible web pages and evaluating their success. Technical Communication, 47(3), 359-382.
Williams, T.R. (2000). Guidelines for designing and evaluating the display of information on the Web. Technical Communication, 47(3), 383-396.
Zimmerman, D.E., Slater, M., & Kendall, P. (2001). Risk communication and a usability case study: Implications for Web site design. Proceedings of the IEEE International Professional Communication Conference, 445-452.
Title: Back to top links (anchor links)
Description: When should anchor links and back to top links be used?
Title: Designing Educational Booklets for the Web
Description: This example shows how a contents list worked effectively for an online booklet published by the National Cancer Institute.
Title: Guidelines for Accessible and Usable Web Sites: Observing Users Who Work With Screen Readers
Description: This study explains the potential accessibility issue with anchor links and how to prevent it.