Mar 30, 2010

Web Safe Fonts

Not every font that is installed on your computer can be used on your website, because not everyone that views your website has the same fonts installed on their computer as you. In an effort to keep websites looking similar between different browsers and operating systems, web designers can choose from certain fonts that are “web safe” and reliable. […]

Feb 2, 2010

What is Whitespace?

Whitespace—or, negative space—is the open space between elements in a design. The space can be a color other than white, as long as the area is void of elements.

whitespace

It’s common for whitespace to be seen as “wasted space,” especially when you are working with a limited area. After all, why wouldn’t you want to take advantage of every inch of space in your advertisement / brochure / website?

You may be surprised to know that the space that is empty is just as influential as the space that is filled with text and photos.

Using Whitespace to Your Advantage

When there are too many elements in a design—whether those elements are photos, fonts, or headlines—it appears cluttered and crowded. Imagine a room filled with people that are talking at the same time. Would you know who to listen to first? How long would you stay?

Removing unnecessary elements in your materials not only de-clutters the design, but it also places more emphasis on the most important message.

One company that has learned this lesson is Apple. Their advertisements are famous for their simplicity and use of whitespace. Take a look at their homepage from October 2009:

apple-screenshot

Immediately, you are presented with three things: An interesting image that grabs your attention, a short explanation of their latest product, and their call to action, “Watch the iMac video.” They are using whitespace to direct their customers to the most important information within seconds, and to show them where to click next.

Now, Apple has the advantage of being a household name with millions of fans worldwide who are already familiar with their products. Most businesses will probably need to present a bit more information, in order to convince potential customers that their products or services are worth the price. However, the same concept still holds true — adding unnecessary information only distracts from the goal you have set; whether that goal is to click on a link, call your phone number, visit your website, or buy your latest product.

Why Simplicity is Important

Billboards are an example of one medium where a simple message is absolutely necessary. Drivers are — hopefully — concentrating on the road, and only glancing up at signs and billboards for just a few seconds. If you can’t condense your advertisement into 6 words or less, then the driver won’t have enough time to read your entire message.

Designing for websites is similar. The average user will decide whether to stay or leave your website within just a few seconds. That means you need to immediately grab their attention, reassure them that your website has the information that they are looking for, and convince them to stay on your website a little longer.

The only way you can accomplish all this is to decide on the most important information, make it the most prominent part of your marketing piece, and get rid of anything that is a distraction. By de-cluttering your designs, you are able to guide your potential customers to the information that you want them to read, and create truly effective promotional pieces.

Some Tips for Reducing Clutter

  • Use headlines and sub-headlines to break up large areas of text. This allows the reader to quickly scan the text to get a summary, and to skip to the section that interests them.
  • Use simple language. Make your text easy to read and understand, and avoid overly technical language that would be overwhelming and confusing. If your text looks like a lot of work to read, your readers will simply go elsewhere.
  • Create a focal point. If you have several images on a page, your viewers won’t know where to look first. Make one or two of your images more prominent, and place your call-to-action nearby.
  • Create Relationships. Group related items (like a photo, description, and link) together so they are seen as one element instead of three. You can do this by making the space between these elements smaller than the space that surrounds them.
  • Add Whitespace. Make sure there is enough space in your margins, between paragraphs, and around your elements so the overall design is clear and easy to understand.

Back in the infancy of the world wide web, frames were a pretty useful tool.  They allowed a designer to have multiple panels on a page with one or more displaying consistent content (like a menu).  With the advent of the modern web programming languages such as Active Server Pages (ASP), PHP & ASP.Net, frames are now really nothing more than a relic of the past. In fact, they can actually be harmful to your site’s performance in the search engines and your customer’s user experience. […]

Time to Update

A lot of time and effort goes into setting up a website when it is first created, but once the website is launched, the work is not over! Think of your website as a constant work in progress. Every day is a new chance to make a great first (or second, or third) impression.

How often you update your website should be based on how often you expect visitors to return. If you have a blog and want people to come back every week, make sure that you have new articles every week. If you have a simple, service-based website that people don’t need to visit that often, then just check back once or twice a year to make sure the information and links are still accurate.

Here are six reasons why you should be updating your website content on a regular basis: […]

Empty plastic bags roll through a cracked and patched pavement parking lot. Shopping carts are scattered about… some maneuvering themselves unmanned through the rows of unpopulated parking spaces of the Electronics-O-Rama. The store signage is in disarray, and the glass of the storefront is fogged and dirty. The color scheme of the decrepit building is like that of a circus tent, plastered with fliers and promotional signs made with poster-board and Sharpies. However, on the inside of this dilapidated place of business is the brightest team of individuals ever to be in customer service, and their product is one in a million. No one comes close in either quality or customer satisfaction, but few customers have even thought twice about giving them the chance to prove themselves.

Electronics-O-Rama suffers from poor perceived credibility. The surface of their business, the “visual handshake,” is lacking a quality that the competition offers, though the competition can’t offer the same quality product or service.

Just how important is perceived credibility? Many small retail establishments have faded over the years to flashier, bigger, chain retailers providing the same products with worse customer service, or in some cases worse products (and customer service). What makes Best Buy more credible than Joe’s TV’s? The answer…

[…]

There is a book in our office that has been required reading for all staff members for the last 3 years.  This book is called “Don’t Make Me Think” by Steve Krug.  The book is about usability of website design and how you don’t want to have your site visitors have to think when they visit your website.  There should be a clear purpose to the site that spells out to the site visitor what you want them to do next, whether it is to fill out a contact form, buy a product, pick up the phone and call you, request a quote now, search for a dealer in their area, refer your site to a friend or apply now.

Don't Make Me Think - Book

Don't Make Me Think - Book

The book is deceptively simple and most of the information in it seems so straight forward and obvious, because… well, it is.  It is a clear message that doesn’t require thought and offers examples of how to enact better usability on your website, or websites you produce.

It is easy to get caught up in the message of your site without thinking about how that message is being received by others.  Sure a 5,000 word dissertation on what your product does can be informative, but it can also be overkill, or even boring and not worth the time of a busy internet suffer who is just trying to determine if your product can provide the particular benefit they are looking for.

When you are the provider of a product or service it is easy to be too close to the message – too “in-the-know” to be able to see how the site is coming across to others who are not “in-the-know” on your product or service.  Maybe usability testing is something you should consider.  This is basically a test audience who does not know your company and it’s products or services.  Let them navigate your site and see if they get it as quickly as you think they will.

Usability studies can be as simple as inviting a trusted friend over to try out your site and give feedback to doing a full fledged study with hired testers, video taped sessions, surveys and reporting.  However you do it, do at least something so you have good, third-party feedback on your site.

Most importantly, think of your call-to-action – that clear purpose to the site that spells out to the site visitor what you want them to do next.  Make sure your call to action is ever-present, on every page, reminding your visitors what you expect them to do next.  Sometimes a little redundancy is ok.