Imagine a service page with its price, restrictions and enquiry process concealed inside twelve identical rows. The screen looks tidy, yet visitors must open everything to understand the offer. This is an editorial example, not a client case study. Compact presentation is helpful only when it does not turn reading into a hunt for hidden conditions.
Separate essentials from supporting detail
Keep the short service explanation, key limitations and clear next step visible. Preparation details, exceptions and definitions can sit in expandable sections. Before designing the page, label each paragraph: does everyone need it, or only some readers? This editorial decision matters more than the shape of the arrow.
A heading should promise a specific answer
“What does website maintenance include?” offers more guidance than “Additional information”. Use your visitor's language rather than internal department names. Begin the expanded section with a direct answer, followed by conditions and a link to the relevant page. Do not make readers open another section to finish the previous thought.
Start with standard behaviour
HTML provides details and summary elements for showing and hiding content. They are a sensible starting point for simple explanations, but still require testing in your target browsers. For a custom disclosure, W3C guidance describes a button, activation with Enter and Space, and an aria-expanded state that reflects visibility. Drawing a plus sign does not implement this behaviour.
Avoid closing an answer unnecessarily
When readers compare two explanations, automatically closing the first can get in their way. For reference material, consider allowing several answers to remain open. If you choose another behaviour, test it against a real task: finding a condition, comparing options or returning to a particular point. There is no universal number of sections that suits every website.
Check before release
Navigate with a keyboard, enlarge the text and open a long answer on a narrow screen. Confirm that focus remains visible, labels are not clipped and expanded text does not cover neighbouring controls. With assistive technology, check that the state is announced clearly. Then read the page with every section closed: can someone understand the essentials without clicking anything?
Our editorial principle is to make the answer complete and understandable before deciding how to display it. An FAQ cannot replace a logical site structure, and it promises no search ranking. For clearer navigation labels, see Links that explain the way.