Most homepages are assembled, not composed. Every team gets a section, every section gets a slot, and the page grows downward until someone says it is long enough. The result is a collage: individually fine modules with no relationship to each other and no cumulative argument.
A great homepage works more like a film's opening than a magazine spread. It has order, rhythm, and intent. Each screen sets up the next, tension resolves into reassurance, and by the time a first-time visitor reaches a product they already understand why it is worth their attention. That is a sequence, and sequences are designed, not stacked.
01 · The difference
Collage stacks. Sequence leads.
A collage asks the visitor to do the work. Here is a hero, some logos, a grid, a testimonial, a founder note, another grid—make of it what you will. Nothing builds. Scroll depth is high effort and low reward, and the page reads as a list of things the brand is proud of rather than a reason to buy.
A sequence does the work for the visitor. It answers the questions a stranger is actually asking, in the order they would ask them, and it uses each answer to earn the next scroll. The difference is not more sections or fewer—it is whether the sections are related. One is a pile. The other is a path.
Scroll depth is not engagement. A visitor grinding through an unstructured page is working, not converting.
02 · Intent
Give every screen one job.
The discipline that turns a collage into a sequence is simple to state and hard to hold: every section must have exactly one job, and you must be able to name it. If a section's job is "look nice" or "we had the content," it is dead weight slowing the page and diluting the argument.
Useful jobs a homepage section can hold:
- Promise — say what this brand makes better, fast, before the visitor leaves.
- Orientation — help a shopper find the collection or use-case that fits them.
- Proof — resolve a specific doubt with real evidence at the moment it arises.
- Desire — make one product feel worth wanting, not just available.
- Reassurance — remove the last friction—shipping, returns, authenticity—near the decision.
When a section cannot claim one of these clearly, the honest move is to cut it. A shorter page that argues cleanly beats a long one that mumbles.
03 · A starting point
A default sequence to adapt.
There is no universal order, but there is a reliable default we adapt to each brand's promise and proof. It usually runs: a promise-led hero that says who this is for and why now; orientation that routes the visitor to the right collection; a proof beat that answers the category's biggest doubt; a hero product moment that creates desire; a deeper story or differentiator; and reassurance that clears the final friction before the visitor heads to a product page.
The exact order bends to the brand. A trust-critical category—fine jewelry, supplements—pulls proof forward. A drop-driven streetwear brand leads with scarcity and energy. What stays constant is that the order is a decision tied to the strategy, not the sequence the theme demo happened to ship with.
04 · Rhythm
Pace it: loud, quiet, loud.
Energy is not how many bold elements are on screen. It is contrast over time. A homepage where every section shouts is as flat as one where every section whispers—the visitor's eye has nowhere to rest and nothing to anticipate. Pacing is what makes a page feel alive.
Build in a rhythm. A commanding hero, then a calmer orientation band, then a punchy proof moment, then space to breathe before the product. Let whitespace and scale do the work of a musical rest. The loud moments only land because quiet ones set them up. This is also where a real point of view earns its keep: one owned accent color or one signature motion, used sparingly at the peaks, does more than constant decoration ever could.
05 · Reality
Mobile is the real edit.
Most of your visitors meet the homepage on a phone, where every section becomes a full, slow scroll and there is no peripheral vision to hint at what is coming. A sequence that feels tight on a wide desktop can feel endless on mobile, because the same content takes three times the thumb-work to traverse.
So we edit the sequence on the device that matters. On mobile, the promise has to land in the first screen without a scroll, the orientation has to be tappable and obvious, and every section that survives has to justify the extra scroll it costs. Ruthless mobile editing is not a compromise of the desktop vision—it is the truest test of whether the sequence was ever really a sequence, or just a collage that looked orderly on a big monitor.
Quick check
Path, or pile?
- You can name the one job of every homepage section.
- The order reflects your strategy, not the theme demo.
- Each section sets up a question the next one answers.
- The page has quiet beats, not constant noise.
- The promise lands in the first mobile screen, no scroll needed.
Compose it, don't stack it.
The homepage is the one page a stranger judges the whole brand by, usually in seconds and usually on a phone. Treat it as a composition with order and rhythm, give each screen a single job, and pace the whole thing so attention builds instead of drains. Do that and the page stops being a gallery of your best sections and becomes what it should be: a short, confident argument that ends at the buy button.