How to highlight key content in visual design

Source: Internet
Author: User
Keywords Background very let the user visual design guide the user

The survival of Internet enterprises is the need to introduce new ideas to guide users to interact on the Web site, the introduction of new products, improve the user experience, how to let users know, to use.

If the site color is very single, the shape of the same, then the user must be a glance to leave
Can let the user know and go to use the website the new product or the key point or valuable, must be
1&http://www.aliyun.com/zixun/aggregation/37954.html ">nbsp; let users see (with G-spot)
2 have the desire to allow users to click (content)

This article from the visual perspective of how to let users see, form a G-spot. Make the outstanding content "stand out from the crowd".

One, eye-catching color

"A little green in the red" is, of course, the easiest to spot. This is one of the common ways to highlight key points. such as Tencent network in such a way to highlight the recommendation of Weibo and computer Butler products


Ii. inconsistent shape

Different shapes will also make the content from the same word in the sea, so as to attract users to pay attention to, often used to guide the registration or purchase to guide users to interact with the site, highlighting the advantages of a site. For example, the MAI package is used in navigation with a different shape of the button to guide users to quickly select the package, participate in promotions and view the new shelves of products.


Third, add background color

Plus background color is currently used in one of the more methods, major sites can see such a guide. The most common is when the mouse hovers over the background, but also has a fixed display background, such as the large classification of E-commerce classes plus background color. There are many ways to use this in watercress.


Four, add the outer frame

This method is of the same nature as the plus background. But adding a border around China has other meanings. So often use the underline on the bottom. such as NetEase a new feature, you can display the user from the last access to the current update information, underlined.


Five, not a line

The content that will be highlighted is higher than other content to achieve special, to guide users, the most common or in the navigation, or site map highlighting a service. such as the focus of science and technology TCD team blog navigation using this method


Vi. Filling

The padding looks similar to the background color, but this method is a little more general than the back color. Plus background color Just add the color of the container, and fill the concept is to fill the container and fill the items are not limited to color, can have a rich and colorful style. such as the popular classification of the above fig package design.


Seven, let the content move



Nobody moves, you're moving. How dazzling you should be. In the same Internet product, a line of text suddenly moves back and forth in a static text. It certainly attracts eyeballs. such as Taobao rolling activities and products on the map of the new products recommended.

Viii. Add Shadow

Shadows make people have three-dimensional sense of objects. Also can make the product highlight. such as Tencent's second meeting this year's micro-blog report very good use of this method.


Nine, bump (three-dimensional)



Concave-convex effect is also common to play a prominent role, the most is the performance of the button, a good visual button enough to make people have the desire to click. such as Alibaba in the upper right corner with a strong texture of the button area to guide users to register to see, in the mouse-sliding old convex into a concave.


Ten, flashing effect


Believe that you read here when it must be very easy to find the picture on the jump in the text, it is true this way is very attractive to the user's attention, but the Web page if many such effects, will appear very unfriendly.


Xi. Clarity

Graphic design often uses local blur to foil the focus of the display of the part (such as above), in the website of the brand design or publicity class design can also use this method.
This is a common method of performance focus, and there are other ways:


The above approach is built on already good products, designed to better highlight their products. The product of the Internet is to be built to use the foundation that looks good. If the light has a good-looking shell, there is no real clickable content, users will have a kind of fooled feeling, "The Wolf" story is not someone to believe the third time.

Source Address: http://www.ue-ui.com/high......l-design.html

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.