Advanced Web page creation: text application in web page design

Source: Internet
Author: User

Today, the Internet is getting closer and closer to our lives, and surfing the Internet is gradually becoming an indispensable part of our lives. The online world is colorful and a large number of excellent and exquisite web pages are emerging. The presentation of a large amount of network information is nothing more than text, images, Flash animation, and so on. Among them, text is the most important design element in web pages. For beginners of web design, it is especially important to understand and master the text layout design in web design. The author wants to share his own views.

Text formatting

1. The font size, font size, and line spacing can be calculated in different ways, such as Point or Pixel ). We recommend that you use lbs as the unit for pixel-based printing.

The most suitable font size for webpage text display is about 12 lbs. Many comprehensive websites now use a 9 lb font size because there are many contents to be arranged on a page. A large font can be used for titles or other places that need to be emphasized. A smaller font can be used for footer and auxiliary information. It should be noted that the small font size is easy to produce the overall and exquisite feeling, but the readability is poor.

Web designers can use fonts to fully reflect the emotions to be expressed in the design. Font selection is a kind of emotional and intuitive behavior. However, no matter what font you select, you must follow the overall idea of the web page and the needs of the browser. For example, the bold Chinese characters are strong and powerful, and have male characteristics. They are suitable for mechanical, construction, and other content. The characters are elegant and meticulous, and have female characteristics. They are more suitable for clothing, cosmetics, food, and other industries. On the same page, there are few font types, elegant layout, and stability. If there are many font types, the layout is active and colorful. The key is how to grasp the proportional relationship based on the page content.

From the perspective of enhancing platform independence, it is best to use the default font for text content. Because the browser uses a font on the local machine to display the page content. As a web designer, you must consider that most viewers have only three types of fonts and some specific fonts. The font you specified cannot be found on the viewer's machine, which brings great limitations to web page design. The solution is to make the text into an image and insert it into the page where it is necessary to use a special font.

Changes in line spacing also have a great impact on text readability. Generally, the line spacing close to the font size is more suitable for text. The regular proportion of line spacing is, that is, if the word is 10 points, the line spacing is 12 points. This is mainly due to the following considerations: the appropriate line spacing will form an obvious horizontal blank band to guide the viewer's eyes, and the excessive line spacing will lead to a row of text loss of good continuity.

In addition to the impact on readability, the line spacing itself is also a strong expressive design language. To enhance the decorative effect of the layout, you can consciously widen or narrow the line spacing to reflect unique aesthetic interests. For example, widening the line spacing can reflect relaxed and relaxed emotions and be suitable for entertaining and lyrical content. In addition, through careful arrangement, the wide and narrow line spacing coexist, can enhance the space level and elasticity of the version, show unique ingenuity.

You can use the line-height attribute to set the line spacing. We recommend that you use the lbs or the percentage of the default line height. For example, {line-height: 20pt} and {line-height: 150% }.

The text part of the overall orchestration page is a group composed of many individual texts that have been orchestrated. You must give full play to the role of the group shape in the overall layout. From the perspective of art, we can regard the font itself as an art form, which has a great influence on people in terms of personality and emotion. In web design, font processing is as critical as color, layout, graphics, and other design elements. In a sense, all design elements can be understood as graphs.

1. The graphic font of text has two functions: one is to implement the functions of the meaning and semantics, and the other is the aesthetic effect. The so-called graphic text emphasizes its aesthetic effect, and marks the text as a graphical element, while enhancing its original functions. As a web designer, you can set the font in a regular way or design the font in an artistic manner. In any case, everything should focus on how to better achieve your design goals.

The deep design ideas can be expressed in a more creative form by graphical and visualized text, which can overcome the monotonous and dull web pages and impress people.

2. the overlapping text and image, or the overlapping text can generate a sense of space, jump, transparency, noise, and narration, it becomes an active and eye-catching element in the page. Although the stacked method affects the readability of the text, it can produce the unique visual effect of the page. This kind of expression that does not pursue easy reading, but deliberately pursues "noisy" reflects an artistic trend. Therefore, it is not only widely used in traditional layout design, but also widely used in web design.

3. When arranging the title and body, you can first arrange the body in double, three, or four columns before placing the title. You can split the text into columns to obtain the space and elasticity of the page, so as to avoid the rigidity of the entire column and the singularity of the title insertion method. Although the title is the title of the entire paragraph or entire article, it is not always placed above the beginning of the paragraph. It can be used for center, horizontal, vertical or edge arrangement, or even directly inserted into the word group to break the old rules with a new layout.

4. The text part of the four basic forms of text orchestration page is composed of a large number of individual texts that have been orchestrated. We need to give full play to the role of this group shape in the overall layout.

Both ends are consistent: the length of the text from the left end to the right end is consistent, and the word group forms a positive area, which is correct, rigorous, and beautiful.

Center arrangement: if the word distance is equal, it is arranged on the axis of the page center. This arrangement makes the text more prominent and creates a symmetric aesthetic.

Left or Right Alignment: the left or right alignment naturally forms a clear vertical line at the beginning or end of the line, which is easy to work with the image. This orchestration method is relaxed and tight, has virtual and real, beating and elegant, produce rhythm and rhythm form aesthetic. The left alignment conforms to people's reading habits and appears natural. The right alignment is rarely used because it does not conform to reading habits, but is novel.

</

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.