Use typographical expressions in Web design to express information

Author @ Liu Ming and @ Weibo UDC Design Center member. In this article, we can find that a good typographical design should not only be beautiful, but also organize and arrange the information content to make it standardized, orderly, clear, and clear, this allows you to obtain relevant information efficiently and accurately.

This requires the designer to have a deep understanding of the designed information content, improve the organization and processing capabilities of the Information Content, take the content itself as the design element, and arrange the content effectively according to the design principle.

First, let's talk about "Metro"-the internal name developed by Microsoft is "typography-based design language" (typographical-based design language ).

　　

 

　　

 

Metro is based on Swiss graphic design principles (clear, authentic, beautiful), derived from traffic signs.

In our lives, people are in a hurry and need to provide fast, concise, direct, and clear designs.

Today's Internet is not the case. While quickly obtaining information, information is rampant, complex and unordered, and the wind of conciseness is deeply rooted in the hearts of the people-reducing elements to reveal the essence. A good typographical structure makes Web design more concise and effective.

　Concept:

Typographical layout refers to the organic arrangement and combination of limited visual elements, so that the logic is clear, reading is smooth, interaction is convenient, and a good experience is generated.

　　

 

Rams's 10 excellent design principles (innovative, practical, aesthetic, easy to understand, modest, honest, time-tested, detailed, environment-oriented, concise)

Typographical layout has already been widely used in print media newspapers, books, magazines, and magazines. It also applies to Web design. However, Web features make it different:

Interactive (operable, instant response, and status changes, requiring not only beautiful but easy to use)

Rendering media (PC, mobile phone, tablet, TV, projection, etc., need to consider the rendering size and color)

Technical (HTML and CSS are constantly upgraded to provide better and more efficient Web typographical support)

Multimedia (text, images, and videos)

This makes Web design more complex, more difficult, and more challenging;

　　

 

　　Principles:

Changing, the layout should still follow the basic principles of Plane Composition-repetition and crossover, rhythm and rhythm, symmetry and balancing, comparison and reconciliation, proportion and appropriateness, variation and order, deficiency and white, change and unified

At the same time, it should be emphasized that:

Functions and forms (in-depth understanding of functions and content to better reflect theme ideas)

Compatibility and Response (cross-platform, different resolutions, and display effects in different device environments)

　　

 

　　Type:

1. Text

The hierarchical structure of content is embodied by attributes such as font size, Font, color, width, spacing, and line spacing.

　　

 

　　

 

2. Color

Use the shape, position, area, color, brightness, purity, and other attributes of the color, and combine the content and environment to organize the color.

　　

 

　3. Images

Pinterest leads the popular waterfall stream layout trend.

　　

 

　　4. Form

Careful form formatting can make users feel comfortable and enjoy registering, paying, and creating and managing content.

　　

 

　　5. Interface

The biggest difference with flat layout is that the operational functionality of the Web interface should be emphasized on the availability of the design. The layout should also take into account users' browsing and operation habits.

　　

 

　　

 

　　6. navigation/Chart

Through the induction and arrangement of information data, the complex information can be efficiently and clearly transmitted to users-clear and intuitive.

　　

 

　　

 

　　Summary:

Typographical layout is very important in Web design. A good typographical design should not only be beautiful, but also organize and arrange the information effectively so that the information can be standardized, orderly, clear, and clear, so that users can obtain relevant information efficiently and accurately, makes Web design more friendly, easy to use, and authentic and trustworthy.

This requires the designer to have a deep understanding of the designed information content, improve the organization and processing capabilities of the Information Content, take the content itself as the design element, and arrange the content effectively according to the design principle. A good typographical structure makes Web design more concise and effective.