Design Theory: Ten Tips for Content Presentation

Design Theory: Ten Tips for Content Presentation
<br /> Focusing on the three aspects of text, symbols and links, mainly in Chinese, the draft of personal writing experience:
    Avoid writing mistakes . Dealing with picky readers is one aspect, but errors in certain keywords may cause them to avoid search engine crawling. Control of text density and rhythm . A paragraph should be about four lines long, and less is better than more. At the same time, avoid stacking paragraphs with large amounts of text continuously. The best rhythm between paragraphs is not one, one, two, two, three, three, but an irregular structure like one, three, two, three, one, two. The same principles apply to vertical and horizontal paragraphs. Words avoid being disconnected in their peers . For example, if there is a "搜" at the end of a line and a "狐" at the beginning of the next line, it is difficult for users to read. Note that in the default English paragraph, a word will not be broken, and the reason is the same. HTML structure code complies with semantic standards. The most confusing ones are probably the ordered, unordered, and defined lists. There is little difference between writing 12345 and using ol, but search engines will think that their meanings are different. The role of entity escape codes . Typical uses include using &nbsp; after Chinese characters to represent an English space, &copy; to indicate copyright, and &lt; and &gt; to replace <> to display HTML code. Avoid punctuation mistakes . The profoundness of Chinese language mainly depends on punctuation and sentence division. In addition to accurately conveying tone and context, punctuation marks actually also have a certain semantic analysis value, but current search engine technology cannot achieve this. The application and differences of symbols . There are Chinese and English, full-width and half-width fonts. The symbol presentation and font style definition are matched, such as the difference in effects between () and (). It is recommended to use common and special symbols less frequently, including ○↑★→⒌Ⅶ○『△, etc. The difference between Chinese numerals and Arabic numerals . It depends on personal sense of language and default standards, and the main thing is unity and consistency. Control of link volume . It is more appropriate to control the keywords in a single article within 5%. Otherwise, it will seem that there are key points everywhere, which will be counterproductive and increase the difficulty of visual effects processing. Two links stacked on top of each other doesn't look good, and three is terrible. It is not good to have links of 20 characters or 10 words in the upper half of a 400-word article, because the whole page is unbalanced, and it is also related to density. Reasonable use of colors . The functional differences of different colors, such as link prompts, must provide users with clear logic, and whether a character is clickable needs to be seen rather than tested. In addition, there are different shades of strength, and finally the number of colors must be controlled.

The above are just surface details of the text. In principle, I just try my best. After all, the content is the most important. It is a different story for truly talented people. Poor writing style may also be a kind of style. For specific precautions that require user awareness and cooperation, please read other articles on the text on the interface.
Note that some of these do not apply to non-fixed widths .

<<:  HTML tags list and usage instructions

>>:  Teach you 10 ways to center horizontally and vertically in CSS (summary)

Recommend

mysql method to view the currently used configuration file my.cnf (recommended)

my.cnf is the configuration file loaded when MySQ...

JavaScript Advanced Custom Exception

Table of contents 1. Concept 1.1 What are errors ...

How to use mixins in Vue

Table of contents Preface How to use Summarize Pr...

A brief talk about JavaScript variable promotion

Table of contents Preface 1. What variables are p...

Use dockercompose to build springboot-mysql-nginx application

In the previous article, we used Docker to build ...

How to upgrade CentOS7 to CentOS8 (detailed steps)

This article uses a specific example to introduce...

React encapsulates the global bullet box method

This article example shares the specific code of ...

Vue uses v-model to encapsulate the entire process of el-pagination components

Use v-model to bind the paging information object...

How to effectively compress images using JS

Table of contents Preface Conversion relationship...

Discuss the development trend of Baidu Encyclopedia UI

<br />The official version of Baidu Encyclop...

jQuery implements form validation function

jQuery form validation example / including userna...

Examples of correct judgment methods for data types in JS

Table of contents Preface Can typeof correctly de...

A brief discussion on the lazy loading attribute pattern in JavaScript

Table of contents 1. Introduction 2. On-demand at...

How to use CSS to achieve two columns fixed in the middle and adaptive

1. Use absolute positioning and margin The princi...