As a follow up to my article “Four Steps to Successful Banner Ads“, it’s only apt that I address some best practices that should be followed for online advertising in general. From a usability point of view it is necessary to follow these best practices so that user’s are attracted to your ad and actually click it.

Target your audience
In order to drive traffic to your website the first step would be to identify a target audience and build your ad accordingly. For this you will have to take into consideration the relevance of your ad to your customers. Advertise only in areas where your business or service is available. Your ad should be clear and concise and have your company’s name in it.

Dove targetted real women without regard to age, shape, height or nationality, replacing the customary statuesque supermodels in this ad campaign.

Use keywords to narrow down customers
When you use specific keywords in your ad, you automatically weed out those who aren’t your customers. On the other hand it lets your customers know that your ad is relevant to them.

Focus on your product/business’ strengths
Highlight a special feature or a unique offer that your product or business has to offer. This will help you stand out from the rest of the competition. Make sure you include your brand name/logo in your ad. This helps give the customer a sense of trust in the brand.

Giving information about your product along with displaying the company’s logo will help the customer trust your brand

Keep it simple
Keep your ad simple, easy to read and grasp. Avoid the use of jargon, long sentences and complex punctuation. Do not attempt to advertise your product entirely in the ad. Leave the user enough curiosity to click the ad and read more

about your product/business.

Make sure the message is simple. If users can’t figure it out in literally one second, they’re moving on.

Call to action
Write your ad in a way that prompts the user to click the ad and get to your website. The ad should “call the user to action” to “Start Saving Now!” or “Register Now!”

This Harry Potter ad is an excellent example of engaging the user and prompting them to go ahead and click on the ad.


A picture speaks!
Adding an image to your ad will help distract users from the content of the website on which your ad sits. Needless to say your ad will need to establish a connection with the user, describe what users will have to do on the landing page and provide a call to action, all at once.  David Szetela in his article Every Picture Tells a Story: Non-text Contextual Ads explores this facet of online advertising in detail.

The following is an example of how a good advertisement should look like.

Landing pages
Once your user has successfully clicked on your ad, it is essential that he is transported to a relevant landing page. This page must reflect your ad is some way and the user must not feel lost in any way. The call to action on your ad must be reflected on the landing page as well.

Landing pages must keep the user experience in mind and be easy to navigate and clear as far as the call to action is concerned. Make sure relevant information is on the top left portion of your page, as this is where users are most likely to look for information. Marketing Sherpa has an interesting article on landing pages, “5 Ways to Make Your Landing Pages Get Higher Conversions“.

A good landing page will be simple, contain reassuring elements of the company logo and tagline and give cusotmers a reason to share correct information

This week am working on a project that includes banner ads. These need to promote the brand of the company on its website.

The question was: What kind of features should an ad have to help catch the attention of users and increase sales as well. Online Ads have to follow certain Best Practices in order to be profitable.

Primarily these Ads need to reflect the brand of the company while being effective at sales. On the other hand they should also be able to measure the attitude of the customer with regard to the brand.

A quantitative way to gauge the effectiveness of the banner ad would be pretty simple. Web metrics can capture the number of clicks that a banner attracts. Companies generally experiment with combinations of banner size, color and layout to get the best response from customers in terms of clicks.

However online banner ads cannot be considered successful based on clicks alone. The customers feel and attitude towards online banners is just as important if not more.

“As online marketers, we underestimate the level of commitment involved when a consumer clicks through to a website. The consumer is making several assessments in the blink of an eye — will this be a waste of time? Will the site I click to be safe? Will the information I seek be relevant? Will I get what I need efficiently? There is a risk vs. reward scenario that we all play out when deciding to interact with an online advertisement. If we rely too heavily on the website destination to do our talking, we will likely find that no one will be around to listen.”

- Scott Meldrum

The following are a few attributes that make successful ads and drive brand awareness.
Banner Clutter: Keep the banner simple, with a minimal amount of creative elements. The catch phrase should not be wordy. This will help increase brand awareness and the overall effectiveness of the ad.

Connect with the customer: The Ad needs to connect with the customer and make him/her feel that there is a connection between the webpage’s subject matter and the Ad.

