Posts Tagged ‘website design’

Website designers should use more free space and at least 1 usability tester

Tuesday, January 26th, 2010

Designing new layout for your website live some free space

Free space improves visual perception — it’s a well known fact for website designers. They take into consideration importance of space between paragraphs, images, buttons and other elements on the page. They can also group items reducing space between them, it helps to show connections, structure and hierarchy of elements.

Free space also makes content more readable. Numerous studies show that spaces between paragraphs increase perception by 20%.

website_design_usabilty

Effective user testing should not be extensive

Jakob Nielsen has calculate the ideal number of website usability testers. His statistics shows that only 5 testers identify almost 85% of all the problems on your site, while 15 testers identify almost all the problems.

The most serious problems usually can be found by the first or the first two testers, the rest testers will only confirm these problems and will find some more minor bags. So those who working at website and web application development can obtain good results without extensive and expensive user testing.

usability testing

Tags: , , ,
Posted in Software Development, Web development | 1 Comment »

Dribs and drabs that can improve web site usability

Monday, December 28th, 2009

Creating a new site use unique design, but when it comes to usability, it is better to use approved models (like most of web developers do). When people visit a new site, they always look for well-known things; they use their experience to perceive new content. People want to use the same modules on different web pages (such as color options, company logo location, principles of navigation, etc).

Google_website_design
Google always makes its links blue, and there is a reason: this color is familiar to most of users (that is why it’s much easier for them to find all the links).

Any other color is not a problem, but users will need some more time to find your links.

An ideal input field for search queries must be 27 characters long

Jacob Nielsen conducted a research to determine the ideal length for search boxes. So he ascertained that most of modern input fields are very short. Despite the fact that you can write quite a long search query, you can’t see all your text. It’s a problem with usability, because it’s difficult to edit such a search query.

The study showed that an average input field has width of 18 characters. According to the research results 27% of search queries are too long to fit in these input fields. But 27 characters wide fields can contain 90% of search queries. Remember that you can determine width not only in pixels and points, but also in “em” (a relative unit of length for current font).

website_design_search
Input field in Google search is wide enough for long searches

website_design_search2
Apple input field is too short, the query “Microsoft Office 2008″ does not fit in it

In general, it is better to do too long field than too short one, so your users would be able to find all the information without any problems. This is a very simple and useful advice for website designers, but, unfortunately, they often ignore it.

Tags: , , , ,
Posted in Web development | 1 Comment »

Web-development: trying to draw users’ attention

Tuesday, December 15th, 2009

1. Users concentrates on faces

People instinctively notice other people. The same occurs on web pages, users focus their attention on somebody’s face and eyes. So web developers and designers have a good tool to manage users’ attention. Moreover they also can take into account that people usually start to look in the same direction, following photomodel’s look.

web_site_user_usability0
Temperature map that shown quantity of users looking at an image with a child who looks at them.

web_site_user_usability
And now he is looking at the content. Pay your attention to the increase in the number of people who read the title and the text.

2. Most of users do not see advertising

Jakob Nielsen says that most of people do not see ads. Looking for some information or focusing on site content, they simply do not pay any attention to banners. It means that users also avoid anything that looks like an advertisement, even if it is not an ads actually. Some menu items may look like banners, so website designers should be careful creating such elements.

banners_ads
Square banners on the left side of the FlashDen site are not banners: they link to content on the same site. But they may be ignored by some users.

However, advertising that looks like content, can be visited by people who are looking for this very information. It can bring more revenue from advertising, but also can reduce level of visitors’ trust because they will click on a banner thinking it’ just a reference to required material on the site. So consider what will be better for you: short-term gain or long-term trust.

Tags: , ,
Posted in Software Development, Web development | 1 Comment »

Creating input forms for websites – the shortest guide for web developers

Wednesday, November 25th, 2009

Designers working for EleganceIT believe that usability is an important aspect of website development. It is important to make pages more simple and user-friendly. Numerous studies on various aspects of website design and user interface help us to create products in compliance with usability standards. Let’s begin from the very first thing you see entering most of sites. We mean input forms.

It’s better to put left-aligned labels above input fields

The UX Matters web magazine has conducted a comprehensive study to find out look-and-feel of an ideal login / registration form. According to the results, the best way is to put labels above form fields. You definitely have noticed that many forms in the Internet have labels placed on the left side, creating a layout with two columns. It looks not bad, but it is not the easiest layout to use. Why? Because users enter information using top-down approach. It will be easier for them to read labels placed just before fields, rather than look for them on the left side.

input form
For example, Tumblr has a simple and elegant registration form, which is consistent with the recommendations of UX Matter.

Labels on the left side create the following dilemma for website application developers: how to align these labels? A left-align label creates good looking layout, but at the same time it separates the label from your form, so it will be difficult to see what label relates to every field. And a right-align label makes the opposite thing: a user-friendly form with wry layout. :( While labels above input fields will be convenient in most cases. The study also has showed that labels should not use < b > (bold) tags, but this recommendation is not so obligatory.

Tags: , , , , ,
Posted in Web development | 6 Comments »

How to make users to read your web pages till the end

Friday, October 30th, 2009

We all have heard a popular rule of the first screen: “User does not scroll a web page, that is why all your information should be on the top of it”. This rule is based on the fact that users do not use the scroll bar because they feel too lazy to do it. Guys from the CXpartners company (United Kingdom, Bristol) decided to conduct a research to clear up this question. So the Elegance IT company, which specialists are developing new web sites as offshore dedicated team, presents surprising results of this research:

Truly speaking web development professionals know that the rule of the first screen is a myth. :) Over the past 3 years, we have carried out about 800 user tests and only in three cases a lower window boundary has become a real obstacle for users.

Actually this rule came from newspapers: the most important materials are always located at the upper half of the first page. In the Internet it is used to describe a page that users see without scroll.

Why are we are not worry about the rule of the first screen?

Customers don’t care have a web page scroll bar or not, they think it can’t spoil good website design, and we have made sure of it. Users felt more than comfortable scrolling long, very long pages to find what they need. So you can find a lot of successful websites, which creators really don’t worry about the rule of the first screen:

1

Adding evidences

An eye tracker was used for the research; it allows you to see what user sees. As a result we have created temperature maps.

Scrollbars

Analyzing results, we saw a clear spot in the right corner of the map. It was a scroll bar, this means that it is used to estimate the length of the particular page.  Some content at the end of the page provides a stimulus for further reading.

The image below shows two versions of Bristol airport web pages: at the first one the information is divided into two columns, while the second template has an illustration as the main element. As a result, people have used scroll:

2

“Stop sign” for your eyes

Take as an example the First Choice company site, its web page was very long and users didn’t want to read it till the end.

3

A new title with photos changed the situation:

4

Tips for successful website design:

•    large amount of space between elements facilitates eye movements;

•    horizontal lines stop your readers and prevent further page viewing, so all the elements should be above the lower limit;

•    avoid scrollbars inside web pages.

Tags: ,
Posted in Software Development | 5 Comments »