plainbeta

How to Use Your Sidebar to the Max

Sidebars are often overlooked, but in truth, an effective sidebar is key to retaining visitors.

Why?
Lemme explain.

With a standard (well designed) web site, visitors can arrive at a page (ideally) within 3 to 4 clicks. The nature of a standard static web site allows the navigation to work that way.
Blogs cannot work that way.

Blogs rely upon new an unique content that is sometimes posting new content 20+ times a day (like Engadget). It is impossible to build a site’s navigation to allot for that much content.

That is where the sidebar comes in.
The sidebar’s purpose is to drive visitors further into your web site.
Not all visitors may be drawn in by the particular posts that happen to be displaying on your home page at the time of their visit. Or even if they do, the sidebar should be designed to further grab their attention and turn a one-time-visitor in to a subscriber.

This requires a well designed and pruned sidebar for your web site.

What Goes in a Sidebar?

Common elements of a sidebar:

• RSS Buttons
• Search Form
• Recent Posts
• Advertisements
• Popular Posts
• A List of Categories
• Navigation
• Sideblog (a Asides, or Twitter Updates)
• Author Info

All blogs are different - therefore what goes into the sidebar will vary from blog to blog.
New blogs won’t be able to have a “Popular Posts” section, some blogs won’t need a Sideblog - all blogs will vary. Some blogs won’t even need their RSS feed in the sidebar if they have it elsewhere!

Use it to the Max

When designing your blog, make a list of all the components you want in your blog (search form, popular posts list, RSS buttons, advertisements, etc.)
Then figure out what is going in the header and footer - what ever isn’t going in either (and is necessary) put it in your sidebar.

More important items should go towards the top.
Items like your RSS buttons, search box, and advertisements should always be above the scroll.
After those items the rest should follow in order of importance.

Each item should be unique and different from one another. Naturally, the more important items should stand out more.

Good Sidebar Designs

ProBlogDesign.com
PSDtuts.com
Skelliewag.org
I Love Typography - though possibly a little big…
Abduzeedo

It comes down to a logical thought process - analyzing your blog’s needs and the options before you.

Further Reading
ProBlogDesign.com’s Sidebar Redesign Thought Process
Sidebar on the Left or Right? - Pro Blog Design
50 Tips to Unclutter Your Blog (Including 27 tips on how to unclutter your sidebar) - Skelliewag

Plugins
Sideblog Plugin
Twitter for Wordpress
Popularity Contest - note, plugin does not work with Wordpress 2.5 as of 4/23/08

It’s Complicated… - The Power of Minimalism, Part 1

Part One of The Power of Minimalism

Minimalism is arguably the most effective form of web design currently in existence.

Visitors don’t have to wait for annoying flash animations to zip across the screen…
Nor heavy images and graphics to load…
Nor try and figure out confusing animation…
Or anything annoying design related ‘harassment.’

Minimalism fights against it all.

The problem with minimalism is it’s complexity.

Yes, that’s an oxymoron.
But it’s true.

Minimalism strives to remove as much as possible from the design as well as keep as much as possible in the design.

Yes, that is another oxymoron.

Think about it.
Good minimalist web sites (usually) employ simple navigation, simple graphics (or an image), a logo, and effective colors.

Those four components form an extremely delicate balance.
If one element is a little too much, the entire formula can be thrown off.

Even though minimalism is one of the greatest forms of design out there, it is the most difficult to use to it’s full potential.

I have addressed minimalism before, and perfecting Minimalism has become sort of a passion of mine.

Thus, I shall be turning this into a mini-series, and (eventually) write an eBook on Minimalism.

If you know of a good Minimalist web site, please let me know.

Again, stay tuned for the rest of the mini-series.

Minimalism - A Designer’s Excuse

Sorry for the lack of posts, but circumstances have prevented me from being able to post.
However, the lack of posting has given me lots of time to think.
And since I have several web site designs going right now (more than I probably should), I have been thinking a lot on, well, web site design.
So, let’s examine one of today’s web trends.

Minimalism

First off, what is minimalism?

Uh…
Well…
You can’t really describe it in detail.
I’ve explored the topic before, and I received very mixed responses.

But in short, Minimalism is a web site that is stripped down to just the basics to put the focus on the content and decrease load time.
There are many other factors to consider, but I have found that the previous statement is pretty general all across the board.