Value for the customer: Customers generally have a condition called “banner blindness”. They will ignore an ad unless there is something in there for them. A crisp message with an invitation to the customer to rollover or click the ad should grab their attention.

Customer commitment: Though your ad might “call the customer to action” by having phrases like “Click here”, there needs to be a commitment from the customer’s side to make that click. As Scott Meldrum points out, the customer needs to be assured that clicking the ad will get them what it promises. Hence the ad should state WHY the customer should bother clicking. A special offer or a free gift would go a long way, especially with customers who are already aware of your product.

I had the good fortune to conduct user and stakeholder interviews with regard to an application that the client had developed 6 months ago. The application was up and running and this project was launched in order to look at streamlining the application and making it more intelligent and easy to use.

This is where I came in… My job was to personally fix interviews with the interviewees. The only problem was that the interviewees belonged to several different countries across the world. I must accept however that I have never a more satisfying experience where work was concerned. It was actually enlightening to speak to so many of these people around the globe.

So here’s how an interview is conducted.

Plan:

• Be as thorough as possible with the application in question.
• Prepare a questionnaire on the key issues you wish to explore. The questions would ideally be open-ended.
• Keep a notebook handy to jot down the interviewees answers.

Interview:

• Introduce yourself and describe the project and its purpose.
• Put the interviewees at ease and assure them that the session did not aim to test them. It is the system that is being tested.
• Have them answer the questions that you have prepared.
• Keep the tone of the interview informal.
• Encourage the interviewees to speak freely. However the interview should remain focused on the topic at hand.
• Speak to a variety of people with different roles. Each might give you valuable insights on the application.

Document:

• Assimilate all the key findings from the interviews.
• Work on your report on the interviews.
• Display the key findings from the interviews and the recommended action to solve the issue.
• In the final page of your report list your recommendations and possible action items that your client can take away from your report.

For further reading on stakeholder interviews, I’d suggest “Setting Up Business Stakeholder Interviews” by Micheal Beavers 

Just thought I’d share my favorite UCD blogs with you. These are sites I read to keep in touch with the research on usability. They also make for very interesting reading.

Experience Dynamics: Frank spiller’s blog is something that every User experience professional should read. Frank has the happy knack to hitting the nail on the head with every post. Very practical info out there.

Boxes and Arrows:  In the words of David Moore, Boxes and Arrows is an “Intelligent peer-written journal on information architecture and user-centered design. Lots of practical information as well as conceptual back-up”.

Seven87: With a unique outlook on usability, marketing and customer experience, Charlie Nichols presents usability in a business environment.

Webword: John S. Rhodes operates the WebWord Blog, providing people with intelligent information about usability, human factors, web site design, information architecture, content development, and a whole lot more.

Pantos: Resources galore! Some of the most insightful articles on the web can be found here. It contains excellent guidelines on the design and development of websites.

Ask tog: A webzine with special focus on interaction design. With reviews of real world products/websites, this is one website that you shouldn’t miss.

Smartisans: Articles here are one of a kind. They are succinct while being informative. Descriptions include actual solutions to common interaction design problems.

Re-frame: Paul Adam’s blog re-frame is an interesting look at everyday products and the user/customer experience to be had, first hand.

Headrush: A very optimistic blog about creating better user experiences. It encourages you to create passionate users with the design of your products.

90percentofeverything: A blog that covers every possible area of user experience design with commentary on interaction design, usability, information architecture and a lot more.

Apparently I have earned myself a master’s degree in Web 2.0! You might wanna try it out yourself… its fun. You get to figure out the trademark features of web 2.0 sites. It will make you think for sure!

Our user experience team in office decided to form a small group that promotes the awareness and usage of usability. With this focus, we got to work brainstorming on the best way to put usability, interaction design and information architecture, in laymen’s terms.

We decided the best way to do this would be to start a newsletter. For the articles, we came up with the theme of “Weave a story”, which would be stories of everyday situations that go wrong because of bad design… this was inspired by Donald Norman’s book “The Design of Everyday Things“.

