The key idea
A landing page helps a specific person make a specific decision. Its structure starts there.
A blank screen invites us to choose colors, move boxes and test headlines. At Umbral, we start with a conversation: what does the person arriving here need to understand before taking the next step?
Someone discovering a brand needs guidance. Someone comparing alternatives needs details. A visitor from a specific campaign expects to find the promise they just read. One opening cannot answer all three situations equally well.
Before the layout, the decision
Write the page goal as a verb and an object: request a proposal, book a demo, download a guide. Describe who benefits from that action and what they expect to find.
“Get more leads” is a business wish. “Help marketing teams assess whether this service fits their launch” describes a task the page can solve. Also list what you cannot yet claim: unmeasured results, unapproved testimonials and unconfirmed deadlines should not become arguments just to fill a design.
A message that makes sense on arrival
The first section should introduce the offer, its audience and the next step. It can be brief and distinctive while remaining clear. Read only the headline, description and button. If they seem to belong to different conversations, revise the message before adding another section.
For example, a campaign introduces a design service for launches. The landing explains what it includes. Its button says “Tell us about your launch”. These moments form one recognizable sequence.
Design starts working when each section answers the visitor’s next question.
A structure with a thread
Not every page needs the same sections. For a service that starts with a conversation, try this order:
- The proposition. What you do, for whom and why it deserves attention.
- The fit. Which situation you address and when it makes sense.
- The evidence. Work, samples or explanations you can substantiate.
- The process. What happens after contact and what you need to start.
- The questions. Concrete answers about scope and collaboration.
- The next step. A clear action with an honest expectation of what follows.
Remove sections that only repeat the previous one. Do not expect an image to answer an essential question on its own.
Design the mobile arrival too
Narrower columns are only part of the work. Review reading order, headline length and the distance between an explanation and its action. Images should retain their proportions. Forms need visible labels, room to type and useful error messages. Motion should let people read and move at their own pace.
Use the page with one hand, then with a keyboard. This reveals decisions a static canvas cannot show.
A review before publishing
- Does the campaign promise continue in the opening?
- Is the offer clear without the images?
- Is the evidence real and presented with context?
- Does each button describe what happens?
- Does the form explain how information is used?
- Are content and actions available without animation?
These questions prepare you to observe people using the page. The layout may change many times; the decision you want to make easier should guide every version.