5 Awesome Home Page Design Layouts You Can Copy Today

Last updated on January 15, 2019

Home Page Design LayoutsLet me guess – you’re not a skilled website designer, and you’re building a website and you want to make it awesome.

You’ve come to the right place, my friend!

Building a website that looks great doesn’t have to be super complicated. It can be systematic and logical (not as much “fluff” as you’d imagine) – anyone can do it!

In this guide, we’ll show you the anatomy to awesome, well-designed home pages.  I’ll lay them out in simple diagrams and show you live examples so that even non-designers can understand – and copy!

Choose a website builder and make money online today

What type of site do you want to build?

build a website
build an online store

Why Should I Focus On My Home Page?

Awesome Home Page Design Layouts You Can Copy TodayYour home page is arguably the most important page on your website.

Why? —  Because it’s most likely to be the first page that your website visitors will see when they land on your website.

I think we can all agree that the first impression matters a lot – right?

Your home page sets the tone for your business like a first impression – so makes a lot of sense to ensure your home page works effectively.

Imagine this:

You go into a shop or an office, and you are immediately greeted by a customer service representative.

The customer service rep acted as a guide by helping you navigate the store/office and direct you to the person or product that can solve your problem.

The customer service rep did the leg work for you by showing you where you should be looking to find what you need.

The process and experience were enjoyable for you — you didn’t need to waste time and struggle to find what you’re looking for.

When a customer visits your website, he/she is “walking” into your store or office.

Wouldn’t you want to give them the same level of experience as they would receive if they walked into your physical store or office?

Don’t you just hate it if you had to struggle to look for where a product or information is located?

BUT — there is ONE problem — there is no live person to greet your visitors when they land on your website!

So the question is: “How can I direct my visitors to the information they need without physically guiding them?”

The answer, my friend, is an effective home page layout design.

Your home page layout acts as your customer service rep who diligently guides your visitors around your website.

How does it do that? – Simple:

A well thought out home page design creates a visual trail of breadcrumbs that can effectively guide your visitors to discovering your services/products effortlessly.  The page layout will also direct your visitors to know where to take action and follow through to the next step.

Before we get into what you should include on your home page and show you diagrams of the anatomy of 5 different home page layouts with real examples below, let’s properly define what is an effective home page design.


What is an Effective Home Page Layout Design?

Effective Home Page Designs

Page layout planning helps you figure out what content to place on your page, where to place it and which content should go first.

Building an awesome home page is not just randomly placing any information you can think of onto the page. It’s also not based on abstract concepts, or how you feel that particular morning.

It’s actually very methodical and logical – so everybody can replicate a good layout.

There needs to be a flow so you can guide your visitors to discover your website the way you want them to.

This enables you to craft a very targeted website experience that works best for the specific customers you want to attract.

When done correctly (I’ll show you how below), you can help visitors who land on your website:
  1. Easily identify what your website is about, what you do and how you can provide your visitors with solutions to their problems; and
  2. Engage with your business by figuring out where to take the next step. If your visitors don’t know what the next step is, they’ll probably leave without taking any actions. Next steps could be to visit a product / service offering page, download a guide, watch an informational video, sign up to a newsletter series, submit contact details, etc.

Effective home page layout is all about making your website easy to use and navigate. It allows you to steer your visitors’ focus to things you want them to pay extra attention to.

Let’s get started on what to include in an effective home page, and we’ll dive into some specific examples and layouts!


What Content Should I Include on My Home Page Design?

Let’s be honest — How many times have you landed on a website, and ended up clicking the “back” button because you couldn’t find what you’re looking for in a few seconds?

The fact is that most of us are conditioned to expect to find what we’re looking for in a few seconds. People are becoming more and more demanding (and impatient) nowadays.

Your visitors will make a very simple, split second choice when they arrive on your home page – stay or leave.

How you choose to lay out your home page will affect that decision — and will impact the fate of your business.

Simplistically, the layout of your home page is divided into two parts:

1. Above-The-Fold – content you can see WITHOUT scrolling down when your home page is first loaded.

2. Below-The-Fold – content you only see when you scroll down.

100% of your visitors will see the content Above-The-Fold, as it is the displayed on their computer screen right away.

Statistically speaking, as you scroll down the page, the number of people who will continue to pay attention to your content will drop dramatically.

This is why it’s so important to plan what content your place Above-The-Fold and Below-The-Fold.