The discrepancy often centers around how little is minimal, and what can be included in minimal sites.

I think it’s [JustinBlanton.com] not to minimal. Sure it might not have an identity but it still works. I think a site will be to minimal when it has bad usability. You could argue in a way that apple’s iphone is to minimal because it takes 2 click to switch programs. I am in no way saying its an unusable phone. Don’t flame me boys.
-Jonathan Solichin

RandomJabber.com and SkellieWag.org are not minimal list. They employe heavy graphic elements. Especially Radom blog you can see too busy at the side bars and at footer.
-Binh Nguyen

Ultimately, I don’t think you can put a checklist on minimalism.
Minimalism is a general category that cannot be nailed down into a science.

Ok, let’s move on.

The Excuse

Since I’m a web designer, I’m trying to immerse myself in good web design so it is always at the forefront of my brain, and thus, shows up in my designs.
In my ‘immersion,’ I’ve been following and browsing many design galleries.
In doing so, I have seen a lot of minimalist web sites.

Most of them suck.

Why?
They’re not very thought out.

Minimalist designs rely heavily on the design’s grid, the identity, colors, and a graphic (and/or photo) or two.It seems that Minimalism has turned into an excuse for designers to not design.

Minimalist designs must be very thought out and extremely effective in order to be ‘good.’

What Makes a Minimalist Site Effective?

I believe I’ve covered this before, but I can’t quite remember.
So let’s look at it again.

A Good Logo

Having a good logo increases memorability tenfold.
It defines your brand and sticks in your visitors heads.

Emphasis on the Content

This can be achieved many different ways.
Colors are often used for this.
By having the content’s background a different color than the rest of the web site will draw the eye to the content. ProBlogger is a good example of this.
Also, placing images in the post headers accomplishes the same thing - like Skelliewag.

These are just two ways to do so - but the possibilities are endless.

Simple Messages

Simple and effective messages are also very memorable.
Like how my tagline contains just three words: “Design & Blogging.” Instantly, visitors know what my web site is about. Unfortunately, the message isn’t as prominant in this design as I’d like it to be. I’ll fix that in my upcoming design.

However, Wake Up Later is an excellent example of a simple message and conveying it well.

Icons

Icons are also nice touches.
They can be memorable (especially if they’re unique icons) and they add splashes of color and imagery to the design.

Thoughts?
Is Minimalism just turning into a designer’s excuse?
How can we avoid the excuse and use Minimalism to it’s full potential?

Cartoon via World Magazine

If Content is King, What’s the Queen?

We all know that in the web world (especially blogging), content is king.
But what is its queen?

I would have to argue the queen of the web is design.

Presentation is (Almost) Everything

Think about it.
I went on over to Google and search for “Free Web Site Reviews” and got ‘about 84,200,000′ results. (yes, that is how many results come up)
Two web sites caught my eye. Their titles were nice and the descriptions were exactly what I’m looking for.

I clicked on Site A and the design on the web site is horrible.
It looks as if the designer didn’t care at all about how it looked but only cared about getting the web site online as quickly as possible and filling it with ads.
What did I do?
I left.

Returning back to Google, I choose Site B.
As soon as it loaded, I was confidant that the review service was worth it.
Why? The web site’s design is clean, well done, ordered, and aimed at the visitor.

What was the difference between the two web sites?
Was it content?
…
I’m not sure…
I didn’t even look at Site A’s content…

That is exactly my point.
How many times have you done exactly that?
You went to a web site, it looked horrible, and you moved on?

That is why I say Content is Queen.
Granted, without good content, you will not gain links or regular visitors - but if you do not have good design, you won’t even have any potential readers.

Ok, so now what.

Enrapture Your Visitors

You have about five to ten seconds to keep the majority of your visitors.
In those moments, you need to show your visitors what your web site is about, why they should stay, and how they can dive into the content.

Probably the best example of doing so is Apple.com.

Apple’s home page is simple and to the point.
You look at Apple.com, and you know what the site is about and have reasons to dive in.
It looks nice and is easy to understand.

Just how do you take advantage of the Queen of the web?
Well, that’s what plainbeta is all about.

Stick around as we dive into the ins and outs of design and how to take full advantage of her.

What Makes a Web Site’s Design Look Beautiful? 7 Ideas for You to Think About

