%20(1).webp)
Blog design best practices are often ignored amid all the focus on generating fresh, original, and AI-free content. To create blog posts that inspire buying decisions, mere words are not enough.
Brands should deliver a reading experience that gives the visitors clarity of thought. Good content can also fail to deliver if the overall blog layout is clumsy and riddled with inconsistent design.
Though it is hard to pinpoint the exact design strands that make blogging work for a brand, there are some common factors used by most successful blogs by brands.
In this blog, I will discuss blog design best practices that add the needed texture to a blog post to enhance its impact.
Table of contents:
- 12 Blog Design Best Practices For Better Ideas
1. Width of the Blog Post
2. Size of Blog Post Images
3. All About Fonts and Typography
4. Does Blog Format Matters?
5. Show Table of Contents
6. What To Put At the End
7. Write about the Author
8. The Takeaway Image
9. Include Published and Last Updated Dates
10. Putting Banners and Pop-ups
11. Having Share Buttons
12. Adding Elements - Importance of Following Blog Design Best Practices
- Design the Best Blog Post Layout
12 Blog Design Best Practices For Better Ideas
Blogging is an essential aspect of scaling a business as it is a free way to share knowledge with prospects and spread brand awareness. Here are the seven blog design best practices to take a brand’s blogging to the next level.
“All the discussed blog design best practices are inspired by Google’s EEAT framework.”
1. Width of the Blog Post
A blog post is already a content-heavy web page. It becomes essential to create appropriate breathing space for the page's elements by incorporating white space. Leaving empty spaces on the side of the blogs gives it a clean and simple look.
But how much should be the width of the text?
Brands use various text widths, but they all lie in the range of 600-700px wide. By utilising white space effectively, the text can be made more readable and easier to digest for the reader.
Here is an example of an Orbit Media blog post with a width of 635px with a lot of whitespace to spear. Another thing to notice is how the blog's images align with the text's width. Together, it gives the blog a uniform look and keeps the reader focused.
The presence of whitespace in the blog post also allows marketers to insert helpful navigational elements at the side.
For example, Mailchimp has integrated a small feedback form with its blog pages without disturbing the reading experience. While Orbit Media includes sticky social media share buttons on the side of the post to prompt a quick share on social media by the blog readers.
2. Size of Blog Post Images
Consistency in image sizing is one of the core blog design best practices. Blog image size depends on the width of your blog posts. So for example, if the width of your blog post is 635px, then the width of your image should also be 635px. The length can be variable depending on the content you want to put in the image.
3. All About Fonts and Typography
The main focus while choosing a font should be its legibility. No matter how fancy a font looks, if it disturbs the flow of content or highlights anything unwanted, it’s a no-go. Blog design best practices emphasize that readability should always take priority over aesthetic appeal when selecting fonts.
Two things to remember while deciding on fonts are
- Font Size
Though 10 or 11 px is the resorted font size, whether it’s on docs or spreadsheets, it should not be the same for a blog post. The font size on blog posts must create a visual hierarchy and support the page’s structure.
When a visitor enters the page, the heading, subheading, paragraphs, bullet points, etc., must have font sizes that complement each other without overpowering or making the space look crowded.
Here is a table that can help you decide the font size of blog posts. I have mentioned the preferred font size for big-screen gadgets like laptops, tablets, etc., and small screens like mobile phones.
- Font Type
Font type is crucial for first impressions. Every word should be easily legible to the visitor. Basic fonts like Arial, Time New Roman, Sans, etc., will be better than using fonts like Comic Sans, which look fun only on greeting cards.
There is no standard font type, but brands can always analyze top-performing domains in their industry to know which font will suit them better. Just follow the rule of keeping it simple. Marketers can use tools like WhatFont to conduct such font analysis easily.
4. Does Blog Format Matters?
An organized blog post attracts bold visitors. It makes it easier for prospects to search for the right information without much effort. Blog layout comprises creating visual typography from the blog post's content, which is easy to navigate.
It not only helps readers but comes under one of the best SEO practices, as good blog layout allows search engine crawlers to go through the content quickly and rank it.
But how to correctly format a blog?
Let’s divide the copy of a blog post into four parts: title, headings, subheadings, and paragraphs. Here’s the formatting:
- Main blog title: H1
- Headings: H2
- Subheading: H3 and so on.
For example, this is how I format Waseem Bashir’s blogs:
Try to keep the paragraphs limited to four lines as it becomes easier for the visitors to read and outline the images to make them stand out. Here’s a clean blog format example:
5. Show Table of Contents
The best navigational element to add to a blog post is a table of content that lets users jump to the relevant parts of the blog. It is not compulsory for short blogs, but for long-form content like pillar pages or guides, a table of content enhances user experience and encourages visitor interactions with the page.
Marketers can take it to the next level by having a sticky table of content that moves as the visitor reads the blog. Mailchimp utilises something similar.
6. What To Put At the End
The end of a blog post is a great space to give actionable cues to visitors. Brands have a lot of options when it comes to deciding what they want their prospects to do next.
Here, marketers have four options:
i) Related blog posts: Having a section at the end of the blog posts where related posts are recommend can further enhance the visitor’s research journey. It not only extends the time prospects spend on your blogs but also showcases how extensively you have covered a topic.
ii) Lead Magnets: Adding a lead magnet at the end of a blog post is effective. It capitalizes on the reader's interest to boost conversions and grow your audience.
iii) Newsletter Sign-up: Placing a newsletter sign-up form at the end of the blog post aims to capture interested readers, helping to build your subscriber list and maintain engagement.
The right end depends on a blog post’s position in the sales funnel. For example, if the blog post is present at the top of the funnel, then a related blog post or newsletter sign-up is an appropriate ending for it.
Similarly, lead magnets work well with a middle of the funnel blog post but can also be used with ToFu blogs. Services pages are best for bottom of the funnel blogs.
Consider using our Blog Catalog Sheet to streamline content management and enhance your blog strategy. This tool simplifies tracking Calls to Action (CTAs) and helps identify the perfect stage in the buyer's journey for each post, whether it's at the ToFu, MoFu, or BoFu. It's a valuable resource for optimizing your content approach.
7. Write about the Author
Adding the author’s name to the blog post increases its credibility. It provides little insight into the writer’s field of expertise and makes the content more dependable. A short bio of the author can consist of their qualifications and experience along with their social links, so readers can connect with them if they have any queries regarding the blog content.
Most of the author’s bio is present at the bottom of the blog. If a brand wants, it can specify the writer at the start of the blog, but should not disturb the flow of the content.
8. The Takeaway Image
A takeaway image is the blog summary that contains all the crucial information shared within the content.
It is a great way of providing visitors with something they can use to remember whatever they have read. Readers can take screenshots or download the takeaway image (don't forget to put your logo on it).
9. Include Published and Last Updated Dates
Transparency is the key to winning customer’s trust. Putting published and last updated dates on blog posts helps readers know how fresh the content is and be the judge themselves.
Many brands writing evergreen content may feel they don’t need to specify these dates. However, blog design best practices suggest that while this may not directly impact rankings, it can affect user experience.
For example, if you're researching PPC ads and come across a blog post that starts well but then repeatedly refers to Google Ads as Google Adwords, you might be prompted to check the publication date.
If not the published and updated date, I would suggest always adding the last updated date on your blog posts, so that their freshness can be gauged easily.
10. Putting Banners and Pop-ups
Utilizing banners and pop-ups is great for capturing the attention of visitors and highlighting crucial CTAs without disturbing the reading flow. The successful placement of banners relies on the relevancy of the content in the banner and how positively it impacts the reading experience. You can put banners on your blog posts in three different ways.
- Welcome Mat: A type of pop-up appears right after the visitor has entered the blog post. It is recommended to use the welcome mat for offers that have some urgency like upcoming webinars, live courses, and limited deals.
- Click-Through: Such banners are used the most in blog posts as they are the least intrusive to the reading experience. These banners have dedicated CTAs that help take visitors further down the sales funnel. The CTAs can lead to service pages, case studies, portfolios, etc.
- Exit Pop-up: These pop-ups only work when the reader has completed reading a certain percentage of the blog post. For example, at 80% completion, an exit pop-up can appear that offers readers a lead magnet, a recording session, etc.
Examples:
Welcome pop-up: https://blog.hootsuite.com/social-media-best-practices/
Click-through:https://socialbee.com/blog/social-media-best-practices/
Exit pop-up: https://coschedule.com/blog/social-media-best-practices-for-business
11. Having Share Buttons
Share buttons make it easy for readers to share your content on social media, increasing its reach and driving more traffic to your site. It is crucial to ensure the buttons are prominently placed but not intrusive, encouraging seamless sharing while maintaining a good user experience.
Here are some ideas on how you can use share buttons.
- Orbit Media includes sticky social buttons on the side of the post to prompt a quick share on social media by the readers.
- You can highlight key points from your blog post with share buttons, allowing readers to easily share these quotes on social media. This offers a sneak peek of your content and can help direct traffic to the full blog post.
12. Adding Elements
Incorporating HTML elements like quotes, highlighted pro tips, and relevant resources into a blog post is highly effective.These elements enhance readability, emphasize key information, and provide additional value to readers.
They can make your content more engaging and informative, encouraging readers to spend more time on the page. For example, you can use small highlighted blocks that share a pro tip on the blog focus.
Such elements also make the whole blog post more skimmable and increase the chances of your message getting noticed by the readers.
Importance of Following Blog Design Best Practices
According to research, 94% of a site’s first impressions are design-related. Blog posts possessing great potential might go to waste if the user is not impressed by the content above the fold and leaves immediately.
That’s why implementing blog design best practices is essential.
Visuals help break the ice between readers and content by presenting a layout that is easy to navigate and understand. It entices readers into reading the blog and shows signs that the content matches what prospects’ were searching for.
Implementing blog design best practices helps marketers tackle three major problems:
- High Bounce Rate
It signifies that a reader enters the blog but leaves immediately without interacting with the page’s elements. The most common reasons behind a high bounce rate are poor SEO or inefficient blog post design. - Scarce Return Visitors
The main aim of a blog is to build brand credibility that readers return to when in need. But a low rate of return visitors showcases that blogs are missing the point. - Standing out from Competitors
Creating unique content is hard. With search results filled with information claiming to solve the same problem, it can become hard for the readers to filter out the best content. Standing out from the competition becomes tough with just a good content copy.
Brands can minimise all such issues on their blog posts through apt designing. Let’s understand how to do it in-depth.
Design the Best Blog Post Layout
Blog design best practices help you inch closer to better search result rankings and traffic. Implementing the right formatting, font size, HTML elements, etc., increases your chances of building a loyal reader base that can be further converted into newsletter subscribers and clients.
If you aim to build a learning centre or a blogging hub where you share relevant content related to a niche, you would also need a blog category page. You can check out this blog to learn how to design your main blog page efficiently:
Related Article:
The B2B Blogging Strategy Every Beginner Must Know
Is Content Marketing Dead? Separating Fact From Fiction
How to Create Original Content That Drives Engagement
Content Marketing Best Practices
