BookYol

Concept

Website Wireframe

A website wireframe, in Marketing Made Simple, is a fixed order of sections for a small business's home page: a header that says what you offer and how to buy, then the stakes, the value, the guide, the plan, a short explanation, the price choices and a footer for everything else.

Designers use 'wireframe' for any skeleton of a page drawn before the visuals. Miller and Peterson give the word a specific content: a running order that tells the StoryBrand story from top to bottom. The header carries the most weight, because many visitors never scroll. It has to say what the business offers, how that makes the customer's life better and what to do to buy, with one clear button. Below it the page names what the customer stands to lose if nothing changes, lists the benefits they get, shows the business as a guide through empathy and proof such as reviews, lays out a plan of three or four steps, and gives a short paragraph for those who want the full story. Price choices, if there are any, come near the end, and the footer, which the book calls the junk drawer, holds every link that matters to someone but not to the sale. The value of a fixed order is that it stops a page from opening with the company's history. Its limit is that it is a default, not a design: the wording of each section still has to come from the customers' own words.

A real-life example

Ece runs a children's swimming school in Üsküdar. Her home page opened with a photo of the pool and the words 'Since 2009'. She rebuilt it in the book's order. The header now says 'Swimming lessons for children aged 5 to 12, in groups of four. Your child swims a length on their own by the end of term', with one button to book a trial lesson. The history moved to the footer.

How to use it

  1. 1Rewrite the header until a stranger can say, within seconds, what you offer, how it helps and how to buy.
  2. 2Arrange the sections below in the book's order: stakes, value, guide, plan, explanation, price choices, footer.
  3. 3Keep one main button and repeat it, with the same words, at the top and after the plan.