Filling the World Wide Web is web sites with gradients, patterns, animation and more. Lots of them look great!
And then there’s simple web sites that also look great!
We have web sites of all kinds and they all look fantastic.
But, then again, there are other web sites that employ the same principles that look horrible!
Why?

Therefore I have a simple question for you.

What makes a web site’s design look beautiful?

I think this question haunts all web designers who are truly concerned about their work - I know it does me.

So what makes them look good and others with similar principals look bad?

Well, here are seven rules I’ve noticed that work, though every rule is meant to be broken. ;-)

1: Easy Navigation

Being able to easily navigate a web site is the most important part about a site, if your visitors can’t get around, they won’t stick around.
Example: Toggle - easy, concise, and prominent navigation

2: Images

Some sort of high-quality and related photo adds greatly. While photos can help, they’re not for all web sites.
Element Fusion - Web Site Development - a single photo drawing attention to the site’s message.

3: Graphics

A logo of some kind is necessary for virtually all web sites. Supplementary graphics are helpful as well.
Elixir Graphics is pretty good on both points.

4: Color

Three or more colors working together gives the web site a professional and thought out look. Personally I like web sites with two main colors, a main accent, and one or two subtle accents - if you follow me.
Design Snack is a pretty good example.

5: Engaging Content

Some may say ‘well duh’ to this one, but images, animation, and graphics used in the right setting it is a powerful tool. Keep in mind that such ’spices’ don’t always work for a web site.
Drew Wilson - A nice header and good images in the content. Granted, it’s a portfolio, but it’s still nice.

6: Minimalism

Stripping everything off a web site excepting the content is very effective - in most circumstances, but not all. If done right, minimalist web sites can be more effective than the most flash saturated web site out there.
Brandon Muth is a great example of minimalism and color.

7: Animation

Animation accents can be very powerful and very dangerous. If used effectively they will give your web site a professional flare - used incorrectly and they will slow down your site and frustrate your visitors (this is actually one of my biggest pet peevs) Make sure your animation is fast loading and doesn’t take forever to zip across the screen - your visitors are interested in your content more than your fancy animation.
Deadly Viper is a great example of using a little animation, but not too much.

I’ve listed just about all components of web design, haven’t I?

Design is a fickle thing.

Be careful with what elements you use in your design.
Design works in some circumstances and not others.

The problem designers have is choosing which components for which site.

In upcoming posts I plan on examining which should be used and when.
So stay tuned.

Img: Stages by Clearly Ambiguous

If Architects Had to Work Like Web Designers

I stumbled across this and couldn’t help but sharing it.

Have any of y’all had one of these clients?
I sure have…

Note: It may be a ‘long’ read, but it’s quite humorous.

mc-uh-oh, #1 by daveisnotmyname

Dear Mr. Architect:

Please design and build me a house. I am not quite sure of what I need, so you should use your discretion. My house should have somewhere between two and forty-five bedrooms. Just make sure the plans are such that the bedrooms can be easily added or deleted. When you bring the blueprints to me, I will make the final decision of what I want. Also, bring me the cost breakdown for each configuration so that I can arbitrarily pick one.

Keep in mind that the house I ultimately choose must cost less than the one I am currently living in. Make sure, however, that you correct all the deficiencies that exist in my current house (the floor of my kitchen vibrates when I walk across it, and the walls don’t have nearly enough insulation in them).

As you design, also keep in mind that I want to keep yearly maintenance costs as low as possible. This should mean the incorporation of extra-cost features like aluminum, vinyl, or composite siding. (If you choose not to specify aluminum, be prepared to explain your decision in detail.)

Please take care that modern design practices and the latest materials are used in construction of the house, as I want it to be a showplace for the most up-to-date ideas and methods. Be alerted, however, that kitchen should be designed to accommodate, among other things, my 1952 Gibson refrigerator.

To insure that you are building the correct house for our entire family, make certain that you contact each of our children, and also our in-laws. My mother-in-law will have very strong feelings about how the house should be designed, since she visits us at least once a year. Make sure that you weigh all of these options carefully and come to the right decision. I, however, retain the right to overrule any choices that you make.

Please don’t bother me with small details right now. Your job is to develop the overall plans for the house: get the big picture. At this time, for example, it is not appropriate to be choosing the color of the carpet.

However, keep in mind that my wife likes blue.

Also, do not worry at this time about acquiring the resources to build the house itself. Your first priority is to develop detailed plans and specifications. Once I approve these plans, however, I would expect the house to be under roof within 48 hours.

