Web Design Usability Guide – Dealing with Images

Indeed, users want to see photos on websites, but they want them to be relevant. They would prefer a webpage that doesn’t have visual images rather than a webpage that has lots of photos that just make it heavy and cluttered. The key in using images on websites, according to the study, is based on a few basic ideas:

Image fundamentals – size, composition, quality and exposure are four important things to look for in a good image. People actually look for quality in images, even the contrast makes a huge difference.

Effectiveness – if the picture creates excitement or interest, then it works. It is down to three characteristics:

Emotional appeal – does the product in the picture look good and make the user want it?

Rational appeal – does the image show the benefits of the product?

and Brand appeal – does the picture fit your brand?

Transmittedmessage – this is about the image sending the right message to the website readers.

Anticipateduserresponse – this is a bit more difficult to put into practice, but the basic idea behind it is that the picture should help decision-making and create a desire for the product. We will talk about this a bit later.

Purely decorative images tend to be ignored unconsciously by our brain. Like a radar, if the images are there only as a filler, the brain will ignore them. The study concluded that pictures and images of real people or real products are automatically categorized as important and are to be studied in detail by the human brain. If you have a personal blog, people would rather see your face than a drawing or a caricature. They want to see the face of the person communicating with them, it is a matter of trust and bonding.

If you own a company, it is a very good idea to take some time talking about the people behind it – using images. It gives a personal touch to an otherwise faceless company and people dig that. People actually want to know (or at least see) who the people are behind a company. If you can afford it, invest in a good photographer and try to stay away from stock pictures (especially from stock pictures that aren’t relevant to your content). It might cost a few bucks, but it will add a lot of value to your company website.

Several eye-tracking study show that the more detail your product images have, the better the results you will have. Yes, studio pictures of a big flat screen TV work just fine, but is just fine good enough for you? People want to see details, show them!

Quality and relevance

Below I will show you some results of different studies. You will see several websites marked with heat zones. The red areas indicate where the users’ eyes were mostly focused, while the blue areas show the exact opposite, indicating what is ignored or a turn-off for visitors.

Eye-tracking study on Adelphia’s website

Besides the fact that it is an incredibly outdated design, you can clearly see that none of the heat zones are on images. It is because all the images embedded in their webpage are purely fillers. Had they been using relevant pictures, the heat zones might have been a bit different, but for now it shows how much of a waste of space images are on their site.

Another good example can be seen below. New York Magazine’s restaurant section has also been part of the eye-tracking study and it shows that even if worldwide known chefs are featured in images, the quality is still important. So even if the pictures are somewhat relevant, low-contrast and small size images are simply ignored. Image quality is as important is the relevance of the image being used. There has to be a balance, where quality and relevance are the two guiding principles.

Eye-tracking on NY Mag’s website

Jakob Nielsen and Kara Pernice wrote an article entitled “Images as Obstacles” some years ago. The images above are courtesy of Peachpit and the amazing heads who published the study. Thank you for your tremendous work!

Companies invest thousands of dollars when they want to redesign their website, hoping that a more attractive design will lead to more revenue. But does it really matter? Is simplicity more important than eloquent design? Where do you draw the line between simplicity and overkill? What really matters to users? While the ‘wow factor’ may leave a positive impression on investors, banks and even prospects, does it lead to more sales?

A minimalist site design like Wimp gets 4 million unique visitors a month and at its peak this past year reached 8 million uniques a month.

So is simplicity the key? Or does a crowded website with lots of information on each page work the best?

According to studies cited by usability.gov, having a credible looking website scored a 4 out of 5 on the relative importance scale. While it’s difficult to know for sure if good design means more revenue, we do know a few key design principles to keep in mind when designing a site.

In this post I’ll explore professional research that can potentially offer insights into what priorities a business should have on its web design. I’ll be addressing the common questions that many website owners have and attempt to offer tangible solutions.

How Important Is An Uncluttered Website?

Having an uncluttered design is crucial if you want to make your website appear professional. Making it clean does appear to be an important characteristic for websites. Furthermore, it’s important to be consistent with where you keep your important items. Users who know where certain items are on your page(s) will be better able to use your website, thus improving web usability. Make use of navigation tabs and keep them in the same location on every page. Having a consistent website is key.

Here’s an example of a crowded site with too much to look at:

I counted the links above the fold and there are 49 links available to click on. If you include the drop down menu links, there are 135 links total; and this is just above the fold. Factor in all the different colors on the site as well and you can see why it’s poor design.

Here’s what good design looks like:

Their users are given the choice of 15 links to click on the entire page. They feature beautiful images of their product in action, have a call-to-action and a clearly defined goal that they want. They want users to fill out those three forms and sign up. Under the fold, links are faded out until you move your mouse around them.

