Blogussion » navigation

What Every Blogger Should Know About Design When Buying a Theme

Seth — Tue, 26 Jan 2010 05:00:47 +0000

Getting a new design for your blog is both time consuming and expensive. There are many great options for free themes but too often these themes do not have very many features and require a lot of extra work.

Purchasing a theme from premium theme designers or paying for a custom design can not only give you many extra features but also allow you a unique and useful user interface.

Getting a design is much more than choosing colors, uniqueness and price. There are a lot of important design elements you should know about before getting a new theme. Here are your most important areas of interest as well as a buyer’s checklist.

Fundamental Design Elements

There are a few very important things to consider when evaluating the design of a potential theme. Some of these elements are often misunderstood so I will point out the what is usually left out of posts about theme design.

We all know that features are important and themes with jquery or admin panels add extra customization to your blog theme, but lets go back to the fundamentals.

White Space

In the image above all you see is the words. The “whitespace” is exactly what the name implies.. the area around the image that is white. Now to categorize as whitespace an area in design does not have to be “white”, just clear of any text or images.

Whitespace is important in design because it focuses the eye on to what is important. A good example of how this doesn’t work is when you go to a site and the design’s background is intense with a collage and millions of colors. The text or image you are trying to highlight never even gets any attention. Here’s an example of zero whitespace:

In the bad example you can tell that the words are there and we even could accent the text with either a drop shadow, outer glow, or stroke around the text to make it more appealing. But can you see how without whitespace your eyes are too busy.

Your eyes are taking in all of the background and trying to work out the text from all the other interesting images.

If you had an entire pack of with no whitespace then very easily you could find your blog with no readers, little click-throughs, and no brand. Actually you would have a brand.. you’d be the blog everyone remembers not to go to.

Avoid any design that does not have enough whitespace around important areas like the logo, navigation menu, and content area. Trying to make your theme busy only leaves your site empty.

Eye Tracking

For the avid readers of Blogussion I apologize, this next part is a repeat idea from a post last week, Your a Blogger Not a Crackhead! Its about finding a design that highlights the things that are most important to you.

The number one thing is your logo which brands you and should include near by your navigation menu and then your conversion tools. Your conversion tools are your subscriber boxes, products, ads, etc. Whatever your goals are for your blog is what your conversion tools should be pointing too.

Let’s look at the examples of good eye tracking to remember what it is.

The Eyes #1 is the area your eyes first see on a page and the Eyes #2 is the second area your eyes then go to. Eyes#2 is the area that you are trying to get people to see. In our blog its about converting people to subscribers.

Clean Content Areas

In one of my favorite posts on Blogussion, Alex describes some of the best ways to style your content area. If you have some time you should definitely read the entire article because Alex does an amazing job at breaking it down – Stellar Tips for Styling Your Content

To highlight some of what Alex said here is one of his main points:

Headings Matter – Alex talked a lot about headings because they really do matter. They draw attention to your post and bad headings with unattractive fonts or the wrong typography (text) can quickly scare away your readers. Be sure your the headings in any blog you are looking into are clear and clean looking. They should be prominently located on the page for maximum results.

Typography

Your text is the primary instrument for gaining more traffic and keeping readers. We talked yesterday about how to write powerful content and have previously talked about the importance of good content, but now I want to talk about the typography (font design) of your text.

Typography is the intricate design of the fonts you are using on your blog. Although there are plugins to add extra font features to any wordpress blog, the original functionality of the blog theme you are using makes life a lot easier.

For example Thesis theme comes with over a dozen options for typography. Other feature rich themes do too. The key is many of the free themes don’t and unless you have the patience to setup a complicated plugin then you should look into typography early on.

For the best practices of good typography, and to learn what all of the most popular blogs are using for their sites, check out Smashing Magazine’s Typographic Design Patterns

Wrapping It Up

In the coming weeks we have more design posts planned to help you not only get the best design features on your site but also teach you what to look for.

We hope you enjoyed learning more about web design and be sure to look at some of these fantastic resources.

5 Easy Blog Improvements in under 5 Minutes

Alex — Thu, 01 Oct 2009 04:00:12 +0000

Your blog is not perfect. There are many things you can do to improve your blog, and after reading this post – you will be glad you made some of these changes.

There is just so much you can do to improve your blog. You can make a major change to it by adding a new design, or adding a forum to it or something minor like changing a title of a blog post to something more search engine friendly.

Whatever it is you want to do, you do it because you think it will make your blog better. Of all these little things you can do to make your blog better, I came up with five things I found on Blogussion that I chose to implement with hopes it would make my blog better.

And everything I did doesn’t even take five minutes to implement.

1. Add a “back to top” link to your footer

This is something so simple, but so beneficial. Blogs have a tendency to create huge scroll bars. Whether that scroll bar is long because you don’t use the more tag to cut down your posts, or you get a lot of blog comments – the fact of the matter is if you have a huge scroll bar and no easy way to get back to the top, it will annoy us as your readers.

So when a user gets to the bottom of the page and sees the link, when the click it – they go to the very top of the page. It’s very easy to create. Just use this code and add it to your footer somewhere:

Back to top

It’s just that easy. When that link gets clicked, it automatically shoots to the top of the page.

More on this method: A Short Story about “Back To Top” Links

2. Little Icons

Every minor detail counts when it comes to designing for a blog. It’s the minor details that make some designs so excellent, and adding icons next to links on your blog can really make some parts of your blog stellar looking.

Here are a few examples:

Copyblogger uses a nice mail icon on a slant to represent where you can sign up for email updates

Nettuts uses a nice RSS icon to represent their forms of subscriptions

ProBlogger uses icons to represent all kinds of ways to sign up to the RSS feed

3. Customized Input Forms

Input forms are used all the time on blogs. To sign up for newsletters, to fill out a comment, and anything else that generally involves getting information from the user.

Input forms without style are often very ugly and boring to use. Luckily, they are extremely easy to customize. You may want to check out a past post on Blogussion with four tricks to making input forms great.

4. Creating thumbnails for posts

I love thumbnails, they make lists look so much more attractive. Just take a look around on Blogussion, there are thumbnails to display the popular posts on the blog, and there are thumbnails to represent the names of commentators in the top commentators list.

Take for example my other blog, Asnio. You see thumbnails everywhere on the blog, and it really makes the design stand out. If you use the Thesis theme, using thumbnails for posts is as easy as it gets.

5. Numbered page navigation

At the bottom of the homepage on Blogussion, you can see a list of pages you can visit on the blog. All of those numbers link to a page full of articles on them.

Using numbered page navigation gets a lot more posts available to readers, which increases pageviews and can really show off the age of your blog with the more number of pages you have. It is a much more effective method of navigation than the standard “previous” and “next”post links that is standard on many blogs today,

Here is the plugin I use to represent page numbers on my blogs. It is very simple to use and comes with some great pre-styled themes.

Download WP Page Numbers

A Little Goes A Long Way

If you implement these five minor changes on your blog, you should see some real improvements to your blog usability wise. As I mentioned in this article, every little detail counts and if you can make your blog more convenient in even the smallest ways – you will see small rewards.