# Two columns

Compare the same six resources.

ID: two-columns
Language: en
Revision: 2
Translation source revision: 2
Canonical: https://jujin.dev/en/catalog/two-columns/

## Concept

Two adjacent regions separate filters from resources.

## Example

All six layouts use the same six resources, labels, and colors. Filter a topic, reverse collection order, open study notes, or narrow the preview. Compare the reading flow while the content stays the same. Reset or reload restores the full collection and original order. Filters sit beside the resource list; guidance follows the list.

## When to choose it

Choose it for documentation with persistent navigation. Sidebars reduce reading width, so stack regions before they become cramped.

[W3C](https://www.w3.org/WAI/WCAG22/Understanding/reflow.html)