How to design blogs

Default avatar.
October 03, 2013
How to design blogs.

thumbnailAs designers, we each develop distinct styles, and usually gravitate towards different kinds of projects when we have a choice in the matter. For me, it’s content-driven websites and nothing is more content-driven than the good old-fashioned blog.

There is something that simply feels right about putting a whole bunch of meaningful, interesting text, pictures, and/or video together in an aesthetically pleasing way. Blog content is all about ideas, and ideas are meant to be read, appreciated, and if everything goes well, discussed at length. Facilitating that process is personally fulfilling, and often challenging.

For people who own blogs, the advantages are clear:

  1. The format is flexible. They are free to discuss a variety of topics. Even if a blog has a central theme, they can occasionally break away from it to explore other ideas that intrigue them.
  2. Posts can be as short or as long as you like.
  3. Posts don’t have to be text. Video and photo blogs can be engaging, and some are pretty popular.
  4. Blogs can be used to establish someone as an expert in their field, thereby increasing business opportunities.
  5. Blogs are incredibly easy to create and experiment with, thanks to services like WordPress.com, Blogger, and so on.

Blogs haven’t changed much

No matter what blog you go to, you’ll see a variation on the following system:

  1. a home page with the latest articles, either displayed in full, or as a list;
  2. a list of categories - probably in a sidebar;
  3. an archive, with links to listings of articles sorted by month or year;
  4. individual articles with an attached comment thread;
  5. usually, an “About” page, and/or a “Contact” page.

This is not a bad set of defaults. By and large, this structure works and it’s familiar. This does not mean, however, that it’s right for you, or your content.

As UX designers, our job isn’t just to make sure that text is big enough to read, that navigation is easily recognizable as such, or that buttons are big enough to tap on. We solve problems. We make sure that it’s easy for users to find what they’re looking for, and quickly. We have mere seconds to engage readers and keep them on our site, so we have to get creative.

In this article, I’m going to look at features which are common to the majority of blogs, and see how we might make them easier to use, more engaging, and/or irrelevant. Let’s start with my absolute favorite pet peeve:

The sidebar

One problem that I have with the sidebar is that too often it distracts me from the content as I try to read. It might be a colorful animated ad, or worse, one that comes with sound and no mute button, or the sidebar itself just clashes too harshly with the rest of the site.

Sometimes, sidebars are rendered next to unusable by people who try to cram far too much information into them, making the text smaller and smaller all the time. Sometimes, sidebars are much much longer than an individual article.

Here’s a hint: putting five years of archives, sorted by month, in one sidebar is not a good idea. This might sound like it’s just a personal irritation to some people, but there is no reason why a sidebar should be twice the height of my 1600x900 screen.

Many blogs have solved this problem in one of a few ways, the most notable of which being that they often drop the sidebar altogether. Navigational lists such as categories and archives are moved to their own section, usually under the main content.

Now let me be perfectly clear. I am not saying that sidebars should go altogether. In fact, when I move my personal blog from my main domain to its own, I actually intend to use a sidebar for some rather important things.

What I am saying is that sidebars should not be stuffed with more information and widgets than is reasonable, and they should not dominate the page. They are meant to be navigational aids only. Let’s treat them that way.

If you want to display more information than can comfortably fit in a sidebar, display it elsewhere.

Individual articles

I’d like to talk about individual articles before the home page because if you’re doing well as a writer, the home page will rarely be the first thing that people see. People will be sent directly to individual articles by search results, links provided by friends, and services such as Stumbleupon.

For this reason, make sure that navigation options like categories and search are available on every page of your blog. The article that your users find may not be the one they’re looking for, so you’ve got to make it easy for them to find your other content.

A lot of self-styled blog “gurus” will talk about the importance of having “related articles” listed for each individual post. As much as I hate to agree with anyone who calls himself a “guru”, they have a point. Reading through a blog is all about discovery, and that discovery process should happen quickly. Users are more likely to click on an eye-catching related headline than look for the category link to see similar articles on your site.

Make sure that there’s a bit of descriptive “About” text on every page. If it’s a really short paragraph, it could go in the sidebar. If it’s longer, you could put it in the page footer, where users are likely to see it after they’ve finished reading/skimming the article.

Finally, if there’s one thing you learn from this part of the article, remember this: on a blog, you should spend more time designing your post content than your home page. Your content is what people will see first, in all likelihood.

The home page

