Color collocation and non-color collocation in web design

Source: Internet
Author: User

Intermediary transaction http://www.aliyun.com/zixun/aggregation/6858.html ">seo diagnose Taobao guest cloud host technology Hall

Many webmaster in the web design, because there is no professional training, the effect of the poor. and a Web page gives the first impression, not rich content, nor is not impeccable layout, but the color collocation of the page. Web design with the site webmaster, site of the industry-related, now small set will write a series of Web page color with the article, look to the web design in color with bad webmaster to help.

The color collocation of web design

  

Recommended scheme one: Cyan + orange + Black

The specific color matching shown above. Now I'm going to do an imaginary three colors.

① lets the black at the top, and with the following color form a strong contrast, make the page more layered sense. For example, keep the black on top of the navigation bar, the navigation bar can be gray, or other colors that are relatively appropriate. The text of the navigation bar can also be black, so the contrast will be more obvious.

② Cyan as the main color, located in the main location of the Web page, you can have a very strong impact.

③ Orange is mainly used as the focus color, marked in the main position, so that the text more eye-catching. You can set the text color to orange, or you can add a white font to it with an orange background.

Recommended plan two: dark red + light Red + White

  

  

This is the 2011 years of Coca-Cola's official website, we have to do an analysis. Due to the long time, now can not open, there is no clearer picture, I hope to forgive.

① the size of the white text, so that the theme is clear, contrasting.

② through the combination of crimson and light red, creating a lively, warm atmosphere, giving people the feeling of unlimited vitality.

③ screen dotted with a small amount of yellow, orange, and to some of the font to play the light effect, so that the screen more lively, contrasting more clearly.

Non-color collocation

What is a color matching? As the name suggests, is black, white, gray three color collocation, black and white collocation, or with other colors can produce a very strong contrast, so that the subject to show clear. Gray is a kind of universal color, can and any color collocation, but also can reconcile two opposing colors, make them a harmonious transition. For example, I have just given the example of color collocation, let the gray navigation bar perfect transition.

Recommended scheme one: Red + white + black

  

  

① Red Pictures and icons in the black background, will appear very prominent, very eye-catching.

② white text size to reduce the dull feeling of the screen,

③ Gray screen makes the picture transition more natural.

Summary: Because time is more hasty, so share here today. In the next color matching series, I'll make some recommendations for each color that applies to each industry. As for the case site, may not be so easy to find, there are any problems can be commented on. This map is original (case diagram for screenshot), this article by the Moving Company (www.banjiabaojia.com) SLC prepared, reproduced please indicate the source. Of course, the site is still under construction.

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.