Overview

As of November 30, 2020 the expandable area Blocks available on www.bates.edu are Expandable Area (formerly BTN) and Foldaway. These two Blocks are among the most popular on our website with 500 Expandable Areas in use and 180 Foldaways in use. The use of this popular technique – concealing content in an area that expands when clicked – can enhance usability when implemented correctly, or hinder usability when implemented incorrectly. The following guidelines provide best practices for how to use these expandable area Blocks.

Examples

+Foldaway

---

1. Use expandable areas to provide pages with supplemental information

The keyword here is supplemental. All essential content such as primary contact information should be immediately visible on the page. On a page dedicated to Dana Scholars, for example, an expandable area is used to house a complete list of past Dana Scholars. In this example, the list of hundreds of student names is supplemental content to the primary content, a text description of the Dana legacy at Bates.

2. Integrate the expandable area with the essential text content on the page

Building off of our first guideline, which distinguishes essential content from supplemental content, our second guideline encourages you to integrate the expandable area with the essential text content on the page. In other words, you want to avoid situations where the only content on your page is a series of expandable areas.

3. Long pages are okay (when organized)

Long pages are okay when their contents are organized clearly with section headers and other organizational features such as the Table of Contents. Web visitors are more likely to scroll than to click, so surfacing content longform can actually provide a better reading experience than concealing large sections of content within an expandable area. If you find yourself wanting to use an expandable area primarily to reduce page length, remember, long pages are okay.

4. Use expandable areas sparingly

You can think of this admittedly broad guideline as a summary of the previous three. Ultimately, you want the default state of your content to be open and accessible to the people who will benefit from it. Since the practice of concealing content within an expandable area is a way of indicating relative importance between the pieces of content on your page, it should be used sparingly.

• Avoid concealing essential information within expandable areas – if the content is important, elevate it.
• Avoid nesting expandable areas within each other – this conceals content too deeply.
• Avoid making pages only with expandable areas – even a small paragraph of summary text will go a long way.

The majority of your content should be open and accessible with selective use of expandable areas to accommodate supplemental content as needed.

A word on guidelines

We share these guidelines as general rules, principles, and pieces of advice. In the world of content strategy, there will be always be exceptions, edge cases, and unintended consequences to the decisions we make about presenting content. We hope that the guidelines provided above help you in making informed and intentional decisions regarding the use of expandable areas.