Application of color in web design

Source: Internet
Author: User
Design | Web page design color application in the Web page of the role is really too important, some pages look very elegant, tasteful, pleasing, but the page structure is very simple, image is not complex, this is mainly the use of color, color charm is difficult to resist, Do you understand the seemingly simple principles and mysteries of color application? This involves a lot of color principles of knowledge, so I specifically will belong to the image produced in the color as an independent stop to introduce.

1, the basic concept of color
Color in nature can be divided into two categories: non-color and color. Non-color refers to black, white and various shades of gray, while all other colors belong to color. Any one color has three properties:
(1) Hue (Hue): Also called color, is the basic characteristics of color, reflecting the basic appearance of color.
(2) saturation (saturation): Also known as purity, refers to the purity of color.
(3) lightness (brightness or lightness or luminousity): Also called brightness, reflecting the depth of the color.
Non-color only brightness characteristics, no hue and saturation of the difference.

2, the color of the three primary colors
The color of computer screen is synthesized by RGB (red, green, blue) Three kinds of shade, and we can adjust the three base colors to tune out the other color, in many image processing software, there is the provision of color, you can enter the value of three primary colors to adjust the color, but also directly according to the software provided by the color palette to choose.

  3, color of computer images
The color of a computer image is based on the computation and combination of bits (bit), pure black-and-white image is the simplest color structure, using 1-bit data on the computer, although only black and white, but still through the density of the matrix arrangement, The black and white are combined into the approximate visual gray modulation. The
Grayscale (grayscale) image has 256 halftoning, looks similar to the traditional black-and-white photograph; In addition to black, white two colors, there are 254 shades of gray, the computer must be 8-bit data to show the 256 kinds of halftoning.
Full-color (Fullcolor) refers to RGB three colors can display all the color, each shade to 8-bit, each has 256 kinds of halftoning, three-color interaction increase and decrease, can display 24BIT 16.77 million colors (256*256*256=16,777,216), This number is the highest color that the computer can represent, the rgbturecolor of the generic term. A
8-bit color is an image with 256 halftoning, or 256 colors, and we often see the image file in GIF format as an image file with 256 colors. To convert a 24-bit full-color picture to a 256-color 8-bit, typically, you must index the steps (Indexed), that is, in the original 24-bit 16.77 million color, first create a color distribution table (histogram), and then find the most commonly used 256 colors, define a new palette, Finally, replace the original image with the 256 color of the new color plate.

Let's see how many colors each color contains:
1-bit 2 colors
2-bit 4 colors
4-bit 16-color
8-bit 256-color
16-bit 65536-color
24-bit 16.77 million-color
32-bit 16.77 million colors and 256-level grayscale values
36-bit 68.7 billion colors and 4,096-level grayscale values

The standard VGA display mode is usually called the 8-bit display mode, in which 256 colors can be displayed, while the high color (Hi-color) display is 16-bit display mode, which can display 65536 colors, also known as 64K; there is also a true color (true Color) display mode is 24-bit display mode, can display 16.77 million kinds of colors, also known as 16M color, this is now the general PC can achieve the highest color display mode, in this mode to see the true color image of the color has been and high-definition photos no different.
We have mentioned the importance of color in the page in the graphic production, in the page as far as possible to use the more elegant, concise color, such as the background as little as possible with dark, deep color (unless special needs), and the root page theme to choose the main color, there may be some do not make art friends do not know the meaning of color representatives, Please refer to the following table:
Red: Represents enthusiasm, unrestrained, joyful, celebration
Black: Represents seriousness, night, composure;
Yellow: On behalf of noble, Rich white: On behalf of purity, simple
Blue: Represents the sky, refreshing
Green: On behalf of plants, life, Vitality Gray: On behalf of the dark, negative purple
Color: On behalf of romance, love
Brown: Representing the land

The above is the meaning of several main colors, I hope to help you.

Now we have a basic understanding of color, then how do we in a Web page to match the color? If you know more about art, it's better to do it. Conversely, you may have to spend more time on it.
First, after you determine the theme of your home page, find out which colors are appropriate for which sites. For example, a film and television site, basically apply any color, but small b think with black or other teaching deep color mainly better, because people watch TV, movies in general in the dark Environment to watch, the use of dark on the Web page is more in line with the habits of people; on the other hand, a hospital, medical site to use light-colored color, The atmosphere of his medical site.
Remember that the white page is a versatile style
A special point to note here: The color of the page text is distinguished from the color of the link.
In the design, if you have extra time, you can try a few different colors.



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.