Methods to avoid common UX problems

Surely you had an unpleasant feeling when visiting a website: this design is too much, too much text, scroll is hard to pull … swear not to visit that page for the second time. It can be very easy to meet on websites today. However, we can limit these troubles if you understand the 4 website design principles below.

1.Form

In order to earn customer, client, and user information, it is indispensable to display the form at each site. For this purpose, it is necessary to create a form that is easy for users to enter. Therefore, the first thing to limit is the possible number of questions on the form. In particular, a huge problem with online forms is that there are cases where there is no user input

Create a form

When asking for specific information, please highlight and highlight what information entry requirements are needed. In addition, you should show an example for the input in the form if that part requires entering information with a special format. date, … After entering, display the error message immediately with the user will not have the feeling of frustration, waiting for the results to enter

e11ff21e8f1b30daf689a9deb94c13c95b34794a

Placeholder text

Placeholder text is a descriptive text displayed in the field input. It can be shown, for example, that input placeholder text into the field in the form is like a hint to help users easily enter information. (Red arrow mark in the image above)

However, when starting to import, it will not be fine if the design does not delete the text placeholder. When the user stops typing, delete or copy the text placeholder, because it has to be edited and re-imported, it will cause a feeling of frustration. Make sure that when user select enters the input field, placeholder text has been deleted

Lỗi thông báo

When you enter the form there will be a bit of discomfort if you constantly receive error messages without an explanation. Therefore, it is recommended to attach a workaround, which explains the cause of the error in the error message to the user

For example, when the user logs in with a user name and password, there are many cases that cannot be logged because the password or user name does not meet the required condition. In cases where the login fails, it is necessary to explain the cause of the error

Solve problems in Scalable Social Network - Register now!
Solve problems in Scalable Social Network – Register now!

Another example :

In case of registration, when the password is entered incorrectly or the user name has been registered, it is recommended to display the error message before transferring user information to the server.

It is annoying to have to fix it many times without getting a full explanation to anyone. So we should take the time to process the display part to reply to the user input information, help improve your UX website.

2. Use large size header in navigation

We can see this design at many recent websites. When using a header with a large size in navigation, for example, when the user scrolls down the page, it is easy to see a lot of content. For users, it is not quite difficult to pull the content you want to read or the content covered by navigation

Pay special attention to sites that make mobile

There is one case that is not very good when designing on mobile, although the size of mobile is designed to be small but still leaves the large size of the header. Mobile screen is limited by margin so it does reduce the viewing quality of the user. If the navigation is displayed, then change the size of the icon to shrink it or display a reasonable layout so that there is no sense of screen tangle.

3. Low contrast

With the Web design, the contrast is quite respectable. Depending on each person's view, the gray text is displayed in the black background (as shown below), then surely not everyone wants to read this content.

419d892256118cfa99345be6ac010988907d4b3c

Text

With text, the weight of the character is also worth thinking, how to choose the weight to be easy to read. The value of weight is 100 fonts, it is hardly used on the web except in special cases. It is unreasonable to use slender characters for smartphones. To see clearly the character, let the contrast be high enough

Color

About all the components on the Website, when increasing the uniformity of color contrast, it will become much easier to see. Special background and text should be high contrast.

Link, navigation, even icons are the same. It lowers the contrast, making it very difficult for users to search for content.

CTA (CALLS TO ACTIONS)

As with navigation or link elements, CTA (the element that encourages action to users) should also increase the contrast. * Action expectations for any person who visits the website are outstanding elements, easy-to-read design, load quickly.

The ineffective CTA example is the unconnected button element, merged into the same background color, then it is difficult to distinguish where the button is the text。

Solve problems in Scalable Social Network - Register now!
Solve problems in Scalable Social Network – Register now!

4. Touch target of mobile site

When creating a clickable link or button, the space is wide enough for the user not to click on other components. In the case of smartphones, it is recommended to create a wide enough distance from the edge of the screen to easily link the link tab or button.

When the button is too close to one of the 4 screen corners, it is physically difficult to get the correct tab. Hợp In case the user finger is big, the smartphone cannot receive the user action 。Let's use the function The user must tab a lot of times. Therefore, designing the space for the components is quite important

57e7c8ebe5ff8082a1347b1e18e22f019bc46f90

Conclusion

We can easily avoid the common problems of UX if we spend some time thinking before designing. If you want to get satisfaction when using the user, flexible handling of UX in a simple way is very important.

If you can avoid repeating user requests, you can increase user satisfaction when using the website. Moreover, it is possible to provide the experience as expected by any user at a designated web site. Good design

ITZone via Viblo

Share the news now