1. TYPE OF Content TO INSERT Above-the-Fold

This is where you want to display all your Primary Content – your most important content that you need all of your visitors to see.

The #1 goal of your primary content is to convince your visitors to stay longer to further investigate what you have to offer.  Your primary content must be clear, concise and specific.

Home Page Design Layouts - above the fold

Source: Hubspot.com

Primary Content Breakdown:

1. Headline:

In one single sentence (two at the most), you must answer the question that all your visitors will be asking – “What does your company do?

A good headline will answer this burning question — so it needs to short, clear and describe what you do perfectly.

You want your visitors to read your headline and think – “Hey, that’s me! I need this!

Here is a great example of a simple, effective headline that says a lot:

home page design headline example

Source: Basecamp.com

If you are working on a project with other people and are having the same problem, this headline will get your attention.

It’s nothing fancy, but it gets the message across perfectly.

Pro Tip: If you don’t know what to write, try asking your customers or audience why they visit your website, use your services or products. You can take literally take the words right out of their mouths and use them as your headline.

2. Sub-Headline:

You have an opportunity to define your service/product in a bit more details with your sub-headline.

The brief description should answer – What problems do you solve for me?”

Here is good example of an effective sub-headline:

home page design subheadline example

Source: Leadpages.net

In one short phrase, it tells you how their product can help you.

In this example, their users can use their product to create pages to generate more customers!

3. Primary Call-To-Action:

A Call-To-Action provides directions and asks / tells your visitors to do something – to take the next step.

This can be “call us now” or “click for a free quote”.

home page design call to action

Also, pay attention to Shopify’s headline and sub-headline. Very effective! – Source: Shopify.com

Think of a call-to-action as a direction indicator. We all know how to take direction because we do this every day in the real world.


This sign lets you know you are heading eastbound, and you can get to Redlands by turning right on Exit 40A.

We find these signs and arrows very helpful in our daily life, so why not use it on your website to guide your audience on what to do or where to go?

This is especially true if they want to make a commitment because they resonate with what you have to offer (your headline and sub-headline).

Don’t expect your visitors to know what to do next — they don’t.

You want your visitors to visually see that there is a next step that they can take, so never be shy about telling them what to do in a helpful way.

Imagine this: You find a random restaurant and see a menu by the door. You step inside and you see the host standing there, but he doesn’t say anything.  He doesn’t proactively ask you how many people you have in your party, nor does he attempt to lead you to the seating area.

You end up just standing there, wondering – “what’s next?”

Does that make you feel good and confident about the business?

Does it make the business feel personable and likable?

The key is to actively engage with your visitors — tell them what to do, and guide them to taking action so you can start building a relationship with them.

This can significantly increase your chances of winning new customers.

4. Use Images or a Video to Illustrate Your Message:

People are naturally drawn to visuals like images and videos, so it is a great way to create a mood or show your audience what you are all about.

It is important to remember to use images and videos that are relevant to your website. If they don’t serve any purpose or don’t do a good job in enhancing your overall branding or messages, don’t use them.

It is better to keep your website clean rather than including things that are not useful.

Where to Find Professional Images – see our guide on how to pick the right pictures, and where to find professional images without paying through your nose (a lot of professional quality images are actually free!)

How to Use a Video Background – have you considered using a video background to “wow” your visitors, make your website look more professional and improve your branding? See this guide on how to use a video background the right way, and the do’s and don’ts.

5. Logo:

Your logo needs to do a good job of subtly communicating what your company is about. It hints at the DNA of your business — whether you are professional, creative, aggressive, or laid back.

Logo Creation Guide – If you’re not sure how to create a good looking logo, here is our guide and some tools that can help you (even if you’re not a designer).

6. Navigation Bar:

This is the roadmap you use to show your visitors what’s important and where they can go to get the specific information they need.


  • Only include necessary pages and don’t confuse users with too many unnecessary options.  Your visitors will not be interested (initially) in pages about copyright, privacy, and terms of services. So insert them elsewhere — like in your footer.
  • Create logical groups of related links, with the most important links organized from left to right.
  • Keep page titles short and descriptive.
  • Place your navigation bar in a prominent location so it is easy to find.

Put yourself in the shoes of your visitors and ask yourself this:

What is the least number of steps I need to take before I can make an informed decision to buy your service or product?

