Field Note 02 / Strategy
How do you choose a website navigation system?
Choose the system that matches the visitor's main decision. Use vertical movement for progression, horizontal movement for comparison, guided sequences for processes, and full-page transformations for short, high-impact stories.
01 / Vertical systems
Use vertical movement for narrative progression.
Vertical navigation is the most familiar model. It works well when each section builds on the last: problem, approach, proof, process, and action.
Full-screen snapping can improve pacing, but every chapter must fit its content. Longer information should remain scrollable rather than being clipped to preserve an effect.
Service businesses, hospitality, property, editorial stories, and audiences that benefit from familiar scrolling.
02 / Horizontal systems
Use lateral movement for comparison and categories.
Horizontal navigation creates a sense of moving across a workspace, catalog, timeline, or set of alternatives. It is effective when sections have equal weight or when the visitor is comparing options.
Because people naturally scroll vertically, wheel-down should move right and wheel-up should move left. Visible arrows and labeled navigation must provide equivalent controls.
Architecture, product catalogs, portfolios, technical firms, timelines, and structured case studies.
03 / Guided systems
Use sequence when order carries meaning.
Guided systems work when the visitor needs to understand a process, configuration, or transformation in a particular order. Flip and fold systems add physical presence, but should be reserved for concise stories where transition is part of the message.
- Use a step sequence for onboarding, automation, or complex services.
- Use a flip for two-sided comparisons or decisive chapter changes.
- Use a fold for reveal, transformation, and educational storytelling.
04 / Decision checklist
Match behavior to audience, content, and risk.
- What is the visitor trying to decide?
- Does the content depend on order or comparison?
- Will the audience understand the gesture without instruction?
- Can every action be completed by keyboard and visible controls?
- Does reduced motion preserve the information and navigation?
- Does the system remain clear on a small phone and at 200% zoom?