Select Page

10 principles of good web design

CRIAMOS O TEU SITE PROFISSIONAL

Descreve o site que precisas e ajudamos-te a criar algo que vai aumentar a tua faturação e fazer crescer o teu negócio.

Usability and usefulness, not visual design, determine success or failure in website creation.

This means that it is not enough to have a beautiful, visually coherent website, it is necessary that the website has a good web design with a measurable and communicable objective. Web design is a fundamental part of digital strategy from the website.

As the visitor to a web page is the only person who clicks the mouse, and therefore decides everything, user-centered design has become the standard of good web design with the aim of making your website more profitable.

After all, if users can't use a feature, it might as well not exist at all.

We will not discuss the implementation details of good web design (example: where the dialog box should be placed). Instead let's focus on the basics of good web design effective.

These techniques, used correctly, can lead to more sophisticated design decisions that simplify the process of understanding the information presented.

Principles of good web site design

In order to be able to use the principles correctly, we first need you to understand how users interact with websites, how they think and what the basic patterns of user behavior are.

How do users think?

Basically, the habits of users on the internet are no different from the habits of customers in a store. Visitors look at each new page, read some of the text, and click on the first link that catches their eye or vaguely reminds them of what they are looking for. In fact, there are large parts of the page that they don't look at

Most users are looking for something interesting (or useful) and clickable; Once a promising candidate is found, users click. If the new page does not meet expectations, the back button is clicked and the search process continues.

Users like quality and credibility.

If a page provides users with high-quality content, they will accept even seeing advertisements, and they will accept the site's design. This is the reason why not very well designed websites with high quality content gain a lot of traffic over the years. Content is more important than design.

Users don't read, they look.

Analyzing a web page, users look for specific points, or anchors, that guide them through the page's content.

Web Design Guidelines

Users are impatient and want instant gratification.

Very simple principle: if a website doesn't meet expectations, the designer failed in his job, and the company will make less money. The more users have to think and the less intuitive the navigation, the more users will want to leave the website and look for alternatives.

Users do not make the best choices

Users are not looking for the fastest way to find the information they are looking for. They also do not search the page in a literal way, going sequentially from one section of the site to another. Instead, they choose the first reasonable option. Once they find a link that appears to take them to their goal, there's a good chance it will be clicked instantly. Optimization is difficult, and it takes a lot of time.

Principles Of Effective Web Design

Users follow their intuition

In most cases, users just skim the information instead of reading the information that a designer has provided. According to Steve Krug, the main reason for this is that users don't want to know. “If we find something that works, we will be satisfied. We don't care if we can understand how things work, as long as we can use them. If your audience thinks you're going to draw tables, then draw great tables.”

Users want control

Users want to be able to control their browser and depend on consistent data presentation across the entire site. Example: they don't want new windows to appear out of nowhere and they want to be able to return to the previous page by clicking the back button to the site they were on previously: that's why it's good practice to never open links in new browser windows.

1. Don't make users think

The page must be obvious and explain itself. When you create a website, your job is to get rid of the question marks – the decisions that users need to make consciously, considering the pros, cons and alternatives.

If the site's navigation and architecture are not intuitive, the number of question marks will grow and make it difficult for users to understand how the system works and how to get from point A to point B. A clear structure, Moderated visual cues and easy-to-recognize links can help users find what they're looking for.

good website design sample

In the example of Beyondis.co.uk, which says it is “beyond channels, products and distribution”. What does this mean? As users tend to explore websites according to the “F” pattern, these 3 findings should be the first elements that users encounter on the page when it loads.

Although the design itself is simple and intuitive, understanding what the page does requires the user to look for the answer. This is an example of an unnecessary question mark. The designer's job is to make this number of question marks close to 0. The visual explanation is placed on the right side. The simple act of swapping both blocks would increase usability.

Web Design Guidelines

Expressionengine uses the same structure as Beyondis, but avoids unnecessary question marks. Furthermore, the slogan is functional as users are given options to test the service and download a free version.

By reducing cognitive load, we make it easier for visitors to understand the idea behind the system. Once you have achieved this, you can communicate why the system is useful and how users can benefit from it. People won't use your website if they can't understand how it is used.

2. Don't abuse users' patience

In each project where we offer our visitors a service or tool, we must keep our requirements to the minimum possible. The fewer actions we ask users to take to test a service, the more likely we are to get a visitor to try it. First-time visitors are usually willing to try out the service, not fill out large forms to register an account that they won't use in the future. Let users explore the site and discover your services without forcing them to share private data. It is not good policy to force users to provide their email to test a feature.

Users will prefer to give their email after having tested the service, as this way they already have some idea of what they would receive in return.

Screenshot

Stikkit is an excellent example of a service that asks very little information from the visitor, which is comforting. This is what you want visitors to feel on your website.

Screenshot

Mite requires more. However, registration can be done in less than 30 seconds, as the form has a horizontal orientation, the user does not even need to scroll down.

Ideally you should remove all barriers, you should not require subscriptions or registrations before anything. The need to register alone is enough of an impediment to reduce your website's traffic.

3. Gain users' attention

Because websites offer dynamic and static content, some aspects of the user interface attract more attention than others. Obviously, images attract more attention than text – just as bold sentences are more attractive than plain text.

The human eye is highly non-linear, and visitors can recognize patterns, boundaries and movements simultaneously. This is why video advertisements are highly unpleasant, but from a marketing perspective, they are excellent for capturing users' attention.

Enso

Humanized uses the principle of attention perfectly. The only element that is directly visible to users is the word FREE which is attractive, but also calm and purely informative. Subtle clues give users enough information on how to find out more information about the product that is FREE.

