It is important to make good use of the space on a webpage. You need to ensure that content is not too crowded and cluttered, but that users can still see the various topics and navigate easily to the content they want.
Content extension devices allow content to be ‘hidden’ so that users can see a list of headings or sections but do not need to scroll through lengthy content to find everything.
The advantages of using content extension devices are that:
scanning becomes easy – users can scan the main headings quickly, and see the main topics covered without being bogged down in detail
websites are decluttered – tidying lengthy blocks of text away into expandable sections can compact the page and make for a more professional-looking layout
users stay on the page – selecting an extension device does not interrupt the flow of the text or disorient users by taking them off the page
different audiences are catered for – individual users can access all the main points by scanning the headings, then expanding just the sections that interest them.
Types of extension devices for digital content
Websites use different types of devices to allow content to be extended:
Expandable sections. These are lists of headings within the main page that expand in a panel within the page when they are selected. Expandable sections are also known as content expanders, collapsible sections or accordion panels. Users can also use an ‘expand all’ command to access all panels without having to select many items. Expandable sections can be designed so that just 1 panel is open at any one time – when panel A is already open, expanding panel B will collapse panel A, helping users to focus on the newer topic. Alternatively, a ‘collapse all’ command will close all expanded sections on the page.
Content toggles. Extra content can be flagged in a sidebar table of contents. A plus sign toggles with a minus sign to open and close a list of subtopics in a drop-down panel. Up and down arrows are also used. The content toggle is a space-saving way to alert users to additional information and allow them to view it.
Linked content list. If you have lengthy text on a page, you can provide a list of sections at the top of the page. Users can scan the headings to decide whether to go through the content systematically in the given order or select a heading to jump straight to content lower down the list.
Tips for using content extension devices
To ensure that content extension devices support effective navigation in your site, pay attention to the following:
Give enough information for users to make a decision. The text in the extension device should let users know whether selecting it to see the full text is likely to fulfil their needs. Clear language and labels are more effective than cute, catchy headings.
Ensure that essential details are not lost. Extension devices make it easy for users to scan for general topics, but hard to dig out specifics. Make sure that essential information that users are likely to be seeking is not hidden in an expandable panel or at the end of a long page.
Clearly mark content extension devices. Use symbols or links that users are likely to recognise, such as an arrow, a rotating triangle, or plus/minus sign indicators. They should be a reasonable size so that they stand out from the text, and not be fiddly for mobile users to operate.
Keep page lengths reasonable. Content creators can get carried away when using extension devices and put too much content on 1 long page. Consider whether the information would be better broken up into separate pages.