Many people design the home page of their website as though it will be the first thing that every user sees. This is a mistake. The users most likely to view a home page are regular readers who don’t use RSS feeds (which should always be available), and those first-time visitors who’ve just read an article, then clicked “Home” because they felt like it.

So yes, the home page of most blogs is essentially a glorified RSS feed. This is where users come for updates.

Unless you’re running a tumblelog - a blog made up of very short posts, images, and videos - I would recommend displaying no more than a headline, an excerpt, and an optional image thumbnail. Blogs that display entire posts on the home page force readers to scroll down and down to make sure they haven’t missed anything.

Some people get around this by displaying a list of the most recent headlines in their sidebar, but I see this as redundant. Such a list can be useful on every page of the blog except the home page.

This is not the only way to make a home page for a blog, of course. There are other ways to present your content, but I believe that this approach makes the most sense from the perspective of a reader.

Need more proof? Look up a newspaper or magazine site. All they do is display the links to the most recent articles in every major category.

Chronological navigation

It’s typical to put a date on every post published, and to allow users to navigate the site’s content by month or year. For some writers, this makes sense. If you’re writing about design trends, reviewing technology, addressing political issues, or doing anything else that’s time-sensitive in any way, use it.

However, is chronological navigation always necessary? Probably not. Examine your content. If you’re writing about things that aren’t going to change in a hurry, like history, human nature, or less-than-contemporary art, you may want to leave date-based navigation options out altogether.

Look for other ways to organize your content based on your subject matter. Categories will never go out of style, but let’s take art, for example. You could design the site in such a way that people can browse your posts by which artists are mentioned, or by the art styles and mediums you discuss.

You know your audience. How would you like to be able to find the things that interest you?

Comments

Ah, comments. The place where everyone can virtually gather round and discuss the post at hand without getting off-topic, starting pointless debates, or insulting each other. And just as we’re all about to indulge in a quick drink before we peacefully disperse to go about our lives, I wake up.

All jokes aside, having a comments section can provide invaluable feedback, and the interaction and user engagement can help bring your readers back for more.

One thing I’ve seen many blog designs and themes do is make their comment areas too small. This is especially a problem when you consider two things:

  1. Threaded comments are a standard these days. As people reply to comments, and then to other replies, the content area of these sub-comments tends to get smaller and smaller.
  2. The problem above can be exacerbated when the website’s design is fluidly responsive.

My solution? A comment section should be as wide as the article above it. At least.

What do you like least about blogs? What features are essential for you? Let us know in the comments.

Featured image/thumbnail, blogging image via Paolo Valdemarin.

Ezequiel Bruni

Ezequiel Bruni is a web/UX designer, blogger, and aspiring photographer living in Mexico. When he’s not up to his finely-chiselled ears in wire-frames and front-end code, or ranting about the same, he indulges in beer, pizza, fantasy novels, and stand-up comedy.

Read Next

10+ Best Resources & Tools for Web Designers (2024 update)

Is searching for the best web design tools to suit your needs akin to having a recurring bad dream? Does each…

3 Essential Design Trends, April 2024

Ready to jump into some amazing new design ideas for Spring? Our roundup has everything from UX to color trends…

How to Plan Your First Successful Website

Planning a new website can be exciting and — if you’re anything like me — a little daunting. Whether you’re an…

15 Best New Fonts, March 2024

Welcome to March’s edition of our roundup of the best new fonts for designers. This month’s compilation includes…

LimeWire Developer APIs Herald a New Era of AI Integration

Generative AI is a fascinating technology. Far from the design killer some people feared, it is an empowering and…

20 Best New Websites, March 2024

Welcome to our pick of sites for March. This month’s collection tends towards the simple and clean, which goes to show…

Exciting New Tools for Designers, March 2024

The fast-paced world of design never stops turning, and staying ahead of the curve is essential for creatives. As…

Web Tech Trends to Watch in 2024 and Beyond

It hardly seems possible given the radical transformations we’ve seen over the last few decades, but the web design…

6 Best AI Productivity Apps in 2024

There’s no escaping it: if you want to be successful, you need to be productive. The more you work, the more you…

3 Essential Design Trends, February 2024

From atypical typefaces to neutral colors to unusual user patterns, there are plenty of new website design trends to…

Surviving the Leap from College to Real-World Design

So, you’ve finished college and are ready to showcase your design skills to the world. This is a pivotal moment that…

20 Mind-Bending Illusions That Will Make You Question Reality

Mind-bending videos. Divisive Images. Eye-straining visuals. This list of optical illusions has it all. Join us as we…