Tips for Designing Unique and Attractive Blog Posts

Designers have begun to inject increasing levels of creativity into their blog posts and articles, throwing out the traditional and generic style of blog posts in favor of a much more attractive layout that’s themed specifically to the content. Let’s take a look at some of the best examples, and see what makes them work so well.

In his fantastic article ‘The Death of the Boring Blog Post‘, Paddy Donnelly sums up this method of fusing together a blog post with the style and design of a traditional magazine article and coins the name, ‘Blogazine’. Be sure to check it out for a great introduction, and to hear from some of the pioneers of this style of blogging.

Scrap the traditional website layout

We’re all used to blog themes with the traditional two-column content and sidebar layout. But to really create a custom and unique post design, all the common practices are thrown out of the window in order to give yourself a blank canvas to start from. There’s no header, there’s no footer, there’s no sidebar. Instead, the whole page is open to housing the content any way you wish; you really have to break free of the usual web design mindset, and think out of the box in terms of creativity to portray your information in an interesting and enticing way, but also keeping everything readable and accessible. This does subsequently induce a lot of work, as your whole post needs to be completely designed and styled from scratch, using a unique CSS style sheet and HTML code, but the main advantage is having a unique post that captures the user’s interest and easily puts across your message.

Take inspiration from print design

For decades, designers working in print have used the core design principles to create balanced layouts in magazines and posters. To create the best designed blog post, go back to basics and follow the basic rules of space, colour, shape and type. For inspiration, check out any magazine article for ideas on how to combine images and text, using different type sizes, weights and fonts to portray a certain feeling, or to highlight particular elements of the content.

A grid is your friend

Because we’re now working with a completely blank canvas, it’s important to achieve balance in your new post design. Basing your design on an underlying grid will help develop an eye-pleasing design that’s easily consumed by the reader. On the contrary, simply placing elements where you see fit could end up with a page that’s difficult to follow and doesn’t flow from one element to the next.

Don’t worry about scrolling

Unlike a magazine that can span across multiple pages, as web designers, we’re stuck with continuously moving downwards. After balancing out your design with lots of large elements and plenty of white space, it’s highly likely that your post will take up maybe 5 times the space it would have done if it was written as plain old text in the traditional format. Unfortunately, this is one sacrifice that has to be made. While an excessive amount of scrolling could impact the usability of your page, it’s safe to say that users are used to navigating with the scroll wheel, so don’t worry about stretching out your page length in favor of a unique design.

Get creative

As designer’s we’re always wanting to break free from limitations and let our creativity shine. Here’s your chance! Next time you’re fleshing out ideas for a blog post, try starting from scratch and design the whole content, creating an attractive post that really gets the point across.

Thanks for the great post. I’m glad you touched on the scrolling issue. Far too many people are concerned with having to scroll to see additional information. have they not realised that the scroll wheel is there for a reason!

Awesome!
When we come to the blog first thing come to mind is sidebar. But all the examples you have shared are wonderful inspiration for some creative work. Now its time to move on and change the well know blog layout.

I agree with Design Informer, I love this idea, but it’s hard when you are trying to get out articles to your readers 2 or 3 times a week.

One thing that has confused me as well is how to call a unique CSS file for each wp post. Is there a plugin for this or something? I’ve admired blogs like Jason Santamaria’s for a long time but have been stumped as to the best way to achieve a custom CSS for each post.

No doubt about it, these are beautiful examples. And also no doubt–they took exponentially more time to produce, as they require a custom single.php file.

Which means, depending on how often you post, you have to weigh the pros and cons about the time necessary for individual layouts.

Out of the ordinary article layouts are also out of the realm of DIY for most bloggers. Making it less likely to see these layouts beyond web designers’ sites, unless clients are willing to pay for unique article layouts.

A lot of these type of posts are on blogs that aren’t as frequently updated. I wonder if/when some of the more frequent design bloggers will start to incorporate it. I know Jad over at Design Informer had one like this last week and I’ve started kicking the idea around., What about you, Chris?

Greate post chris!
But I don’t exactly understand what you mean by “Scrap the traditional website layout”. Sure one should leave the traditional sectioning but you can’t do a layout similar to those in magazines. I still think it’s a litte (or big) difference wether you design stuff for printed media or online media.

The ‘traditional’ way is to design the website, then insert your text content in the designated ‘content’ area, with little styling to the actual article itself.

These ‘blogazines’ are taking an approach where the whole content is designed, rather than the surrounding website. The result (examples above) are unique posts that really put across the info they contain.

Many of these designs are quite tall, whereas the aspect ratio of most computers is wide (handheld devices notwithstanding.) I recognize the merits of embracing the scroll wheel, but shouldn’t we also take into account the fact that these designs will _never_ be viewed by readers as they are presented here? The browser will always represent a small porthole on the overall design, potentially obscuring the bigger picture. Sometimes that will be really cool, admittedly, but an argument should be made for innovative design that targets the medium, rather than ignores it.

I am glad to see this type of blogging become more noticed. Soon the ’roundup’ and ‘top ten’ blog posts will become second rate, and interesting content accompanied by thoughtful layout will be requisite to be considered a ‘good’ blog post. The times they are a changin’.

These designs are great, but my question is, do they really matter? Yes, design matters. I know that. But a lot of people (me included) read their blogs in a format like Google Reader don’t even see the design, all they see is the content. This was actually something we have been thinking about a lot in our office- this idea of content vs creative (http://www.atomicdust.com/blog/single/content-is-the-new-black/), and would love to hear more thoughts on the subject…

While certain comprimises have to be for these beautiful layouts, some of these examples strayed from some personal ground rules I have about scrolling. If there are four consecutive graphs, and the object is to allow the user to compare them, I think they should all be visible within the same scroll span on a reasonably-sized monitor. Also, if your text columns are too long, a person has to scroll down, then back up, then down again to read them. These a really nice to look at, though.

Changing the design of the post is an interesting idea. However, I wonder how effective this alternative templates are in achieving the goals of your blog.

Where this new post designs tested for performance against a more simple and plain version? Will people actually read more and be more engaged with a user experience that is different and more complex than the more simple ones they are use to see every day?

Most probably each situation will show different results. In any case the only way to tell will be analyze your audience and if relevant test it. Remember, it has to be effective, not only “look cool”.

Subscribe for email updates

About Line25

Line25 was built in March 2009 as a place to share web design ideas and inspiration through articles, tutorials and examples of stunning site designs. Be the first to see new posts by subscribing by RSS, have new content delivered by Email, or join Line25 on Twitter.