Intelligence Community Design System

Section containers align content on the page, which helps to form a constant edge from which to read from. This aids swift readability as a user can scan back to the same position to start the next line of content. It supports standard reading scanning patterns by creating a consistent baseline.

The width of a section container is contrained to a maximum width on large devices in order to keep the line length to a readable size.

Consistent alignment also reduces cognitive load when trying to understand content on a page and helps to associate elements to one another through proximity and symmetry.

We’ve tested this component against WCAG 2.2 Level AA. It’s been tested with NVDA and VoiceOver, and several different users with different interaction methods.