homepage direction
DESCRIPTION
Examples of 'good' homepages.TRANSCRIPT
![Page 1: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/1.jpg)
Overarching Lessons1. Immerse the user in the product from the get-go.2. Communicate benefits and function through clear information hierarchy.3. Be fresh and original.4. Show a 'how-to' explanation which begins above the fold, but doesn't dominate the entire page.5. Have a focused and strong call to action.6. The page should be 'on-brand' -- consistent with the product message, packaging and copy.
Homepages to Learn From
Homepages to Learn From Page 1
![Page 2: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/2.jpg)
GojeeGood: Instant immersion in product emotionBad: Not clear what the product is exactly (a recipe site with gorgeous photos)
Homepages to Learn From
Homepages to Learn From Page 2
![Page 3: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/3.jpg)
AirbnbGood: Gorgeous and immersiveBad: Call to action gets lost (it's in the upper left)
Homepages to Learn From
Homepages to Learn From Page 3
![Page 4: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/4.jpg)
OverGood: Gorgeous and immersiveBad: Product benefits not immediately clear
Homepages to Learn From
Homepages to Learn From Page 4
![Page 5: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/5.jpg)
GrazeGood:
1. Product is front and center -- the only photographed image on the page2. Great information hierarchy - elements other than box photo and call to action take a backseat.3. 'How it works' section header is above the fold.
Bad:
1. A bit boring2. Cluttered
Homepages to Learn From
Homepages to Learn From Page 5
![Page 6: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/6.jpg)
EvernoteGood:
1. Clear explanation of benefits2. Good information hierarchy: Pithy benefit > illustrations > benefit supheaders > detailedexplanations
Bad:
While benefits are clearly explained, how the product works remains a bit mysterious.
Homepages to Learn From
Homepages to Learn From Page 6
![Page 7: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/7.jpg)
DoxoGood:
1. Design reflects the product - homepage for a product meant to reduce clutter is clean and clear ofcutter.2. Video to explain unique product is embedded in the page in an organic way.
Bad:
The above-the-fold how-to section isn't labeled, and doesn't seem to go beyond what's already onthe page.
Homepages to Learn From
Homepages to Learn From Page 7
![Page 8: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/8.jpg)
KashooGood: Information hierarchy; above the fold how-toBad: Looks like a template, unoriginal
Homepages to Learn From
Homepages to Learn From Page 8
![Page 9: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/9.jpg)
BarkBoxGood: Pithy explanation of product; great information hierarchyBad: Product shot is a bit small; page feels a little empty
Homepages to Learn From
Homepages to Learn From Page 9
![Page 10: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/10.jpg)
BirchboxGood:
1. Clear product illustration2. Page has cohesive feel that evokes the product3. Clear call to action
Bad: Feels somewhat generic
Homepages to Learn From
Homepages to Learn From Page 10
![Page 11: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/11.jpg)
SeamlessGood:
1. Product immersion2. Quick, functional call to action
Bad: Cluttered
Homepages to Learn From
Homepages to Learn From Page 11
![Page 12: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/12.jpg)
XeroGood: Makes a potentially 'scary' product seem humanBad: Gives no information about product unless the video is played
Homepages to Learn From
Homepages to Learn From Page 12
![Page 13: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/13.jpg)
BilleoBad:
1. Boring2. Generic graphical elements3. No clear call to action - the 'ZipThru' button is not clickable.
Homepages to Learn From
Homepages to Learn From Page 13
![Page 14: Homepage direction](https://reader033.vdocument.in/reader033/viewer/2022051515/54c5018a4a795994248b4629/html5/thumbnails/14.jpg)
RescueTimeBad: Complicated product not clearly explained.
Homepages to Learn From
Homepages to Learn From Page 14