Focusing attention on specific areas of the site with a moderate use of visual elements can help visitors get from point A to point B without thinking about how it's supposed to be done. The fewer questions that arise in visitors' minds, the better the sense of direction they will have and the more confidence they will be able to develop for the company that the site represents. In other words: there has to be as little thought as possible, everything must be as intuitive as possible.

4. Look for feature exposure

Modern web design is often criticized due to its strategy of guiding users with 1-2-3-done visual steps, large buttons with visual effects, etc. But from a design perspective, these elements are not a bad thing. On the contrary, these buttons are extremely effective as they guide visitors through the website's content in a very simple way.

Screenshot

Dibusoft combines visual appeal with a clear structure. The site has 9 navigation options that are easy to observe at first glance. The choice of colors may however be too clear.

Letting the user clearly see the functions at their disposal is a fundamental principle of successful interface design. It doesn't matter how this is achieved. What matters is that the content is well understood and that visitors feel comfortable with how they interact with the system.

5. Use writing effectively

As the internet is different from the press, it is necessary to adjust the writing style to user preferences and browsing habits. Promotional writing will not be read. Neither do long blocks of text without images and keywords marked in bold or italics. Exaggerated language will be ignored.

Write seriously. Avoid cute names or easy jokes, marketing-induced names and technical names that are unfamiliar. If you describe a service and want users to create an account, “sign up” is better than “Start now!”, which is still better than “explore our services”.

Screenshot

Eleven2.com gets straight to the point. Nothing exaggerated. Instead a price: exactly what you are looking for.

The best solution for effective writing is

  1. Use short and concise sentences.
  2. Use a layout that can be easily read (categorize content, multiple header levels, visual elements, and lists that divide the text evenly into a few blocks)
  3. Use simple and objective language (a promotion does not have to look like an advertisement; give your users a reasonable and objective reason for them to choose your service)

6. Look for simplicity

The principle of keeping things simple should be the main goal of web design. Users are never on a website to look at the design; Furthermore, in most cases they look for information whatever the design. Always look for simplicity, never complexity.

From the visitors' point of view, the best design is just text, without any advertising or more blocks of content related to what they were looking for. This is one of the reasons why an easy-to-use printed version of a website is essential for a good user experience.

Screenshot

Finch presents information about the site and gives visitors a range of options without overusing unnecessary content.

7. Don't be afraid of white space

In fact, it's hard to overestimate the importance of white space. It not only reduces the cognitive load for visitors, but also makes it possible to understand the information on the screen. When a new visitor sees a design, the first thing they do is try to break the content down into digestible chunks of information.

Complex structures are more difficult to read, analyze and work with. If you have a choice between separating two design segments by a visible line or some white space, it's generally better to use white space. Hierarchical structures reduce complexity: the better we can give users a sense of visual hierarchy, the easier it will be to understand our content.

Screenshot

White space is fine. Cameron.io uses white space as a primary design element. The result is an easy-to-internalize structure that gives content the dominant position it deserves.

8. Communicate effectively with visible language

There are three fundamental principles involved with using “visible language” – the content that users see on the screen.

Organize: Give the user a clear and consistent conceptual structure. Consistency, layout, relationships and navigability are important organizational concepts. The same conventions and rules must be applied to all elements.

To save money: Do the most with the minimum of visual elements, Four main elements to consider: simplicity, clarity, distinction and emphasis. Simplicity includes only those elements that are most important for communication. Clarity: all components must be designed so that their meaning is not ambiguous. Distinction: The important properties of the required elements must be possible to distinguish. Emphasis: The most important elements should be obvious.

To communicate: make the presentation according to the user's capabilities. The interface must have its readability, typography, symbolism, multiple readings and color or texture in order to communicate successfully.

9. Conventions are our friends

Conventional design of website elements does not result in a boring website. In fact, conventions are very useful as they reduce the learning curve, the need to understand how things work. For example, it would be a nightmare if all websites had different visual presentations for an RSS-feed. Which is not that different from our regular lives where we tend to get used to basic principles about how we organize data (folders) or go shopping (product placement)

With conventions we can gain users' trust and prove our credibility. Meet expectations – understand what they expect from a website’s navigation, text structure, search location, etc.

A typical example is translating the page into Japanese (assuming users don't know Japanese) and having our usability testers look for something on a page that has a different language. If the conventions are well applied, users will be able to do things that are not too objective, even without understanding a single word.

10. Start testing early, test often

This principle should be applied to all web designer services because usability tests often provide crucial information about significant problems.

Don't test too late, and not for the wrong reasons. In the first case it is necessary to understand that most design decisions are local, which means that we cannot answer universally about which layout is best as we need to analyze them from a very specific point of view (considering requirements, budget, etc. ).

Other important points to take into account:

-Testing one user is always better than testing none. And testing one user at the initial stage of a project is better than testing 50 at the end. Errors are more frequent in the initial phase, and more expensive to correct in the end.

-Testing is an iterative process. This means that if you design something, you have to test it, correct it and then test it again. There may be problems that were not discovered in the first round because users had not yet overcome other problems.

-Usability tests always produce useful results. You will either discover problems or discover a lack of serious design issues, which is always helpful for the project.

-The designer should not test his own website. After you have worked on your website for a few weeks, you will not be able to look at it from a fresh perspective.

You know how it was built and therefore you know exactly how it works – you know things that testers and visitors won't have preconceived.

How much does a good web design service cost?

Do you need to create a new website? Or perhaps to redesign your current website with a dose of good design, refreshing, objective and intuitive?

find it out here how much does a new website cost or an upgrade.

For more information, use the form below and obtain a personalized quote without any obligation.

[contact-form-7 id=”6906a4d” title=”Lead Form Criação Website”]
PT
EN