Professional and non-professional web design

Source: Internet
Author: User
Tags range

We browse any page, only from the interface can easily identify professional and unprofessional differences, then how to make web design professional, beautiful, good-looking? This will involve some basic knowledge of art. First, the formation of the Web page style depends mainly on the layout of the page design, the tone of the page processing, as well as the combination of pictures and text forms.

  First, the layout arrangement

Page design involves the layout of the page first. "Layout" is actually the "business position" in the ancient Chinese painting theory. Web page as a layout, both text and pictures. The text has a large and small, there are headings and text points, the picture is also size, and there are horizontal and vertical. Both pictures and text need to be presented to the audience at the same time, not simply on a page, so they tend to get messy. According to the needs of the content, these pictures and text in a certain order to arrange and layout, so that they constitute an organic whole, show to the general audience.

1. Primary and secondary, the center is prominent. In a page, it is necessary to consider the center of the vision, which is generally in the center of the screen, or in the middle of the position. Therefore, some important articles and pictures can generally be arranged in this area, outside the visual center can be arranged for those slightly minor content, so that the focus on the page, do the primary and secondary differences.

2. Size collocation, mutual echo. Longer articles or titles, do not arrange together, to have a certain distance, the same, shorter articles, can not be arranged together. The arrangement of the picture is also like this, to stagger each other, resulting in the size of a certain interval, so that you can make the page patchwork, avoid the deviation of the center of gravity.

3. Illustrated, complement each other. Text and pictures have a complementary visual relationship, the page is too much text, it appears dull, lack of anger. Too many pictures on the page, lack of text, will inevitably reduce the page's information capacity. Therefore, the most ideal effect is the close cooperation between the text and pictures, each other as a foil, not only active page, but also make the page rich content.

  two, lines and shapes

The combination of text, title, picture, etc., will form a variety of lines and shapes on the page. The combination of these lines and shapes forms the overall artistic effect of the Web page. Must pay attention to the artistic collocation of these lines and shapes, in order to enhance the artistic charm of the page.

1. Linear (rectangular) applications. The artistic effect of the straight line is smooth, straight, regular, neat, the so-called has a round outline. The combination of lines and rectangles on the page can be a neat, distinct visual effect. Generally used in more solemn, serious web theme.

2. The application of curve (ARC). The effect of the curve is flowing, active and dynamic. The repetitive combination of curves and arcs on the page can present a smooth, brisk, vibrant visual effect. Generally used in youth, lively web theme.

3. The synthesis application of curved, straight line (rectangle, ARC). The above two lines and shapes combined to use, can greatly enrich the performance of the Web page, so that the page presents a more colorful artistic effect. This form of web pages, adaptable to a wider range of topics, can be applied to Web pages. However, in the layout of the page processing, the difficulty will be correspondingly larger, the handling of bad will produce messy effect. The easiest way to do this is to use a single line (shape) on a page, with only a few other lines (shapes) that fit within the local range.

  third, color processing

Color is the most sensitive thing to people's vision. The color of the webpage handles well, can icing on the cake, achieves the result with half the effort. Color general application principle should be "overall coordination, local contrast", that is: the overall color effect of the Web page should be harmonious, only local, small range of places can have some strong color contrast. In the use of color, can be based on the needs of the content of the Web page, respectively, using different main colors. Because the color is symbolic, for example: Tender green, emerald, gold * *, gray brown can symbolize the spring, summer, autumn and winter respectively. Second, there are professional signs color, such as: Military Police's olive green, medical and health, white and so on. Color also has a clear psychological feeling, such as cold, warm feeling, the effect of entering and returning. In addition, the color also has the national nature, each nationality because of the environment, the culture, the tradition and so on the influence, to the color preference also has the big difference. The full use of these characteristics of color, we can make our web page has a profound artistic connotation, thereby enhancing the cultural taste of the Web page. Here are a few common color schemes:

1. Warm tones. That is, red, orange, * *, ochre color, such as the collocation. This kind of tonal use, can make the webpage present warm, genial, warm atmosphere.

2. Cold tones. namely cyan, green, purple and so on color collocation. This kind of tonal use, can make the webpage appear tranquil, cool, elegant atmosphere.

3. Contrasting tones. That is, the color of the opposite color matching in the same * *. For example: Red and green, yellow and purple, orange and blue.

This kind of color collocation, may produce the intense visual effect, gives the person bright, bright, joyful feeling. Of course, contrasting tones if used poorly, will backfire, produce tacky, dazzling bad effect. This is to grasp the "great harmony, small contrast" this important principle, that is, the overall tone should be unified and harmonious, local places can have some small strong contrast.

Finally, also consider the Web page background (background color) deep, shallow, here borrow a term in photography, is "high-profile" and "low-key." Shallow background is called high profile, deep background is called low-key. Deep background, the color of the text will be shallow, with a dark backdrop to foil light content (text or pictures); On the contrary, the background light, the color of the text will be deeper, with a light background to foil the dark content (text or pictures). This kind of depth change is called "lightness change" in the color science. Some Web pages, the background is black, but the text also selected a darker color, because the brightness of the color is relatively close to readers in the reading, the eyes will feel very laborious, affect the reading effect.



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.