Ask yourself: which site looks more credible? Which one are you more likely to give your credit card to? While this is an extreme example, it illustrates the point that an uncluttered, clean design is important.

This world has now turned into a global village. Internet is being used all over the world and this is exactly why each and every brand wants to have their own website in order to promote their business and brand. Websites are considered to be a true representation of any company so one should provide special attention to all the major and minor details of a website. If you have manages to create a website which is user friendly, you have made a great website.

After all, the websites are developed for the users and they are not interested in knowing how and when it was developed. They just want a smooth running throughout the website. If your website is a combination of good branding, usability, functionality and a great content, you will have a happy user on the other side of computer. If not, you have lost yet another visitor who will never visit your website again because for him the navigation is not as simple as it should have been.

The user’s experience of your website will help a user perceive things about your brand as well. If your site if sufficient enough to provide them with the necessary information, they will have a good impression of your website. If not, you will just end up with a frustrating user. Since a lot depends on user’s mood as well, the thoughts of the users can be subjective but while designing a website, you should keep in mind a few basic points which can help user with an easy navigation. If you follow some set trends and best practices, you can definitely avoid having frustrated customers. Since call-to-action websites have become way too important, all designers and developers pay special attention while designing and developing a website.

This world has now turned into a global village. Internet is being used all over the world and this is exactly why each and every brand wants to have their own website in order to promote their business and brand. Websites are considered to be a true representation of any company so one should provide special attention to all the major and minor details of a website. If you have manages to create a website which is user friendly, you have made a great website.

After all, the websites are developed for the users and they are not interested in knowing how and when it was developed. They just want a smooth running throughout the website. If your website is a combination of good branding, usability, functionality and a great content, you will have a happy user on the other side of computer. If not, you have lost yet another visitor who will never visit your website again because for him the navigation is not as simple as it should have been.

The user’s experience of your website will help a user perceive things about your brand as well. If your site if sufficient enough to provide them with the necessary information, they will have a good impression of your website. If not, you will just end up with a frustrating user. Since a lot depends on user’s mood as well, the thoughts of the users can be subjective but while designing a website, you should keep in mind a few basic points which can help user with an easy navigation. If you follow some set trends and best practices, you can definitely avoid having frustrated customers. Since call-to-action websites have become way too important, all designers and developers pay special attention while designing and developing a website.

It’s a hotly debated issue on several forums and blogs of the sector and that often divides the mass of web designers in two different and opposing factions: I’m talking about the aesthetic aspect of a site and on how it’s appearing in one way rather than in another can enhance or on the contrary limit its potentialities and effectiveness.

A site must only give information and has to do so in the most direct and simplest way possible, as someone says. This is true, but –replies somebody else- it is also important how such information is transmitted and how through shapes and colours, stimulates the curiosity and the interest of the consumer. [Más…] Who begins as a graphic is more likely to believe also that the web design is first of all communication and as such there are strategies and aesthetics needs that cannot be denied: that particular font is more elegant and capable of capturing the attention in one precise point of the layout, this combination of colours makes more confident the reading, that background image has nothing special, but it’s attractive and makes the page more appealing.

Communication , yes, but in a creative way because showcases on the web know how to sell and attract consensus, as already required by a billboard or by a leaflet. Communicate and if possible surprise, dare, create something new and unique , experiment with styles and colours and create something that is not only simple to use but also –above all, perhaps- beautiful to see.

On the other hand, where the concepts of aesthetics and of the “appearing” are just little concrete theories – the idea that a good graphic isn’t a crucial detail of a functional site is becoming more and more popular, indeed. It’s rumoured that graphics are almost an useless distraction, a disorder that make the pages of a site heavy, not accessible, less usable, slow to upload, …etcetera, etcetera.

The general comment, lavished almost as an alibi? “Maybe the sites I do aren’t really that appealing , but at least they’re usable!”, as if one thing could exclude somehow the other.

The reality is that an effective site is yes a usable site and easy to consult, but not only. A white page with textual content, without images and with an elementary browser, is certainly easy to use and to read, but what would the web be if every site was a white screen containing text and nothing else? What would a commercial spot be without the beauty of images at high emotional impact , or without an appropriate background noise? And we should also ask ourselves: but what do we really remember, for example, of these ads, what stroked us, the subject –even if it was a detergent or a car doesn’t care- or the sounds, the words and the colours with which it was advertised?

It’s a hotly debated issue on several forums and blogs of the sector and that often divides the mass of web designers in two different and opposing factions: I’m talking about the aesthetic aspect of a site and on how it’s appearing in one way rather than in another can enhance or on the contrary limit its potentialities and effectiveness.