2. TYPE OF Content TO INSERT Below-the-Fold

As mentioned above, not everyone will scroll down your home page to view more of the page.

Your visitors who will actually scroll down your home page to see more are those who are interested in what you have to offer after reading your headline and sub-headline (your Above-The-Fold content).  

Otherwise, they would have left your site already.

So, the type of content you want to insert Below-The-Fold is to support your Above-The-Fold content (what you offer and how you can solve your customers’ problems).

Here are the 2 types of content you should display Below-The-Fold:

1. Secondary Content: Content that is not important enough to make it Above-The-Fold, but is still crucial to convincing your visitors to become customers or loyal followers.

2. Additional Content: These are the “nice-to-have” information, but are not critical in making your website effective for making a strong first impression.

Let’s dig into more specific details about these Below-The-Fold content.  Afterward, we’ll show you 5 effective home page layouts that you can imitate.

#1) Secondary Content Breakdown

Secondary content reinforces your Primary Content (Above-The-Fold).

The goal is to convince and educate your visitors on what exactly they’ll get out of using your service or buying your products.

1. Benefits List:

Here’s a common mistake – most websites are focused on listing out a lot of features and don’t focus enough on describing the benefits to potential customers/readers.

There is an insightful saying in marketing – “Features tell, benefits sell.”

The main question your visitors will ask is, “so what’s in it for me?” — “Why should I eat at your restaurant?” — “Why should I hire you as my photographer?”

If you landed on a website and all you see is a big list of features, like “we have 20 sandwiches, 15 salads & 5 kinds of soups….“, or “we provide you with 100 pictures on a DVD & a physical album….

You’ll end up just being another restaurant or photography business website. Nothing makes your website visitor want to find out more about you.

Focus on how your visitors will benefit from you – For instance, “organic, farm to table ingredients so you feel healthier and live longer”, or “kids grow up way too fast – we’ll help you capture those precious moments and memories with your first child.”

Notice that benefits tap into the emotional side of people – because it works.

Here is a good example of describing benefits from Basecamp’s home page (Basecamp is a project management software that helps teams manage a lot of back & forth communications):

home page design benefits list

Source: Basecamp.com

They first list out all the headaches and pain points that their potential customer might have (to relate on an emotional level). Then they make the promise (benefits) that with their software can make all those problems go away.

Outlining benefits don’t always have to be solving a specific problem. It can also be inspirational like how great it will be to take a road trip with your family in a brand new car!

The key here is to show your audience how their life will change for the better with what you are providing them.

Pro Tip: Listing out features are only helpful after you convince your visitors that you can benefit them tremendously. Don’t unload a boring list of features on your visitors. Focus on communicating how your visitors can truly benefit from you.

2. Trust Indicators:

Trust indicators can be customer success stories, customer testimonials or quotes, professional accreditation (industry association affiliations, Better Business Bureau score), media quotes, the number of social network shares, and display personalized blurbs about your team members to create trust.

People buy from people or businesses they like and trust.

So by showing other people like you and your brand, you can boost your credibility and trustworthiness.

The key is here is to positively associate your business with external parties and show that your business is operated by people, not robots.

Trust indicators are very powerful to help bring your visitors one step closer to becoming customers — especially when they are close to crossing that line, but they just need a gentle nudge.

Remember – people like to follow other people. So when they see others (just like them) do business with you, they are more likely to follow.  Why do you think we constantly look up reviews on different services or products?

3. Features List:

Features list helps your potential customers know what EXACTLY they are getting when they make a purchase.

List out your most compelling features that your visitors will want to have.

One of the biggest mistakes I see people make is that they list out a long laundry list of features that don’t relate to me as a customer.

Even when the features may sound interesting, I could care less if the features don’t solve my problem or answer my needs.

For example: When I go on to Volkswagen’s website to research for a new car, I don’t get a mind-numbing list of features like electro-mechanical power steering with variable assistance. While this is an important feature, it is not something most car buyers cares about.

Instead, you get sold on features like infinity moonroof and 10-speakers surround sound audio system. These are the features that people care about and are what will eventually sell the car.

home page design features list

Volkswagen Touareg 2016 moonroof – Source: vw.com

Think about what features will resonate with your audience and remove the extra features that won’t make a major impact on your home page.

