Cut Category Clutter and Toggle Visibility

54

Grouped Categories
Photo by *Micky*
Categories are very easy to set up in a blog. So easy in fact, that we can often get carried away and end up with dozens of categories, all clogging up space in our sidebars. Rather than deleting these categories, we can remove the clutter by linking the categories into groups.

We then show only the group titles in the sidebar, and when a group title is clicked, the list of categories in that group expands beneath it. You can see a demo here.

This solution is very easy to implement, will remove the clutter for the vast majority of your users. For your users, and search engines, who have disabled Javascript, the complete list of categories will be shown as normal (And for the code junkies, it’s also XHTML valid!)

Read More »

Make Sense of Your Blog With Proximity

13

Each page on a blog holds a number of different sections. Each section has a distinct purpose, for example; the title gives a name, and the blogroll gives a list of links. For all of these goals to be fully achieved, each section must be clearly marked out, and then distinguished from its surrounding sections.

Often the most effective way of doing this, is simply through understanding the concept of proximity (closeness). In normal terms:

If a number of objects are physically close together, the brain will classify them as a single group.

To take an example, look at the following image of 4 copies of the Pro Blog Design logo:

Proximity

Read More »

Weekly Wrap-up: War on Clutter

22

Clutter
Clutter by di_ana
Every Sunday, from now onwards, I intend on writing a Weekly Wrap-up post. The post will first of all present a set of links on a certain topic, related to blog design of course. After the links, I’ll write a little summary of anything special that happened on Pro Blog Design that week, and any comments that really stood out to me.

So without further ado, the first wrap-up is on de-cluttering your blog.

About a week ago, Darren Rowse set his readers the task of de-cluttering their sidebars, as part of his 31 Day Project. Of course, Darren’s blog has around 30,000 readers, so when he says to do something, mere mortals must do. The object of de-cluttering is to remove all of the “cool” widgets and such that have built up over time, but aren’t benefitting your readers. In response to this task, Mihai wrote up a list of everything in his sidebar, and assessed individually whether or not he should keep each one.

This is a great way of removing clutter from the sidebar, but what about the rest of the blog? Cue Skellie. Skellie has written up the most fantastic list of 50 Ways to De-Clutter Your Blog. Whilst I may not agree with them all, I can guarantee that you will find at least a few points which apply to your own blog, leaving you with some decisions to make.

Read More »

Design Review: Carlocab.com

18

Carlocab Carl Ocab writes a blog on how to make money online. There are many, many sites about making money online, but this one is different. Carl is 14 years old. Starting at age 13, he has worked up his way to 300 subscribers, and designed the theme himself! When Carl asked for a review, I was happy to oblige.

What Has Been Done Well?

  • Style. Carl is 14, and he’s proud of it. Perhaps the site could have looked more professional? Traditional? Dollar-bill-green? Instead, Carl’s theme is modern and forward. It’s a new generation. New advice. A classic design just wouldn’t cut it for him.
  • Color and logo. The color and logo are the main proponents of the style here. The highly contrasting black and white colors, mixed with the dark red look modern. The logo is fantastic, not because of the modern font, but look at the decoration behind it. It’s not just a decoration. It’s a graph! A perfect fit with the blog’s topic.

Read More »

The 2 Methods of Showing Excerpts

147

Cut Out People
Photo by Linek
There are many reasons to choose to publish either full posts or excerpts on the homepage. Full posts are very simple to implement. You simply write, then publish. However, if you have chosen only partial posts, then Wordpress users have two different methods which will achieve the same effect.

Method 1: The More Tag

This method is usually the easiest of the two. When you have written your post, select where you would like to make the cut-off between the partial post for the homepage, and the rest of the page, then click the More button (More).

Read More »

Full Posts vs. Partial Posts, on the Homepage

56

Posts in Pieces
Mirando Así Arriba by Corazón Girl
One of the most immediately noticeable aspects of a blog is whether or not it publishes complete posts on its homepage, or partial posts. Are you going to have to load another page to read the first article in its entirety? Or is it already laid out in front of you?

Many blogs publish partials, and many publish excerpts. Which method is best?

In Favour of Full Posts

Some of the advantages of displaying the complete posts are:

  • There are no interruptions. If someone has read the first few paragraphs of your post, then they are involved with it. Giving a partial post breaks the reader’s flow. This can be particularly damaging if the post is dealing with a rather complex idea, where breaking the train of thought may end up with the reader being lost.
  • Short posts look good in full. If a post is 5 paragraphs long, and you usually show an excerpt that is 3 paragraphs long, is it really worth loading the second page for the sake of 2 paragraphs?

Read More »

Perfecting Your Printed Posts

20

We have talked before about the basics of making your blog printer friendly. Whilst that will ensure that your content is legible on paper, what if you want to do more? What about sorting out the rest of the troublesome parts of your design?

With some simple adjustments to your print.css, you can make your blog truly printer-friendly.

The Header Area

In a single blog post, we might have 3 different headings; the blog title, the slogan, and the post title, and even some information about the post, such as a date. On screen, we can use CSS to style these however we want, but in print, we have 4 large, separate lines of text. It takes up too much space, and is especially noticeable on shorter blog posts. Look at the following example of how a page on Pro Blog Design printed originally.

Print Headlines

Read More »

Page 39 of 411 ...1020303738394041