While looking for appropriate content for this article I ran into a couple of sites that I thought were just right… especially when you want to make a point. The thing about usability is that most people can’t seem to understand what exactly usability is trying to accomplish. You need to illustrate your article or presentation with a lot of pictures and examples. With sites like bad user interface gallery and re-frame, your job is half done!

The next section of the newsletter involved putting together simplified definitions of terms like:

Wireframes

Heuristic evaluations

Card Sorting

Personas

Usability testing

IA One Sheeters is a site that gives you condensed but rather efficient mini brochures. I found this rather helpful, especially because they are easy to understand.  

Stumbled on this interesting website today. Its got a nifty little quiz that determines the kind of blogger you are!

I found that

Take a look at these resources of free icon and font sets.  Its the designer’s proverbial pot of gold. Whats more… there are pointers to places where you can find even more.

Iconsets

Silk Icons: “Silk” is a smooth, free icon set, containing over 700 16-by-16 pixel icons. There are a large variety of icons, you’re sure to find something that tickles your fancy. The USP of this iconset is that they are too neat to ignore.

Sweetie Icons: Another adorable set of pixel icons with the relevant photoshop files included. 

Mini Pixel Icons: N design Studio has done it again! Over 320 mini pixel icons for free. Designed with a transparent background, they have been created with the header and side navigation in mind.

Supercool Free Icon Sets: A collection of 50 cool icon sets, that cover everything from charts and blogs to the iphone and vista. 

20 Free & Fresh Icon Sets: Over 20 fresh and free icons sets that are nice to look at and are user friendly. However, please read the licence agreement carefully before you use them. It might change from time to time.

Freebies Round-up: Some more fresh high quality icons, buttons & vector graphics.

Fonts

Neat Fonts: Free fonts collected from around the internet.

Logos of Web 2.0: What are the traits of Web 2.0? Ajax and online communities aside, it is appearance that is characteristic among these brands. Logo’s are developed from large fonts and seem open and friendly. Here’s a list of the fonts that are used in some of the popular web 2.0 websites.

Great Fonts for Web 2.0: A roundup of some fonts that have found popularity recently.

80 Beautiful Fonts Typefaces for Professional Design: A selection of 80 gorgeous typefaces for professional design, based upon suggestions from designers and web-developers all over the world.

When there is a site to design, there are a lot of people who become information architects at the drop of a hat. Everyone considers himself/herself an expert on the topic. All of a sudden the designer becomes a mere puppet and is reduced to someone who simply executes everyone’s ideas in the form of a web page.

Matthew Inman in an article on http://www.seomoz.org/ calls this the design curve. According to him the more the wrong kinds of people get involved with the process, the worse the design gets.

He defines the right and the wrong people to get involved in the design process of a web site.

The right kinds of people:

• Anyone who has designed anything visual
• Usability expert
• Someone who offers constructive criticism
• Those who leave the designer to do the job

The wrong kinds of people:

• Non-designers
• Management types who have no design experience
• Those who think that flashy and graphic heavy sites are still hot
• Clients who have a little experience on the internet and feel that they have an “edge” over others in web design. 

Read this amusing and interesting, but very true article for details.
http://www.seomoz.org/blog/how-to-ruin-a-web-design-the-design-curve
 

Tables can be a nightmare to deal with, especially because they have become the mainstay of many a developer who throws the standards to the winds. Of course if tables are used to do what they are meant to do, displaying tabular data, they can make life a lot easier.

 Enter TABLECLOTH. Table cloth takes good well formed code and applies styling and behavior to it and voila!!! You have a styled and active table.

Other css styled tables

 The ever enterprising Veerle has a css styled table of her own. http://veerle.duoh.com/blog/comments/a_css_styled_table/

An excellent example of a striped table is available at Validweb http://validweb.nl/artikelen/javascript/better-zebra-tables/

Spice up your table with rounded corners and snazzy backgrounds offered at 24 ways
http://24ways.org/2005/tables-with-style

My colleague did some looking around and suggested I add CSS Table Gallery to the list. I’ve visited the site before and even used the tables listed there. It’s a showcase of how CSS and tables can work together in harmony.