Pro Tip: If you have a lot of features to list, instead of listing them all, pick the top 10 to insert into your home page.  For the other features, create a separate, dedicated features page where your visitors can view the entire list of features there.


#2) Additional Content Breakdown:

These are the “nice-to-have” information but are not critical in making your website effective for making a strong first impression.

For example, blog articles, company announcements, event schedules, industry updates, location map (if you are not in the restaurant business).

Such content does have a place on your website, and if placed in the appropriate location, can help complete the overall picture what your business is about. But if they are used incorrectly, they can create clutter and confusion.

Now that you know what you should include in your homepage, let’s see how you can position your content to create an awesome experience for your visitors!


Anatomy of 5 Effective Home Page Layouts &
Example Templates You Can Use Today

I’m going to share 5 very effective home page layouts with you below. The diagrams break down each Above-The-Fold and Below-The-Fold component.

You can follow these layouts to optimize your home page. If you are using a drag & drop website builder, you will be able to easily drag your content around to imitate the layouts as shown in the diagrams below.

I’ve also listed out some example templates below, where the home pages are already effectively configured.  You can click through to take a look at the actual templates and you can sign up and start using one right away.

In a way, using one of these templates is a short cut, as it allows you to get a head start since the templates already embody some of the best practices I’ve discussed above!

Layout #1

This layout is pretty universal so it can be applied to pretty much most industries.

home page design layout

Click to enlarge image


Template Examples: Here are some templates that have this type of home page layout design. You can click through to see them, sign up and start using them right away.

good homepage design wix example
good homepage design shopify example
good homepage design squarespace example
good homepage design wix example
good homepage design wix example
good homepage design wix example
good homepage design wix example
good homepage design wix example

Layout #2

This layout is also quite universal and so it can be applied to most industries.

home page design layout

Click to enlarge image


Template Examples: Here are some templates that have this type of home page layout design. You can click through to see them, sign up and start using them right away.

good homepage design wix example
good homepage design wix example
good homepage design wix example
good homepage design wix example

Layout #3

This layout is also quite universal and so it can be applied to most industries.

home page design layout

Click to enlarge image


Template Examples: Here are some templates that have this type of home page layout design. You can click through to see them, sign up and start using them right away.

good homepage design wix example
good homepage design wix example



Layout #4 – Portfolio & Photography Websites

This layout is suitable for creative businesses

(photographers, designers, artists, musicians and illustrators)

home page design layout for photography portfolio websites

Click to enlarge image


Template Examples: Here are some templates that have this type of home page layout design. You can click through to see them, sign up and start using them right away.

good homepage design wix example
good homepage design squarespace example
good homepage design wix example
good homepage design wix example

Layout #5 – Food, Health & Beauty Websites

This layout works well for businesses that benefit more from visual communications (less so from written content)

(Restaurants, spas, salons and cafes)

home page design layout for food health beauty websites

Click to enlarge image


Template Examples: Here are some templates that have this type of home page layout design. You can click through to see them, sign up and start using them right away.

good homepage design wix example
good homepage design wix example
good homepage design wix example
good homepage design wix example

choosing website template designsStill Having Struggling to Choose the Right Template For Your Website?

Choosing a template to design your website can either be a lot of fun, completely overwhelming or for most people – somewhere in between.

We have a set of criteria we use when making template design suggestions, to help you sift through all the design options.

View Post


Conclusion & Take Away

Awesome Home Page Design Layouts You Can Copy TodayEffective home page design is not just about looking “pretty” — it’s about how easy it is for your visitors to understand what you do, what problems you solve, and how they can benefit from your services or products.

NEVER leave it up to your visitors to guess or figure out what to do next. Instead, create a very clear Call-To-Action on your home page that directs your visitors to take the next step (such as to go to your product / service page, sign up to your newsletter, download a guide, contact you, etc).

Constantly ask yourself if your visitors fully understand what you do and what benefits you bring to the table.  Focus on outlining benefits of how you can help your visitors – avoid dumping a list of features that can’t quite connect to your visitors on an emotional level.

Don’t use complicated vocabulary or vague descriptions — be concise, be straight forward.

Keep in mind that you won’t get the “perfect” home page design on your first attempt.  It’s okay to keep working on improving upon it.  Collect feedback from people to see how you can improve.

Lastly, take a look at the template examples I shared above — instead of designing your own home page, those template examples can give you a head start to crafting a great looking and effective layout!

