Last updated:
Let’s dive into planning an amazing homepage for your brand-new website! In this lesson, we’ll help you figure out the most important information to showcase on your homepage, making it the perfect starting point for your online presence.
Before you jump into designing your site, it’s crucial to allocate sufficient time for planning, as it’s the backbone of the entire process. To make the process easier later on, we recommend saving your plans in a document. That way you can access the information when needed, plus, it’s a great way to stay organized!
The homepage of your site serves:
- as an entry point to the important areas of your site
- to showcase who you are (your brand) and what you do
- to encourage visitors to explore and stay on your site
- to move visitors toward your goals (as well as their own goals)
When you’re starting with a brand new site, you can use your homepage to provide a glimpse of the exciting content and features that visitors can anticipate before the rest of your site is even designed and launched, while keeping the end goal purpose in mind.
Yes, this means you can plan, design, and publish just a homepage, before you spend any time working on the rest of your site. This approach allows you to create a compelling and informative homepage for both visitors and search engines, which can be launched immediately.
It helps to think of your homepage as a series of sections. This makes it easier to organize and prioritize the content. This lesson breaks down those sections for you so you can more easily plan your content, which will then help you to plan your design layout.
There are different ways to create a homepage. You can:
- Design your own Default Homepage template as covered in our Quick Launch course.
- Edit the Default Homepage template provided by your theme in the Site Editor.
- Create a Custom Homepage by pairing a published regular page with a multi-use template and assign it under Settings > Reading↗︎.
For visual learners, our Compelling Homepages webinar replay can help to bring together the idea of what a compelling homepage can look like. While this webinar is demonstrating how to create a Custom Homepage, the theory behind what to include and how to structure it remains the same for any type homepage.
But for now, let’s focus on what information you’d like to include on your homepage when you’re ready to design it.
Instructions:
For each section below, think about the specific information you want to include for a given component of your website, and add it to your planning document.
Ultimately, you can include any content you want in the header section of your website. Often, this header will be repeated on all other pages and/or posts throughout your site. However, you can also create custom headers for different types of content when needed. Below are some common components included in headers, but each item is optional and can be customized based on your needs.
- Site Title
- Site Tagline
- Site Logo
- Navigation (site menu)
- Search
Your site header is a good place to include a Hook as well. You could even use your Site Tagline for this. A hook should be a single sentence (or even just a few words) that elicits some kind of emotion in your visitor. Using a Heading block for this line and making sure it includes a primary keyword for your site will also help with SEO.
The best hook and emotion will depend on your niche and audience. So spend some time researching other blogs in your niche and getting to know your audience.
The Site title, along with the Site Tagline, defines your website or blog’s identity in search engines and social networks. It’s what people see when they get a preview of your site in search results or in posts on social networks like Facebook, Twitter, and LinkedIn.
The overall purpose of your site will determine how you use this section, which is also referred to as the Welcome or primary call-to-action (CTA). Would you like your visitors to take a specific action? If not, that’s okay! In many cases, a welcome message that clearly communicates to visitors that your site will meet their needs is enough.
- Background image (optional)
- Welcome message (brief)
- Primary action you’d like visitors to take (optional)
- Button that will link to the action (optional)
This section should include a brief description of what your site is about and why it matters to your audience. Make this message about them not you!
Tap into an emotion: happiness, fear, frustration — use “you” statements, make it about them, and show why your website will solve their problem or satisfy their need or desire.
It’s worth noting that Sections 1 and 2 can be combined into one section if desired! This larger header is often done when you want a unique, standout header for the homepage, distinct from the headers on other pages or posts.
In this section, the purpose of your site will be most prominent. This part should emphasize what you offer. There are various ways to approach this, but we recommend a three-column layout, with each column featuring a heading, description, and image. Depending on the purpose of your site, some ideas for this section include:
- Services you offer
- Products you want to showcase
- Blog category topics
- Most recent blog posts
- Featured blog posts
- Courses you offer
- Three of your key pages
We recommend featuring the top 3 items from whichever area you choose, with a link to learn more about each item and/or a link to view all related items from that area.
If you didn’t feature your three most recent blog posts in Section 3, we recommend adding them to this next section. However, if you’re not planning to include blog posts on your site or if they were already your focus in Section 3, you can skip this section.
Using dynamic blocks, such as the Query Loop block, this section will give your visitors a taste of what information they’ll find on your site. These blocks offer many different configuration options giving you full control over the look of them, as well as the specific posts (or pages) they’re displaying. Be sure to include a line or two above this section explaining what these particular pieces are and why they’re on your Homepage. This is what will tell the visitor why they should read them. Whether they’re your latest and greatest in your niche, or the three pieces you feel they should read first — tell them that — don’t assume they’ll figure it out.
If you have no intention of including a blog section in your site you can skip this piece, or use this section to display other pertinent information within your site, such as the services you offer. Most dynamic blocks can also be used to automatically display specific pages.
Additionally, if you want to include sections for more than one option from those listed in Section 3, that’s perfectly fine. Simply include these additional sections in your plan and arrange them on the page in order of priority.
Are you remembering to take notes? The more of this information that you document now, the quicker building the actual page will go.
Include a brief description about yourself (or your company or team) with just one or two points as to why you’re the best, most qualified, or most passionate about providing this information. This is where you get your visitors to care a bit about you after you’ve already demonstrated above that you care about them. You’ll also want to come back to this section and cross-link it to your About page, once it’s created, where you’ll include more detailed and specific information.
We recommend including a section on your homepage for visitors to subscribe to your site and content. Gaining subscribers can boost engagement and provide a stable audience base for promoting new content. You can use the built-in Jetpack Subscribe block, which will send subscribers an email each time you publish a new post.
This should be the last piece on your homepage, after the reader has gotten a sense of what your website is about, why it’s of value to them, what kind of information or resources you’re providing, and who you are. After all of that is when it makes sense to ask them to subscribe to your site or newsletter. Of course it’s not the only place you’ll invite them to subscribe, but it should still be included at the bottom of your homepage. It’s like asking someone you’ve just met for their phone number — most people won’t do that before they’ve gone through at least a small introduction.
If you won’t be publishing posts on your site, there’s no point in including the built-in subscribe block provided by WordPress.com. This feature sends email notifications only when you publish new posts. But you may want to consider including some other email-list building subscribe option using a plugin such as MailPoet↗︎, or integrating a service of your choice. You can still use one of the available newsletter patterns as a starting point, then just swap out the subscription form block with one for the particular service you’re using.
Once your site is set up, we recommend working through our Newsletters 101 course for more information about the options of working with newsletters.
The footer section, similar to the header section, is often repeated on all other pages and/or posts throughout your site. However, it can also be customized for different types of content (such as pages versus posts) if desired.
The following are some common components included in footers, but each item is optional and can be tailored based on your needs.
- Contact information
- Map
- Social links
- Important links
- Navigation (site menu)
Click here to expand this section for an example of what your homepage outline plan might look like:
Header:
- Site Title:
J.D. Author Website - Site Tagline:
Fantastical books to tantalize your senses - Navigation:
Just the Home link for now - Search:
Yes, will include a search bar
Intro:
- Background image of books or a library with the following text placed on top of it:
- You know that feeling when you’re lost in the magical world of a new book, and it transports you to a mythical place beyond your dreams? You’re in the right place to find your next, can’t put it down, novel.
- Button:
Buy your next adventure here (Coming Soon)
Highlight your offerings:
- Column 1:
- Heading:
J.D. Bio - Description:
J.D. has been writing for years and is obsessed with sticker packs from Etsy. Learn more (coming soon) - Image:
Author photo
- Heading:
- Column 2:
- Heading:
Events & Press - Description:
Where can you get a signed copy? Meet the author? Or see what others are saying? Right here (coming soon) - Image:
Some kind of fun news, press, or mega-phone related image
- Heading:
- Column 3:
- Heading:
Say hello! - Description:
Reach out any time to say hello, ask questions, or even provide constructive feedback. Don’t be shy, click here (coming soon) - Image:
Mailbox, email icon of some kind, carrier pigeon maybe?
- Heading:
Latest posts:
Yes, will include this to display the 3 most recent posts and a button to load more
About section:
Hello, fellow adventurers! I’m J.D., a storyteller who spins tales from the threads of dreams and everyday magic. My journey began with a pen, a notebook, and a head full of faraway places. By day, I’m an unassuming librarian, but by night, I transform into a weaver of worlds, crafting stories that dance between the fantastical and the deeply human. Have you ever wondered what secrets a quiet librarian might hold? Dive deeper into my world of whimsy and wonder — who knows what tales we’ll uncover together?
Include a button linked to the about page
Subscribe option:
Will use the built-in subscribe option to start with
Footer:
- Social links:
Facebook, Twitter, Instagram
- Navigation:
Will repeat the menu from the top of the site
The purpose of this lesson is to plan the content for your homepage. At this stage, don’t worry about the implementation details.
If you have images you plan to use on your site, gather them in one folder on your computer for easy access. If you don’t have your own images, you can use the free photo library included with your site. To get a head start on finding photos, make a list of search terms related to the images you want to include.
If you follow the plan provided in this lesson, then initially, you won’t be adding links to any buttons or ‘see more’ text (since you won’t have created those pages yet). Instead, include ‘(Coming soon)’ after the items that will be linked later, to let your visitors know there’s more coming! Likewise, your menu(s) may only include the ‘Home’ item to start with, this is totally fine! You can plan additional pages in the same way you planned the homepage in this lesson, and once these pages are published, you can update the homepage and menu with the correct links.
When you’re ready with your content plan, decide which approach to designing your homepage that you’d like to take, and dive in!
Planning, designing, and launching a compelling homepage early in the process helps get your site added to search engine queues, so you don’t have to wait for search engine indexing to start after completing your other pages. Even if indexing takes less time than building the rest of your site, you’ll have a published homepage suitable for visitors.
After launching the site, if at any point you feel the site isn’t ready for the public or search engines, you can switch the site to the ‘Coming Soon’ mode under Settings > General↗︎.
You may have spent more time on this lesson than you expected, but by laying a solid foundation through careful planning, you’ll likely find that building the actual page moves more quickly.
Ultimately, we recommend that you follow this process for every single page you plan to create for your site.
Back to top