A site must only give information and has to do so in the most direct and simplest way possible, as someone says. This is true, but –replies somebody else- it is also important how such information is transmitted and how through shapes and colours, stimulates the curiosity and the interest of the consumer. Leer más “Creative sites? Yes, but maybe unusable”

Simply put, usability is making your website easy for your visitors to find the information they need when they need it.

A common misconception about usability amongst web companies is that usability is expensive. Yes, there are multi-national companies that spend thousands of dollars on usability tests and research, but for an everyday company usability is achievable without the knowledge of usability experts or without expensive equipment for testing.

Web designers have an even easier job to do, just by reading usability articles they can accumulate a fairly good knowledge about usability basics and how to implement them on a website.

Simply put, usability is making your website easy for your visitors to find the information they need when they need it.

A common misconception about usability amongst web companies is that usability is expensive. Yes, there are multi-national companies that spend thousands of dollars on usability tests and research, but for an everyday company usability is achievable without the knowledge of usability experts or without expensive equipment for testing.

Web designers have an even easier job to do, just by reading usability articles they can accumulate a fairly good knowledge about usability basics and how to implement them on a website.

Today’s post is a big one and it’s most definitely one for your bookmarks menu, because from time to time when speaking with clients it becomes necessary to have material to backup the statements which you are making.

Sometimes clients will suggest things such as forcing all users to register with a six page long form before they can even access the site. They aren’t web professionals, it’s not their fault for not knowing that this isn’t a good idea from a usability perspective.

If you’re going to convince them that this is a bad idea, however, then you’re going to need some rock solid material to back that up. While an element of trust is always important to a working relationship, you have to respect that sometimes clients will just need to see the facts in front of them to fully understand that what you’re saying is correct.

So, what we’ve done for you today is compiled a list of some of the biggest, most compelling usability articles which address common issues. Hopefully this should help you during tough conversations about what does and doesn’t work on a a website.

Bookmark this post, come back to it, use it in meetings and educate your clients on the things which work for other websites, so that they might also work for them.

This post was authored exclusively for WDD by John O’Nolan, a core contributor to the WordPress UI Team, writer and entrepreneur based in Surrey in the United Kingdom. John loves to talk to people, so why not follow @JohnONolan on twitter too?
Today’s post is a big one and it’s most definitely one for your bookmarks menu, because from time to time when speaking with clients it becomes necessary to have material to backup the statements which you are making.

Sometimes clients will suggest things such as forcing all users to register with a six page long form before they can even access the site. They aren’t web professionals, it’s not their fault for not knowing that this isn’t a good idea from a usability perspective.

If you’re going to convince them that this is a bad idea, however, then you’re going to need some rock solid material to back that up. While an element of trust is always important to a working relationship, you have to respect that sometimes clients will just need to see the facts in front of them to fully understand that what you’re saying is correct.

So, what we’ve done for you today is compiled a list of some of the biggest, most compelling usability articles which address common issues. Hopefully this should help you during tough conversations about what does and doesn’t work on a a website.

Bookmark this post, come back to it, use it in meetings and educate your clients on the things which work for other websites, so that they might also work for them.

How Not Forcing Users to Register Increased Sales by $300million

A truly fascinating article covering how one ecommerce site removed forced user-registration during the checkout process, with a result of a $300million increase in revenue. Very impressive.

You want to know what I think of your new website. You got a sec? The folks over at Zurb have created an ingenious little web application that allows anyone to conduct a free test of what visitors remember about a website. And those visitors get exactly five seconds to form a first impression.

Called Clue, the site lets you quickly capture a page and create an interactive memory test that helps determine whether people understand what you’re trying to get across on your website. Just visit the Clue website, submit your URL and create a test that gives you a unique URL that you can then share with customers, vendors, employees and others. You ask them to take the five-second test and they, in turn, provide you with valuable feedback on what they think about the site.

You want to know what I think of your new website. You got a sec? The folks over at Zurb have created an ingenious little web application that allows anyone to conduct a free test of what visitors remember about a website. And those visitors get exactly five seconds to form a first impression.

Called Clue, the site lets you quickly capture a page and create an interactive memory test that helps determine whether people understand what you’re trying to get across on your website. Just visit the Clue website, submit your URL and create a test that gives you a unique URL that you can then share with customers, vendors, employees and others. You ask them to take the five-second test and they, in turn, provide you with valuable feedback on what they think about the site.

By giving users mere seconds to absorb a web page and recall the most memorable portions of that page, you’re able to quickly and accurately identify the best elements on that page — as well as the ones that don’t work so well.