Your visitors may not always find your services / products helpful, but they should never misunderstand what your business offers.

Found This Guide Helpful?

Question – Did this guide benefit you? Leave a comment below. 

Do you know anyone who can benefit from this guide? Send them this page or click on the share buttons on the left.

You’ll be helping us out by spreading the word about our website, and you’ll be helping them out!


About Connie

Designing and creating your website (especially your first one) is not a simple task. If you're a designer like me, then you're already way ahead of the game. But what if you're one of the 99% of business owners who are not technical or creative? I want to share my website design expertise with you to help you build a professional looking website to grow your business.



About Connie

Designing and creating your website (especially your first one) is not a simple task. If you're a designer like me, then you're already way ahead of the game. But what if you're one of the 99% of business owners who are not technical or creative? I want to share my website design expertise with you to help you build a professional looking website to grow your business.

Leave a Reply

101 Responses to 5 Awesome Home Page Design Layouts You Can Copy Today

  1. #

    Thank you very much,,,this is very helpful to me to get a start ,designing my first web site.

    • Lucy Carney

      Hi Krishantha,
      I’m so glad you found this article useful – best of luck designing your website!
      Thanks for commenting, do come back and let us know how you get on –

  2. #

    First time leaving a comment, just to say what a wonderful website this is. Nicely organized and educational, thank you so much!

    • Charlie Carmichael

      Hi David,

      Thanks for such positive feedback! Feel free to share any of our articles on social media – you never know who else they may help.


    • #

      I agree, great job!

  3. #

    Hello Connie , your blog is so helpful. You have focused on such a great point. Home page design layout is very important factor for our website. I love this post. Thanks and keep posting.

    • Charlie Carmichael

      Hi there,

      Thanks so much. We work hard to provide our readers with quality content and expert analysis so it’s always nice to get positive feedback!


  4. #

    Good incites for a beginner like me who is a non techy/non creative.

    • Charlie Carmichael

      Hi Hormazd,

      Thanks for your comment. We’re glad you found the article so helpful. Best of luck!


  5. #

    Nice info! For Web Designs Guidance.
    Thank You For Sharing.

    • Charlie Carmichael

      Hi Connie,

      Thanks for the nice feedback. Best of luck!


  6. #

    A nice read on simple web page design.
    Nicely written and very clear.

    • Natasha Willett

      Hi Leslie,
      Pleased to hear you enjoyed the article and welcome to the community!

  7. #

    I’ve read this post several times, it should be the best article now after I’ve read top 100 articles about homepage layout design. Great job.

    • Charlie Carmichael

      Hi there,

      Thanks for the positive feedback. Feel free to share it on your social media – you never know who else it may help!


  8. #

    very helpful for me to design my homepage, great job, Tks.

  9. #

    Very beneficial website design layout

  10. #

    Nice info! For Web Designs Guidance.
    Thank You For Sharing.

    • Charlie Carmichael

      Hi Michael,

      We’re glad you enjoyed the article, feel free to share it across your social media – you never know who else it might help!



  11. #

    Best website designing layouts ever. I am offering web designing services online at GoingIT in Melbourne, and I would add these type of layouts for my business partner’s website. They definitely like these layouts. Really Appreciated.

    • Natasha Willett

      Hi Brenda,
      Cheers for the comment really pleased to hear you both enjoyed the article and agree with our choices.

  12. #

    Thanks for sharing post…..

  13. #

    thankxxx for sharing useful info!!

  14. #

    thankxxxx for ur comment!!!

  15. #

    Wow!! I am so glad to see this awesome homepage design layout you have shared here. With this layout, we can build amazing websites of our choice. Since i am working in this industry, the layout designs you have shared here was very useful for me.

    • Natasha Willett

      Dear Chriss,
      Thank you for your comment and welcome to the community. It’s great to hear that you have appreciated the article, please do feel free to share with others who you think may also benefit from the content.
      All the best,

  16. #

    Wonderful article! Great advice for creating a business website!

  17. #

    My brother suggested I might like this blog about web design. He was entirely right. This post truly made my day. You can not imagine just how much time I had spent for this info! Thanks!

    • Lucy Carney

      Hi William,
      Thanks for the great feedback! I’m so glad you found this article helpful and enjoyed reading it – feel free to share it on if you think others might find it useful too!

  18. #

    This is actually one of the best articles I have come across when it comes to designing one’s homepage. Forget the templates that is highlighted in similar articles. The article has covered buyer psychology and persuasion tactics that is the skeleton of building a homepage.

    Normally, people just try to emulate other homepage designs not knowing why those elements are placed there and get stuck if they don’t have said element piece.

    • Natasha Willett

      Hi Muthoni,
      Welcome to the community. Thank you for the comment, really pleased to hear that you enjoyed it! Please do feel free to share with others who may also find it interesting.

  19. #

    Best website design is very essential part for improving a website. It also helps to generate your website.
    You can reach such a position with the help of best website design, it’s possible to increase popularity by doing best website design.

    • Lucy Carney

      Hi Nathan,
      Thanks for your comment! It’s true that design is very important for maximising your website’s success, and as the article shows it doesn’t have to be difficult either!
      Hope you found the piece helpful and thank you for reading,

  20. #

    Hey Connie, Awesome tips for me. Love to read. As we are a real estate firm in Sunshine Coast, we are currently started working to build a website to establish our business through online. Here I got great tips to implement in our designs. Thanks for sharing.

    • Natasha Willett

      Hi Stephany,
      Thank you for the comment and joining the community. I’m pleased to hear that you both liked the article and found it useful.

  21. #

    Very helpful content..!

  22. #

    Really awesome post on “Awesome home page design layouts”…

  23. #

    You have shared the dominant guide for choosing a quick home layout. Entire design ideas are really good. Thanks for sharing.

    • Fred Isaac

      Thank you Nelson, good to hear you found our guide useful!

  24. #

    So glad to read such an article for the one who really want to design a very good webdesign pages. What Content Should I Include on My Home Page Design? is the useful tips i really enjoyed, and thanks for the template designs it was of great use to me, share more ideas of these kind.

  25. #

    I have been searching for tips on designing a website and homepage for a while, and this is brilliant. It really gives a clear and concise picture of what is required to get started – and NO fluff! I appreciate your work and roadmap. I am a developer who needs to make websites responsive and code without a builder, but this takes all the guesswork out of the design piece of the puzzle. Thanks for removing so much of the mystery. All the best to you and your staff!

  26. #

    Looking great! It is really helpful, keep it up….

    • Fred Isaac

      Thanks Vinay!

  27. #

    What a great article! Explained in such a way that everything about my website just makes sense. Thank your for taking the time to enlighten this ignoramus.

    • Fred Isaac

      No worries Elsable, thank you for the comment!

  28. #

    Job well done & Commendable.

    • Fred Isaac

      Thanks Bolarinwa!

  29. #

    woah, great article, thank you for this, i can learn from you.

    • Fred Isaac

      Thanks for the comment! Glad to hear you found it useful!

  30. #

    Thank you!
    Great article discussing customer flow intent and logical layout examples.
    I will be revisiting and rereading many times over especially when it gets closer to seeing my next design layout into stone.

    Really well written!!!

    • Fred Isaac

      Hi Jorz, thanks for the comment. Good luck building your website.

  31. #

    Best article I ever read. I don’t have any word to say to..But Thank you!!!!

  32. #

    This is such a great article with such great insight so thank you! I’m actually currently looking into moving my shop online and even though I’m really excited about it – I’m also really nervous as I really want to make it work – it could be a massive game changer for my business! So I’ve been doing a lot of research and doing a lot of reading online and I read an article which said something along the lines of how it’s important to create a product feed? Does anyone know anything about this specifically? I’m really lost with this side of online retail so any insight would be amazing! I did read about a company called Taggr that do this – has anyone heard of them? Would they be a good company to go through for that kind of thing? I really want my online business to take off so any tips would be massively appreciated. Thank you everyone!!!

    • #

      Hi Isabel,

      Thanks so much for your comment, I’m glad you found the article useful!

      Yes, product feeds are super important for online stores, however any good ecommerce builder will offer this feature as standard. We haven’t tested Taggr, but here’s a list of our top six ecommerce builders. All of them offer product feed options, but have different pros and cons depending on your needs.

      Good luck with your site!

  33. #

    Great GUIDELINES – makes it a pleasure to get that front page just right! …cause you have so much to share – this helps tremendously to sort what goes where!

  34. #

    it’s awesome

  35. #

    Thanks for the tutorial. Its explained complex topic and concepts using simple words.

  36. #

    Excellent site very useful information.

  37. #

    This is a brilliant article. I’ve always found website design hard to grasp but now I feel I’ve been welcomed into the fold of people who know what they’re doing.

    • Tom Watts

      Hi Edalia,

      Welcome to the fold! Great to hear you found the article so interesting.

      Thanks for reading and good luck with your website building journey 🙂

      – Tom

  38. #

    Great job!! This article is really helpful …Now I know i have to focus on my home page layout ..THANKYOU.!

    • Tom Watts

      Hi Rahi,

      You’re most welcome, I’m glad to hear it’s proven so useful to you.

      And yes, I’d recommend working extra hard on your homepage as it is a great opportunity to make an instant impact on your visitors! So this makes it especially important.

      Best of luck with your designing,

      – Tom

  39. #

    Really helpful!

    Gotta implement some of that advice 🙂


  40. #

    really thank you for your Effort ,love it.

    • Tom Watts

      Hello Amira,

      Great to the discussion was helpful/

      Feel free to share on your social channels if you like – you never know who else might benefit!

      Thanks for reading,
      – Tom

  41. #

    Our non profit board of trustees is about to build a website with a consultant. I’m hoping this article will help guide the discussion among 12 very opinionated people with distinct views in things. .
    One can hopes at least,



    • Tom Watts

      Hi Larry,

      It sounds like you’ve got a bit of a big project ahead of you – so hopefully everyone will be agreement with your proposals.

      It might also be worth having a look at our website builder comparison chart, which will give you a few different platforms to consider.

      Hope that helps,

      – Tom

  42. #

    I don’t usually comment on articles but this deserves one. Clear, direct and very informative.

    • Tom Watts

      Hello Shara,

      Thanks for leaving a comment, we really appreciate it!

      It’s good to know you found the discussion informative and helpful.

      Thanks for reading,
      – Tom

    • #

      Yes You are right, this post is clear on topic.

  43. #

    One of the best article I have read on this topic.

    • Tom Watts

      Hi Aj,

      Thanks for the feedback.

      Feel free to share on your social channels – you never know who else might benefit!

      – Tom

  44. #

    good place to enhance design of home page

    • Tom Watts

      Hi Suresh,

      Great to hear you found the discussion useful!

      Thanks for reading,
      – Tom

  45. #

    The summary is good and every point is logical, Nice post

  46. #

    Hi there,

    Thank you for the great article. Do you have articles like this focusing on other website pages? It’s hard to find articles which tell you what to include on each page from a marketing perspective and I would like to learn more about website design as a whole.



    • Tom Watts

      Hi Chris,

      Thank you for reading and for the kind feedback, always great to hear that our content has proven useful!

      If you’re looking for more web design focused articles, I’ll point you in the direction of our web design tutorials page, which should give you a few more ideas.

      Otherwise, the best advice I can give is to research some websites similar to the one you want to create as well as some websites that you enjoy the look and feel of, then make a note of which features and elements are included on each, then work on a design incorporating your favourite elements from both type of site.

      Hope that helps!

      – Tom

  47. #

    The best example for an attractive and convincing article – great!

  48. #

    This is clearly the best intro to layout design. You Sir, are my hero! Thank you!

  49. #

    Just what I needed as an intro to home page design. Well laid out article too.

    • Jeremy

      Thanks, Jonny. I’m glad this guide is useful to you.

      Please do share it with others who you think might find this guide helpful! I’d really appreciate it.


  50. #

    This tutorial on website design came at exactly the right time. Thanks for the detailed and authorative presentation.

  51. #

    Your website design tutorials really helps me a lot in creating my own website like a pro! Thank you very much.

    • Jeremy

      Hey Gloria,

      Thanks for your comment! We’re super thrilled to hear that you’ve found this tutorial helpful.


  52. #

    Ms. Connie,

    You have enlightened me into so many factors I wasn’t aware of.

    Thank you very much and god bless you.

  53. #

    Connie, your whole explanation. The intro the sections and summary super clear! In a few seconds, one must know what your site is about.

  54. #

    I would suggest that the majority of visitors will arrive at an article inside the website, rather than landing on the homepage first. I recently reformatted my articles slightly. I’ve broken down long paragraphs into slightly shorter ones. I have put subheadings on paragraphs to make sure people know exactly what they are reading without having to read the small text first. Not sure how much more you can do on an article within the website, like a page within a book.

    • Jeremy

      Hello Penn,

      You’re right. In a lot of cases, a lot of people will find your website through an “inner” page rather than the home page.

      However, if your visitor enjoyed reading your webpage, he/she just might go to your home page to find out more about your website and/or to find other interesting discussions on your website. So from that perspective, it’s also important to design a good home page layout so you can guide your visitors to other parts of your website!

      Further, if people find your website helpful, they’ll generally pass along the home page website address to others. Sure, if they email / share your webpages, they’ll share the exact webpage. But when I (personally) talk about certain websites with my friends, I generally pass on the home page webpage address.

      As for optimizing your webpages, you’re doing the right thing! Breaking down your text into smaller paragraphs is a very effective way to make your webpages more readable. Also, using titles and sub-titles breaks up the content neatly so it’s easier for your visitors to consume.

      I’d suggest no more than 5 lines per short paragraph, if possible. You can also use images to break up your text a bit more, so it’s easier for your visitors’ eyes. Also, consider bolding certain phrases to highlight key ideas. A lot of your visitors will be scanners instead of readers. So having good title / sub-title structure, shorter paragraphs and bolded content to highlight important ideas will be very helpful!

      You’re on the right track!


  55. #

    Thanks Connie, I was wondering if cloning a SquareSpace template for he homepage would be possible using Wix. A sleeker homepage design is a plus but Wix covers many other areas than just aesthetics for me. Loving this site, you and Jeremy make a perfect team! I will implement these ideas on my non-home pages.

    • Jeremy

      Hey Daniel,

      I suppose you can try to craft a design that’s inspired by some Squarespace designs. Wix is a pure drag and drop builder that has a lot of tools to help you do that, though the final product won’t be exact.

      At the end of the day, you’ll have to decide whether the design from Squarespace is more important than the other aspects of Wix (which you enjoy using).


      • #

        Thanks Jeremy, I’m on day 4 of the trial on SS and I’m getting used to the UI. Seems pretty straight-forward and I’m loving the style. However, I am uncertain about the SEO optimization tools. What is your overview on the difference between the two? Also, what would you suggest I do to boost my SEO ratings. This will be a portfolio of previous construction renovation jobs.

        • Jeremy

          Hey Daniel,

          Good to hear that you’re getting used to Squarespace’s user interface.

          Regarding SEO, have a look at our website builder comparison chart (have a look at the footnote in that discusses SEO) and also our guide to website builder SEO.

          Hope you’ll find those discussions helpful.


  56. #

    Great article!

  57. #

    I found your website just yesterday and I have found so much useful content that I’m blown away! This article and many others have given me the information I need to actually build my website, finally! Your website is a invaluable resource and I’m sure I will continue to use it after I make my first million! Haha! Seriously though, your website is amazing and I thank you for all the great articles full of information!

    • Jeremy

      Thanks, Danette!

      Please do share our guides with people you think that will find our discussions helpful. You can also click on the social sharing buttons on the left side to get the word out! I’d really appreciate it!


  58. #

    Manna from heaven, Thank you for the amazing content.

    • Jeremy

      Thanks! Glad you found our discussion helpful!


  59. #

    OMG, fantastic stuff! There’s a lot there (a lot of components to each layout), so still a *bit* overwhelming … but you have finally demystified the morass that is the thousands of templates to choose from! Bless you, Connie – this is *so* helpful!

    • Jeremy

      Thanks Wendy!

      It was extremely challenging for us when we first started out. Information overload – for sure. Should we place content here? There? What are other websites doing?

      This is just a guide that we “wished” we found when we started out 6 years ago. These diagrams would have helped us outline layouts while removing all the noise (images, text, etc).

      It would have saved us a lot of time. So we thought it would be helpful to compile our experiences to share them with all our readers!

      Glad you liked it!

      Connie and Jeremy

      • #

        Hats off to you! This was a very simple and well thought out explanation that has given me more useful information than all the hours I have previously spent googling ideal home page layouts!

        I would love to have more of these layout ideas. I am going to show these options to my clients who have never built a website to better explain what needs be on the home page!

        • Tom Watts

          Hi Mcihele,

          It’s great to hear you found the discussion so handy.

          Hopefully your clients can benefit from these layout ideas too!

          Please feel free to share on social channels if you think others could benefit too.

          Thanks for reading
          – Tom