32 Most Irresistible Blog Designs 2019
We’ve collected examples of blog designs that attract attention and are remembered. Look through, get inspired and start creating your own blog.
The number of bloggers in the world will reach 31.7 million next year. That’s a staggering number of blogs, for sure, but do all of them attract the same amount of traffic? Obviously, no. Only the ones which hit the mark stand out.
“How do you hit that mark”, you ask? Even someone dense about blogging would blurt out that it’s all about the quality of your content. Not entirely true.
You see, producing engaging content that will be read, shared and will leave the readers wanting for more is of paramount importance. Nobody’s denying that. But that’s only part of the story.
Because here’s the thing. Would you come back to a blog cluttered with ads, widgets, buttons, and godawful design elements? Probably not.
Would you bother giving their content (even if it’s awesome) a read if it is barely readable because of a poor font choice? Because of incorrect line-height and padding? No.
What if instead of subheadings, the content is presented as a huge indigestible chunk of text? You get the idea.
You can’t expect to build a loyal readership, or even expect most readers to skim through your post and answer your call to action if they don’t find the design visually appealing. That is why it’s just as important as your material.
So now that we’ve established why good design is a key to a successful blog, here’s a roundup of 32 most eye-popping examples of blog designs inspiration out there.
Parrot
The first blog design in this rundown is a minimal, clutter-free and contemporary bootstrap template. It’s flexible, easy-to-use and easy on the eyes.
The homepage greets you with a featured article that also serves as a header. You can use this header to showcase your most popular entry. The title itself is bold, easily readable and sleek-looking. Right below the title, you’ll find a short punchy description hinting at what the post is about.
To help the reader decide whether they have the time to read your post now or if they’ll bookmark it for later, the template displays the estimated reading time with every post.
Now for the layout…
It uses a fusion of two and three-column layout, which might be a bit unconventional but it works like a dream. With that being said, the template is highly customizable, so you can alter the default layout style if you choose to.
Parrot is very responsive, retina-ready, and is built on Bootstrap. It also comes with 4 pre-designed pages, which save you not just time but also effort when you’re setting up your blog.
When you reach the end of your post, the header automatically displays social media buttons for easy sharing.
They opted for a charcoal color in lieu of solid black text — a color that has been shown to be easier on your eyes. It shows how much thought went into this design. The smooth progress bar is another welcome touch.
The bottom-line? It’s a clean, meticulous, and responsive template from the get-go.
Nice, Very Nice
This blog design stands out because of its bold and neat typeface choice. The header simply contains the typographic logo, accompanied by some text. There are no fancy or intrusive animations. No gaudy illustrations. This header is as simple as they come. And more often than not, simplicity translates into great design.
As you scroll, you’ll find stories arranged into a fusion of two and three column layouts. Again, the titles for these stories stand out because the font choice is very eye-popping.
Once you dive into a story, you’ll find it free from clutter. The content is organized. Very readable.
The social media sharing buttons are strategically placed at the very beginning of the story and towards the very end. I find this design choice thoughtful, because it makes the buttons accessible without getting in your way.
In fact, I’d submit that this sharing hub configuration is among some of the most effective ones, because the buttons aren’t too ‘in your face’, or intrusive.
As for the subscription to their newsletter, you’d have to scroll all the way down to the bottom of the footer to find it. In my experience, a newsletter pop-up attracts more readers. But if it’s your secondary concern, this choice isn’t half bad either.
WePresent
Next up, we have a design that showcases the cover story with a big, eye-catching banner with white overlay text, a brand name, and a logo of the same color. The banner takes up almost your entire screen, which is an effective choice if you want to grab your visitor’s attention, the second they land on your homepage.
As you scroll down, the cover story pulls away to reveal their latest stories. This section only features custom images and illustrations (which look pleasing, I might add) and no text. You can click or tap the images and they’ll take you to the post. Odd? Yes. You’re going in blind, so to speak. Some readers might favor this novelty. Others might not.
Moving further down, you’ll find their ‘staff picks’ section, which unlike the previous one lays out stories with their titles and a short excerpt giving you a peek into the post.
The stories themselves are laid out in alternating single-column design, with plenty of white space so the posts aren’t fighting for viewer’s attention.
The design is sleek and stylistic but you have to scroll more than you’re probably used to. It is also very minimal, so much so they cut out the estimated reading time, which is probably the only gripe I have with the design.
Kinfolk
Kinfolk features a very clean and tasteful look. You’ll notice how the fonts and color schemes are in line with their brand-image — a magazine and travel guide.
On top of the navigation, search and brand logo, there’s a banner showcasing the latest issue of the magazine on a simple background, along with some white overlay text. So far, so good.
The navigation is cleanly stashed away in a hamburger menu — a design choice that minimizes clutter. It uses a card layout. Three columns. But with a twist. The leftmost column only houses a single post, which is sort of “stickied” and moves along as you scroll. It’s not a downside in itself but the animation is a bit jittery.
Kinfolk doesn’t do anything ground-breaking or reinvent the wheel, but what it does, it does right.
Inside Intercom
Next up, we have Inside Intercom. It’s landing page isn’t exactly trailblazing. Some might find it too basic (at least that’s what I think). But where it lacks, it makes up for it with its gorgeous illustrations.
The first element that catches your eye is the big, vibrant artwork that is accompanied by the post title, a short description, estimated reading time, and its category. Aside from the news section, the posts are sorted into three columns, again with estimated reading times and excerpts.
The navigation is arranged along the left pane. It contains post categories and calls to actions for both their newsletter and social media buttons. And it is also the part I found most poorly designed; there’s definitely room for improvement there.
Inside Design by InVision
This blog is a prime example of how you maintain color scheme and brand consistency. When you open the page, the logo is conspicuous but its typography shrinks back into the navigation bar as you scroll (which I find inventive).
Speaking of scrolling, the right pane is dedicated to recent stories that let you sort through these posts without scrolling through the page — another creative touch. As for the right pane, it showcases the most popular story which immediately catches your attention.
Another aspect worth mentioning is the blog’s use of animations — which admittedly are very original and fresh. The blend of images and illustrations for posts works well too.
Emergence magazine
A pop-up card invites you to join their newsletter as soon as you land on their blog — good strategy. The banner fills the whole screen with an image. The company logo, the latest issue, and the menu button are featured as overlays. It’s aesthetic and pleasing.
The navigation links are nestled inside the menu button, which shoves the page to a side to reveal them on a solid black background. Tight and tidy. Scrolling along, you’ll find another banner dedicated to their featured story, complete with overlay text. The colors are mostly muted which complements the overall aesthetics of the blog.
The story pages showcase the post on a light pink background which reduces eye strain and improves readability. If you’d rather prefer to listen, you can also opt for that instead of reading them — a novel touch.
Which brings me to my next point, readability. They put a lot of thought into making the blog posts as easily readable as they could. The font choice contributes to that. As does the completely distraction-free look. What about social links? Yes, they are there. And very accessible too since they stick to the left side.
Christmas HQ
Christmas HQ captures the holiday spirit, and it captures it beautifully. From the stunning animated illustration as the header and Christmas-themed design elements, everything about this blog says “warm” and “welcoming”.
The layout is divided into two left and right panels. The left one features stories in two columns while the right pane showcases the latest food & drinks as well as decorations.
Once you dive into a post, you’ll find the reading time right under the title — an immensely helpful feature if you’re pressed for time. The social media buttons sit beside the title for easy sharing.
The overall design is appealing and you can tell from the get-go that they hit the mark with the holiday theme.
Crème Guides
Moving down the list, we have a slick-looking German blog. Keeping the pop-up newsletter train going, this blog’s homepage also greets you with a sign-up card. It is a bit unique in the fact that it uses both a hamburger menu and a traditional navigation menu — and no it doesn’t change depending on your screen size, it displays both side-by-side.
Save for the featured and top articles, the posts are organized in three-column cards. I’m not a fan of this layout because not every article gets the same amount of attention from the viewer. The font hierarchy isn’t half bad — no complaints there.
Crème Guides’ color palette is light and vibrant, as are the post thumbnails which make for a visually appealing blog design.
InterfaceLovers
Interface lovers is a blog which features interviews of accomplished and up and coming designers. So it comes as no surprise that it’s designed well.
It’s very minimalistic yet flavorful. I love the clean and simplistic header which includes their typography logo and a few helpful navigation links.
The interviews are laid out in two columns except for the featured interview which retains its place as you scroll. The title and its excerpt are displayed on top of the thumbnail as overlays. The rest of the interviews are stacked on top of each other, each with its headline and a short bio of the interviewee.
The only nitpick I have with this design is the limited number of sharing options, but that can be easily remedied if need be.
Read the article “32 Best Blog Design Examples in 2019” on Nice, Very Nice and uncover 20+ more blog design examples.
Originally published at https://niceverynice.com on July 18, 2019.
