The First Impression: Planning your Perfect Homepage
The homepage is often the first thing your readers will see when they visit your website; it should make a good impression, introduce them to your brand and encourage them to click around.
A blog’s homepage can be more traditional and blog-like, focusing mainly on recent content, or it can be more modular, with numerous different blocks of categorical content not unlike the sections of a magazine (we often call this style of blog ‘magazine-style’).
Deciding what exactly you want on your homepage is a big decision, as it determines the direction of the site design as well as the bulk of the cost. Thus, knowing what you want before getting in touch will allow us to better anticipate your needs and quote your project accordingly.
As a blog, your homepage is going to be vastly different from say, a restaurant or ecommerce site. Blog content is ever changing, and you want the homepage to reflect the width and breadth of what your site has to offer.
First, ask yourself what is your primary goal? Is it more pageviews, increased email subscriptions, or promoting your personal brand?
With that goal in mind, it’ll be more easy to determine what the biggest focus of your homepage should be. Is it recent content? Your sign up form? You? If you want your site to be about you and your personal brand, for example, the homepage should be more about you and what you offer rather than heavily emphasized blog content.
The main purpose of a homepage is threefold:
To attract and captivate visitors
This is achieved through a professional looking design with cohesive branding, eye-catching imagery and plenty of white space. A large image-based featured area is often a good way to grab a user’s attention, by putting your best and most popular content front and center.
To educate visitors on your brand
Your personal brand can be the primary focus, or it can be secondary with a smaller about/bio blurb in the sidebar or footer. The prominence depends on how much you are branding yourself as a personality and how much you want that to be a focal point of your website.
To encourage readers to visit other pages on your website
This is where the bulk of the content on the homepage comes in. By offering your readers choices, they can view new content, categorical content, featured content, and trending content and click through to what they find relevant and engaging.
Keep in mind, however, that there is such thing as too much choice: a site with dozens of different sections and hundreds of clickable images might be overwhelming and actually result in fewer clicks than a more focused approach with fewer, more relevant choices (not to mention a faster load time).
What’s in a Homepage?
A homepage is made up of a combination of different types of content, what we’ll call content blocks. In its simplest form, the homepage is just your most recent posts. On the other end of the spectrum, a homepage can have numerous blocks of non-chronological content, space for featured posts, maybe a video, subscription call to action forms, and more. A magazine-style homepage often differs from the interior/post pages of a site in that it has full width content and no sidebar, or partially full-width content and a shorter sidebar.
When you are thinking about what you want on the homepage, often times sketching up a wireframe is the most effective way to visualize exactly what you want on your homepage. Don’t overthink the specific design details like fonts or colors, rather focus on the overall structure: what KIND of content do you want to feature and WHERE.
Regular visitors to your site are probably coming back for one reason: to see what is new. Not everyone wants to subscribe to a blog via email/rss/social/etc, and instead might have your site bookmarked and check back when they remember. Loyal visitors like this are great, and we want to encourage them to keep coming back by making it easy to see what’s new.
For this reason we always recommend showcasing a few of your most recent posts prominently on the homepage, with either pagination to scroll farther back or a ‘blog’ page with all recent posts listed chronologically.
If you’ve blogged for any length of time, you’ve likely got a hearty archive of posts. And if your homepage just shows the recent ones, new visitors to your site might not realize the extent of what you offer. Sure they can browse your (hopefully well thought-out and organized) navigation or your recipe index, but giving them a little taste of what’s available on the homepage will get them clicking and browsing more.
Featured content sections are blocks of manually-curated posts that you can pick and choose what to show from your entirely catalog of published posts. Featured content doesn’t have to be tied to a specific category. Maybe it’s close to the 4th of July, and you want to showcase red, white and blue food. Or perhaps you want a section for your own personal all-time favorite recipes.
Featured sections are most often at the very top of the homepage, however we can also position them below your recent posts, in a sidebar, or even in the footer of the site. Again, it just depends what you want to be the main focus and what you want to be secondary to that.
We can display featured content on homepages in a variety of ways, both static (non-moving) and dynamic (interactive or animated in someway).
Static featured areas are the simplest way to highlight select content at the top of your homepage. Whether it is a single large featured post or a set of posts above the fold, this is an easy and efficient way to feature older, seasonally appropriate or trending content in a way that gives you full control over what posts you want to highlight at any given time.
Static featured areas can take on a number of different arrangements or layouts, and can highlight either featured posts or contain linked image blocks linking to category landing pages or other important content.
A tabbed featured area allows you to essentially have multiple featured areas within the same space, defined specifically with a tab title. Users can click each tab to view the posts you’ve selected. Maybe you want to showcase Recent, Popular, and Featured posts. Or you could choose your tabs by category, changing out categories with the seasons (Grilling, No-Bake, and Salads for the summertime, for example, and Soups, Cookies, and Slow Cooker recipes in the winter). Each tab would show a set number of posts from the chosen category.
A slideshow or carousel allows you to feature more content in the same amount of space, either through a rotating slideshow, or a scrolling carousel of posts.
While these types of areas are quite slick, they also can increase pagespeed (due to the additional scripts/styles required). Additionally, most users will likely scroll right by this kind of area without actually interacting with it or waiting for the slideshow to progress. For that reason we rarely implement this kind of featured area anymore.
Having a homepage that appears more magazine-like versus blog-like involves different sections or groups of content, typically organized by theme or category. Maybe you want to show a set of Thanksgiving recipes in the fall, or some of your more popular Dinner recipes to draw your readers’ attention. Each category section can have a different theme, and also link to the main category landing page for readers who want to explore more.
There are two general methods we use for these kinds of sections:
- Automatic: you select a category and it will automatically show the most recent posts from that category along with as a ‘more’ link to view more posts in that category.
- Manual: this functions more like a featured area, where you can manually pick and choose exactly which posts you want to appear here. This is ideal if you want more fine-tuned control over what is shown, or you want to have sections of content that may not be associated with a category. With these kinds of sections you can optionally enter a ‘more’ link as well as a text description of the whole section (useful for adding keyword-rich text for SEO-purposes)
These category sections are built utilizing widgets, which means that you can easily add, update, or rearrange sections as necessary. Category sections such as these can be displayed both on your homepage as well as in your sidebar, and are very flexible and easy to manage.
With more focus being placed on the SEO value of category landing pages, including visual links to some of your more popular categories on the homepage is a way to highlight content and get your users browsing.
Having a section linking to your most popular categories, with linked images or even graphical icons, is an easy, visual way to let your reader know what kind of content they can expect on your site (for example, if you show icons for all dessert categories, it’s pretty obvious you’re a baking blog, whereas if the icons relate to special diets, then it’s clear the content is more health-focused recipes).
We often utilize stock imagery and illustrations for icons, style-matched to the rest of your site. But if you want something more flexible that you can easily change at will, you may want to consider using photos instead (often cropped circular for visual distinction between these and post images).
This type of section can also be expanded to an advanced recipe search, including a large search box as well as a link to the recipe index (examples: Choosing Chia, Downshiftology, How Sweet Eats [this one uses text tags instead of images/icons])
People like to see what other people like, and so displaying a section with popular posts or reader favorites is a great way to highlight older, trending content.
We can either set this up so you can manually select which posts you want to display, or utilize a Popular Posts plugin to track and display popular content automatically (the plugin is often server-intensive since it tracks post views itself. If you’re looking for the fastest, lightest-weight site possible, consider the manual option instead.)
We often display popular/trending posts in a slightly different style from categorical or recent posts. With the manual method, we can also include things like recipe ratings (only WPRM and Tasty), or other recipe info (WPRM only) along with the post title and image (examples: Tea for Turmeric, Brown Eyed Baker).
It’s your site, so you should let people know who you are! We often include a bio block in a site sidebar with a small photo and brief bio with a link to your about page. If you want your personality to be more of a focus, we can turn this into a larger area on the homepage too. For bloggers trying to build a personal brand, letting readers get to know you and feel more connected to you as a person will help build reader loyalty.
A section like this is often built around the photography, so if you are able to schedule a photo session with a professional photographer to get some really eye-catching images, then I’ll be able to design the block around those images.
Call to Action
If you want to encourage subscriptions to your newsletter, increase your Instagram following, promote a cookbook, or sell a product, we can design an eye-catching section encouraging your readers to take a specific action.
We recommend only having one prominent call to action on a homepage so as not to divide your readers attention. So pick what is the most important to you and promote that.
Featured videos are becoming a common thing to include on homepages, to highlight some of your most eye-catching video content.
A video block can be as simple as one large embedded video, but can also include a text description and ‘get the recipe’ link (example: Kim’s Cravings, A Beautiful Plate, The Suburban Soapbox), or even thumbnails of additional videos. (Examples: Downshiftology, Clean Eating Kitchen)
Sidebar vs No Sidebar
Lately, homepages are trending towards full width content and no sidebar. This allows for wider content and larger, more eye-catching images.
Your individual post pages will still have a standard sidebar, it’s just the homepage that will expand to fill the full content width.
What about ad revenue? You may see some reduction in ad revenue by removing the sidebar on the homepage, however I’d bet you’ll barely notice. Your most valuable pages are going to be your internal post pages (and those will still have a sidebar); additionally the majority of your traffic is likely mobile, where sidebars are repositioned to the bottom of the page anyway. If you’re worried, consult with your ad network before deciding to ditch the sidebar.