This page describes what your readers actually see when they visit your documentation. Everything you author in the editor renders into a fast, accessible, searc...
This page describes what your readers actually see when they visit your documentation. Everything you author in the editor renders into a fast, accessible, searc...
This page describes what your readers actually see when they visit your documentation. Everything you author in the editor renders into a fast, accessible, searchable site with consistent navigation — so readers can find answers quickly on any device.
Anatomy of a page
A published documentation page has four main regions:
| Region | Contents |
|---|---|
| **Top bar** | Logo, [space navigation](#spaces-in-the-top-bar), search, theme toggle, custom links |
| **Left sidebar** | The navigation tree for the current space — groups and pages |
| **Content area** | The page content, rendered from your MDX |
| **Right sidebar** | The on-page table of contents, plus "Ask AI" and feedback |
The layout is responsive: on narrow screens the sidebars collapse into menus, and the content reflows to a single column.
Spaces in the top bar
Your spaces appear as sections in the top navigation bar — for example Documentation, Guides, API Reference, and Changelog. Readers switch between major sections of your docs here. Each space has its own independent sidebar navigation.
Left sidebar navigation
The left sidebar shows the navigation tree for the current space, built from your docs.json:
- Groups organize pages into labeled, collapsible sections.
- Pages are the individual documents.
- Labels, links, and dividers add structure and external references.
The sidebar highlights the reader's current page and remembers which groups they've expanded.
On-page table of contents
The right sidebar shows a table of contents generated from the page's headings. As the reader scrolls, the current section is highlighted, and clicking a heading jumps to it.
Search
Every site includes fast full-text search. Readers press ⌘ + K (or /) to open a search dialog and find pages instantly across the whole site. Results are ranked and grouped by space.
Ask AI
Alongside search, readers can ask a question in natural language and get a direct, cited answer from the site assistant. It's available on every page via the Ask AI button.
Theme and appearance
The site reflects your branding — colors, fonts, logo, and favicon. Readers can toggle between light and dark mode if you've enabled it, and their preference is remembered.
Code blocks
Code is a first-class citizen on the published site:
- Syntax highlighting for dozens of languages.
- A one-click copy button on every block.
- Tabbed code groups for multi-language examples.
- Line highlighting to draw attention to specific lines.
Links, anchors, and deep links
- Every heading has a copyable anchor link, so readers can share a link straight to a section.
- Internal links navigate instantly without a full page reload.
- External links open in a new tab.
Accessibility
Published sites meet modern accessibility standards out of the box:
- Semantic HTML and correct heading hierarchy.
- Keyboard-navigable menus, search, and tabs.
- Sufficient color contrast (checked against your theme).
- Alt text surfaced from your image markup.
- Respect for reduced-motion preferences.
Performance
Pages are pre-rendered to static HTML and served from a global CDN, so they load fast anywhere in the world. Navigation between pages is near-instant, images are optimized automatically, and search runs client-side for immediate results.
Multi-language
If you've enabled multiple locales, readers get a language switcher and can read your docs in their preferred language, with navigation and search localized to match.