While you are designing this house specifically for me, keep in mind that sooner or later I will have to sell it to someone else. It therefore should have appeal to a wide variety of potential buyers. Please make sure before you finalize the plans that there is a consensus of the population in my area that they like the features this house has. I advise you to run up and look at my neighbor’s house he constructed last year. We like it a great deal. It has many features that we would also like in our new home, particularly the 75-foot swimming pool. With careful engineering, I believe that you can design this into our new house without impacting the final cost.

Please prepare a complete set of blueprints. It is not necessary at this time to do the real design, since they will be used only for construction bids. Be advised, however, that you will be held accountable for any increase of construction costs as a result of later design changes.

You must be thrilled to be working on as an interesting project as this! To be able to use the latest techniques and materials and to be given such freedom in your designs is something that can’t happen very often. Contact me as soon as possible with your complete ideas and plans.

PS: My wife has just told me that she disagrees with many of the instructions I’ve given you in this letter. As architect, it is your responsibility to resolve these differences. I have tried in the past and have been unable to accomplish this. If you can’t handle this responsibility, I will have to find another architect.

PPS: Perhaps what I need is not a house at all, but a travel trailer. Please advise me as soon as possible if this is the case…

Web Designers are Unique Artists - but Most Fail to Realize It

Let’s take a look at something near and dear to my geek-heart - web design.

Let’s look at ‘web design’ this way.

Are you a web designer?
Then you are an artist.
But, you’re not what most people think of when they hear ‘artist.’ You’re a unique artist. Your art is interactive.
What you create is not just a static piece of canvas to be hung on a wall.
What you create is a mix of visual beauty and interactivity.

The interactivity is what most web designers fail to remember.

…there are some instances where it’s more than appropriate to adorn every margin, button and headline with fancy ornaments and sparkly rollover effects.
Generally speaking though, these trinkets are not only superfluous, but end up being distractions that devalue the content on your site, further complicates it’s learning curve, and conceals whatever it is that your visitors came for in the first place.
-Lee

Do you get where I’m going?
No?

Ok, let’s back up.

You’re a web designer.
What are you creating? A web site.
Why would someone want to visit your web site? The content.

Remember the content?
The whole reason you’re creating this web site?

You see, web design is knowing your canvas. (-nclud)
And in order to know your canvas you need to thoroughly understand three things: what your medium is, who’s examining your art, and why they want to look at your site.

What’s the Medium?

What’s the medium you’re using to convey your information?
A web site of course!

That web site has two specific limits.
-A computer monitor.
-The particular coding you’re using. (CSS, Flash, PHP, etc.)

So, what ever you design must be displayed on a computer monitor (of varying sizes, resolutions, and colors), and must have proper code in order to actually be displayed.

Ok, so there are your limitations.

Who’s Examining Your Artwork?

Well, you could probably tell me more about the type of person who’s viewing your web site, but I can tell you three things.

1. It’s either a human or a spiderbot.
2. The human is using a web browser.
3. The person may or may not know a lot about the internet and how to surf it.

While those three things may seem rather simple, they do have a lot of implications.
Before you design a web site, think about them.
1. Your web site’s viewers are human, just like you are. And also don’t forget those wonderful Google spiderbots that crawl through your web site’s guts.
2. The browser could be Internet Explorer, Firefox, Safari, or any one of a myriad of web browsers on various operating systems. So take those into account in your web site design.
3. Consider the knowledge base of your audience in your design - he/she may not know as much about the web as you do. Everyone views the web for the first time! Would someone who’s new to the internet be able to easily browse your site with as much ease as a seasoned web viewer?

Why Does Someone Want to Look at Your Web Site?

What drives someone to view your site?
Is it the fru-fru graphics? Or the content?
What specific parts of your site are more important than others?
Which ways will someone want to view your content?

Do not forget that it is the content that will keep your visitors returning.
If the visitor cannot easily dive into your content than he/she will simply switch back over to Google and find someone else with the simple click of a button.

Now Think

The design of the site is much more important than the coding or graphics.
A good design will keep visitors returning. They’re the reason you’ve created the site after all.
Don’t dismiss the layout of your web site. It’s more important than most think.
So think long and hard about it.

Good design = Good web site = Returning visitors

Image credits:
Grand Street: Painter by moriza
I bought a Magnifying Glass by vivalibre574