Pro Blog Design

In this post, I will show you a simple way to add a distraction-free “Reading Mode” to your blog. You can see the end result on this Reading Mode demo site (Click the highlighted “Reading Mode” link).

The purpose of adding a feature like this is to enable a visitor to remove all the clutter of your site, and focus solely on the post itself.

In an ideal world; there would never be a need for such a feature. In reality though, sites have numerous other goals to achieve, such as brand building, serving ads, promoting other content etc. In this way, you can compromise between the two. Do what you need when the user first arrives, but get out of the way when they decide what to read.

Read More »

In this review, we’re going to work through a website (FreePixels.com) as a case study, looking at its design and seeing what we can learn from it and what we could improve on.

So to start off, let’s take a look at Free Pixels. They offer almost 4000 extremely high quality images, for free. All you have to do is leave the small watermark in the corner, or create your own link back.

That makes it a very handy site for bloggers! Now load up the site in a new tab, and let’s start our case study!

Read More »

When working on a new blog theme most designers like to look around at examples of well-designed blogs for inspiration that can be used in their own work. Sometimes the most impressive and inspiring designs are those that manage to achieve a great look with simplicity rather than excessive design elements.

In this post we will showcase 30 blog designs that have an effective, attractive design with a clean style. In many cases this style lends itself to proper emphasis on the content and excellent readability.

Read More »

As bloggers, we all want to put as much content as we can on the page, but make it look like as little as we can.

It’s an interesting paradox, which doesn’t always have an answer.

In certain circumstances however, there are indeed ways of cheating the rule, and serving your readers better by doing so.

In this article, I will talk about the 5 main options available to you, and by knowing them, you might find ways to apply them to your own blog.

Read More »

In the first post, What Is Design Clutter?, we talked about how clutter is caused by too many objects competing for attention.

The problem for any blogger is choosing which objects should get attention and which shouldn’t. It’s hard to accept that something you went to the trouble of putting on your page isn’t worth actively promoting (Because it will steal attention from the things that really do matter).

Separating The Wheat from The Chaff

The best way to avoid clutter and make sure that the valuable parts of your blog are properly promoted is to make a clear list of your priorities. Once it’s written down, it will make design decisions much easier.

Write out a list of every element on your blog (From the blog title right down to the post date!), and then run each aspect through this flowchart:

Read More »

Choosing the parts of your site that a user sees is all about prominence. The more prominent something is, the more often it will be seen.

The problem with prominence is that it’s relative.

Simply giving something a bright background and a bigger font does not make it prominent. It must stand out in comparison with the rest of the design.

For example, the "Come On In. We’re Hiring" badge on Authentic Boredom may be very noticeable, but if you put it on this site, it would just blend in. They need a different method of getting attention.

Read More »

Business Blog Wire is a blog run by Easton Ellsworth. The blog is focused particularly on businesses blogging, but also for any money-making bloggers out there.

So, what can be said about its design? It’s a plain design, but it works. There is a lot of content, and a lot of links to other sites in its blog network.

What Has Been Done Well?

• Post headings. Have a look at the headings and you’ll see why I think they’re great. Scanning down the home page for post titles is not a problem here.

Read More »