Date 2026-05-11 11:12:37

任何事物的呈现和传播都需要通过一定的媒介,在媒体承载的过程中,都会产生损失。我们设计的目的之一是尽量减少媒体承载过程中传达的内容,展示我们想要给观众的东西,并能够快速检测、理解和获得(主动和被动)。

文字作为语言交流的书面形式,一直承载着大量的信息,也是生活中最常见、最熟悉的方式。
目前,人们的快节奏生活状态、快速消费品的阅读习惯和注意力分散,因此我们需要通过设计手段减少视觉、心理和认知压力,使用户能够快速定位、理解和消化。同样,我们也需要根据目标、任务甚至品牌的需求来更好地为主题服务。
以下是工作中的一些经验和总结,旨在从更多的角度思考和改进文本信息,以便更好地呈现和传达文本信息。
前提是做事的首要条件。
实现目标,了解观众的具体情况目的是做这件事的动力。
满足用户需求,帮助完成工作;简单、直接、有效的沟通;达成协议,可以实施统一的规范。角度是考虑要做的事情。
准确性一致性易读内容调性坚持文本信息准确、简洁、明确,无歧义
首先要明确传达的群体对象,尽量避免使用行话和使用「用户」可以直接理解的文本信息,当然,相应的专业词汇也应该给出很好的解释和解释。
案例列:我们将 「循环次数」 更改成 「轮播次数」 ,「循环次数」它会让人产生思考(循环一次是播放一次还是两次),而且 「轮播次数」 它更直观、更清晰,更符合上下文的语境。

用词完整,解释直接
用词完整,比如保存修改,而不是简化为保存;直接解释,避免模棱两可,模糊不清。

在内容传达方面应该做得很好「自解释」
例如,涉及操作事件的文本命名应根据上下文准确表达,而不是含糊其辞,以便文本能够准确地解释和表达即将到来的事件和行为。

寻找更合适的表达方式
例如:未输入提示,「XXX不能为空」 和 「请输入XXX」,第一个其实在表达上有一些指责,第二个表达也说明了意思,但在语气上更温和,告诉用户如何操作和行动。
避免错别字
拼写错误只会降低产品质量和用户内心的形象,请务必严格检查。避免使用 「登录」 写成 「登陆」。
标点符号的准确应用
标点符号可以赋予文本节奏、语气表达和内容组织。准确的应用可以帮助文本更有效地传达和理解。
常用标点符号用法简表《标点符号用法》同一事物的词是一致的,消除重复
例如,如果涉及到新建的操作,将在一段时间内使用「新建」,一会又用「新增」、「创建」或者「添加」;涉及到标题,以后再用「你」,一会又用「您」、「我」或者「我的」;涉及帮助,以后使用「支持」,一会用「帮助」或者「服务」等等,我们应该消除这些重复和统一的单词。
在语境下,相似的场景、意义和句型表达是一致的
例如,应避免未输入提示「请输入XXX」和「XXX不能为空」等待不同的表达方式。

标点符号规范
根据符号使用规范和自身产品情况进行具体定义。例如:全角和半角,如常见「:」和「:」,截断省略「...」等等。另一个例子:标题,提示文本不添加结束符号等。
时间表达规范
时间是一个记录戳,需要根据当前的定义来显示不同的格式。
比如今天发生的(从0点开始),显示时间(24小时);显示月-日(如02-12)发生在今天之前;跨年,显示年-月-日(如2017-12-30)。
数字使用规范
例如,阿拉伯数字统一用于统计数据。
大小写使用规范
专有名词大小写、单位符号等。例如:iOS
中西文混排规范
中英文之间需要加空间。
代称一致
第一人称「我」,第二人称「你」和「您」,根据场景使用,与场景统一。请不要随意混用或均匀使用,而是要统一。
操作名称与目的页面标题一致
常见于移动终端,在 PC 链接和导航在链接和导航中很常见。
简化内容,避免冗长
简单直接,避免长时间使用短语,保持措辞简洁,让读者感受到阅读的乐趣,引诱他们深入阅读。
打破复杂冗长
通过段落、有序列表(项目编号)、无序列表使内容结构化,便于视觉扫描。
段落:根据句子的意思分段呈现。有序:当项目顺序或优先级重要(程序等)时,使用编号列表。无序:当项目相关时,使用项目符号列表,但顺序或优先级并不重要。结构化:节奏和节奏。例如,电话号码或银行卡号码使用连接字符或空间,使其易于读取和识别。突出显示重要内容
让用户首先看到最重要的内容,而不是寻找它们。
排版好
合理使用文本尺寸:使用合理的字体尺寸,太小太大,屏幕阅读效率低。网页端字体尺寸一般不小于12px,更直观、更容易区分(对大多数人)字体14px和16px;移动端字体大小不小于10pt(sp),12-18pt(sp)常用的字体选择范围。
颜色和对比度:我们需要考虑颜色本身(色调、亮度和饱和度)是否给人一种直观的感觉和文化意义,以及文本和背景之间是否有足够的对比度,以便人们更直观、更舒适地阅读。W3C 建议的视觉呈现文本和文本图像的对比度至少为4.5:1.大型文本和图像的对比度至少为3:1.具体细节可以理解 Contrast (Minimum):Understanding SC 1.4.3
字间距:汉字为方形字。原则上,文本外框彼此紧密配置,称为密集排列;在每个单词之间添加一个固定的空白来排列文本,称为排列;减少字间距,使文本外框部分重叠,称为紧密排列。文本排版时,将根据具体情况调整字间距。大多数时候,我们使用排列来增加字间距,以提高可读性。

行高:行距好的文本更容易阅读和引导用户的视线。行之间的空白称为行距,文字大小+行距=行高,行距一般介于文字大小的50%–在100%之间,自然行高的设置一般是文本尺寸的1.5-2倍。当文本尺寸较小时,行高设置将相对较小。行距一般不超过文本尺寸,因为它不会增加可读性。

段落间距:段落与段落之间的距离,段落间距大于行间距,行间距一般设置为文本大小的2-3倍,适当的段落间距可以缓解用户的视觉压力,发挥良好的节奏和阅读定位。

行字数:行字数。如果一行文本太长,用户需要移动颈部或视角,这很容易导致眼睛疲劳和阅读困难;此外,很难在大段文本中找到正确的行。如果视线太短,需要不断改变职业,从而打断读者的阅读节奏,造成尴尬的断裂效果;如果线路太短,用户也会在线路没有完成关注和阅读下一行。
虽然汉字仍然没有正统的方法和具体的行字数来衡量文本的完美长度,但个人经验约为12px下30-60个汉字(包括标点符号),但也应该根据内容、人群和其他限制和变量,当然,最重要的是相信你自己(专业设计师)的眼睛和判断。
尽量避免同行断开单词:例如,行为结束「跳」,下行开头为「转」,读起来就有断句的存在感。
对齐:中文(简体)排版一般遵循左对齐的原则,符合我们从左到右的阅读习惯。文本本身不适合可读性,但可用于许多小段落文本块。右对齐可用于表格设置中的数字对比和其他应用程序。

符号避开头尾:中国行首遇到不能放在行首的标点符号,必须移动到前行行尾。
合理突出:关键词、关键点通过位置、粗体、比例大小和颜色处理,以便用户直接关注。当然,我们也应该控制突出的数量,毕竟,它们都是「重点没有重点」,过多也会扰乱和分散用户的注意力。
链接:链接文本需要很好地解释用户将要去哪里,可以使用蓝色或下划线来标记链接的样式,这是用户熟悉的方式。神奇的「下划线」为体验赋能
尽量少用斜体:PC 无线端的官方中文字体包没有斜体预设。生拉硬拉的倾斜在一定程度上影响美观,造成一定的阅读困难。如果是为了突出或区别,可以考虑使用重量、大小和颜色。
层次处理:有对比就有层次关系。可以通过大小、字重、色彩、距离、方向、质感、形状、背景等方式,使整体排版布局更加层次化,显著提高内容的可读性。 例如:标题、副标题、引用和内容也是一种层次处理(结合大小、颜色或距离等)。
留白:合适的留白可以更好的衬托内容主题,缓解视觉压力。
当数字信息前后有汉字时,需要添加空格:如果不添加空格,前后会有拥挤的视觉感觉,另一方面可以突出数字信息。
根据产品定位,通过文本表达传达相应的价值观和情感需求
任何产品都有针对性的人群和自己的品牌形象。C端产品和 B端产品、儿童产品和成人产品的语言表达方式自然不同。
根据不同的状态和用户群体
根据用户(新手、中级用户和专家)的状态(正面、中性和负面),使用合理的语调和词汇规范,以适应不同的情况和情况。
始终坚持积极主动,而不是消极沮丧
「请输入内容」与「错误,内容不能为空」,同样的意思有不同的感受,从积极的一面表达就是传播正能量。
字族 Font-Family
Font-Family 字体系列的属性设置。Font-Family 作为一种属性,设置多个字体「后背」浏览器不支持第一个字体,它会尝试下一个字体。
如果字体系列的名称超过一个单词,则必须使用引号,如Font-Family:「宋体」。
对于依附在 PC 对于终端产品,统一的字体规范,以确保在不同的平台和浏览器下保持良好的美观性和可读性。
以下是 Ant Design 字体家族。个人使用多种型号后,觉得最好的一个:
font-family:「Chinese Quote」, -apple-system, BlinkMacSystemFont, 「Segoe UI」, 「PingFang SC」, 「Hiragino Sans GB」, 「Microsoft YaHei」, 「Helvetica Neue」, Helvetica, Arial, sans-serif,「Apple Color Emoji」, 「Segoe UI Emoji」, 「Segoe UI Symbol」;
如果你想知道字体排列前后顺序的奥秘,你可以仔细阅读文章“推荐!Web中文字体应用指南”。
下面的备注区是我在使用字族的路上收集到的有限知识。我知道为什么。如有不当、错误和遗漏,请纠正。
备注区域:
-apple-system:macOS 和 IOS平台 Safari 调用 SanFrancisco 字体
BlinkMacSystemFont:macOS Chrome 调用 SanFrancisco 字体
由Roboto字体组成的 Google 开发,是 Android 4.0「Ice Cream Sandwich」以及Android版本的默认字体。
Segoe UI 取代Tahoma,Windows 从 Vista 默认使用开始界面的西文字体。使用 ClearType 新字体的技术 Segoe UI 看起来比现在稍微僵硬一点 Tahoma 更人性化。
Tahoma 被采用为 Windows 2000、Windows XP、Windows Server 2003及 Sega 游戏主机 Dreamcast 默认字型等系统。
Arial 它是一套由多套微软应用软件分发的无衬线 TrueType字型。
Microsoft YaHei 这个字体将被用作微软雅黑 Windows Vista 2001年推出的默认字体取代了默认字体 默认的宋体汉字在XP系统下支持高清显示 ClearType 功能。
Simsun 宋体一直是简体中文版 Windows XP系统和之前版本的默认字体。但由于字体的特性,Windows Vista 已改用支持 OpenType 微软雅黑,
HanHei SC 威锋瀚黑,现苹果简体中文,OS X 10.11 El Capitan 开始,
STHeiti 中国黑体,分为「黑体-简(Heiti SC)」和「黑体-繁(Heiti TC)」,OS X 10.6 Snow Leopard 直至 OS X 10.10 Yosemite。
Hiragino Sans GB 冬青黑体
STXihei 华文细黑是苹果公司的 Mac OS X9 以及之前版本操作系统的中文默认字体,截至 OS X 10.5 Leopard。
PingFang SC 为 iOS9.0 以后系统会自带中文字体。
SanFrancisco iOS9 正式发布后,更换了以前的 Helvetica Neue 成为了 iPhone/iPad 默认字体的系列设备。
Myriad Set Pro 苹果向 adobe 该公司定制了西文字体 myriad 为原型,完成后在市场上称为原型「myriad set」,后期升级为「myriad set pro」。
Helvetica Neue 意为「新 Helvetica」
Helvetica 这是苹果电脑默认的西方字体
sans-serif 它不是一个特定的字体,而是一个css的通用字体系列,具体的字体是由浏览器设置决定的。
字号 font-size
不同字号的大小,如标题、内容、注释说明等。

字间距 letter-spacing
字间距是根据不同的字号和文本数量来定义的。

行高 line-height
设置行高能很好地解决了上下文本之间的拥挤问题。

颜色 text-color
这里主要讲的是关注对比度的问题。很多产品在这一点上忽略了这一点,产生了所谓的「小清新」。

日期
2018-01-02年使用完整的数字日期。

时间
使用24小时制,例如 13:01:29具体到时分秒,如当前对话显示 09:01:02使用半角 「:」日期和时间之间有一个空间,比如 2018-09-01 13:01:20。
数字
使用阿拉伯数字。

逗号用于四位数或更多位数。

使用手机号码前后无空间连字符「-」。不要使用点、空格等符号。

数字范围使用前后无空间连字符「-」。

正负数后不加空格。

数字和字符之间不需要空间
货币
人民币符号(¥)在数字前面,精确到小数点后两位。

测量单位
储存单位(B、kB、MB、GB、TB),在数量和测量单位之间包含一个空间。

对于长度「毫米(mm)、厘米(cm)、分米(dm)、千米(km)、米(m)、微米(μm)、纳米(nm)等」和重量「千克(kg)、克(g)、毫克(mg)、微克(ug)等」等待测量单位应为小写(电流单位除外)。数量和测量单位之间有一个空格。

屏幕单位「像素(px)、逻辑分辨率(pt、dp、sp)、英寸(in)等 」应该是小写。在数量和测量单位之间包含一个空间。

在连续列出尺寸时,将测量单位放在最后,而不是在每个数字之后,并包含一个空间。

在所有情况下,数字和单位之间有一个空间。HTML代码的最小空间是 & hairsp; 或 & #8202;
测量单位分为基本单位和出口单位。国际单位制有7个基本单位:
长度:米 m;
质量:kg(kg) kg;
时间:秒 s;
电流:安[培] A;
热力学温度:打开[尔文] k;
物质量:摩[尔] mol;
发光强度:坎[德拉]cd;
物理关系导出的单位名称「导出单位」 。
省略不必要的标点符号
标题、副标题、输入框下的提示文本、输入框占位符、悬停提示文本、toast、弹出窗口等短句,在选词造句时尽量避免标点符号,始终末尾不要使用句点。

有序列表和无序列表
冒号引入项目列表,列表后不使用标点符号。
使用列表来表示步骤、组或信息集。简要介绍列表的上下文。在顺序重要时列出数字列表,例如当您描述流程步骤时。当列表的顺序不重要时,不要使用数字。

常用的标点符号规范
空格:链接与前后文本之间的空格;数字与单位之间的空格;电话号码与前后文本之间的空格;省略号码「…」:半角省略号,超过截断代替省略文本;星号「*」:半角星号。表格必须填写,说明备注;连接号「-」:2018-01-04、2008-2018-2018等半角连接号前后无空格。;冒号「:」:用于时间表示的半角冒号,如16:45 ;冒号「:」:用于表单的全角冒号;破折号「——」:中文破折号占两个汉字空间;书名「《》」:法律规定常用于产品。相关推荐:
标点符号用法常用标点符号用法简表中文排版要求特殊名词大小写

文件格式
当一般引用文件来扩展名称类型时,所有的大写都不包括句点。
GIFPDFHTMLJPG 格式引用特定文件时,文件名称应为小写:
内容策略-完全手册设计.pdf皮虾.gif西湖.jpghot.html
中英文之间需要加空格

中文和数字之间的需求要加空格

主要是中文,使用全角符号,与英文或数字不加空格

避免使用,以表达双方的平等「您」。使用「你」为了表达客户的语气,代表客户/用户。主要用于客户/用户「我」。避免在同一句话中混用「你」和「我」。

对于「您」还是「你」使用不是绝对的,主要取决于行业和服务对象
作者在《比言传-Web内容创作与设计更好的艺术》中建议:
当用户提问时:
在问题中使用「我」和「我的」(用户的声音)在答案中使用「你」和「你的」(应用程序与用户交谈)使用「我们」和「我们的」代表回答公司应用程序提问时:
在问题中使用「你」和「你的」答案中使用(应用程序向用户提问)「我」和「我的」(用户声音)使用「我们」和「我们的」代表回答公司按钮
清晰可预测。点击按钮时应能预测会发生什么。

行动号召。按钮应始终有强烈的动词来鼓励行动。在按钮上使用,以便为用户提供足够的上下文 {动词} + {名词} 格式,除保存、关闭、取消或确定等常用操作外。
以下是常用词的含义,以避免使用不当或混淆:

所有具体的单词都需要结合场景和生活习惯。
链接
使用描述性链接文本。不要使用「点击这里」或「这里」作为链接文本。
若句子末尾或逗号前出现链接,则不要链接标点符号。
链接使用蓝色,这是用户习惯的认知,并明确区分点击和未点击的区别。

用户测试操作说明、功能说明、名词(术语)解释、提示信息等。,并记住这是一个不断优化的过程。
以下是产品中的主要文本:
操作文本:按钮;导航文本:全局和局部导航、目录、链接;描述文本:功能描述、术语解释;提示文本:弹框、toasts、操作反馈、系统反馈、通知等。;操作说明:功能指导说明、操作文件;标题和副标题:弹框标题、操作说明标题、法律条款标题等。;条款:法律条款和声明;ALT:在图片中添加文字说明。一般情况下的句子可以总结在一起,形成统一的句型结构。
例如:
操作反馈:成功直接提示结果,失败显示结果+解释原因+如何解决。
二次确认:先说明利益,再问是否操作。
标题:「动词」+ 「名词」格式等。

听起来像是谁,什么样的声音和语气能代表我们,我们想传达什么样的形象。
因此,你可以建立一套标准,一般来说,标准应该是:
基于产品当前业务;可以执行标准,避免过于空洞;易于记忆,3-5个可以;并随着产品开发和愿景的变化而不断适应改进。例如:
积极主动
始终坚持积极主动,而不是消极令人沮丧。
自信专业
避免听起来傲慢、亲密、幼稚或其他不恰当或非正式的东西。
友好尊重
使用合理的语气和用词规范,根据不同的状态(正、中、负)和用户群(新手、中级用户和专家)。
个人写作过程中的一些小见解:
好的结果是不断修改的。修改的基础是先写下来。所有的记录都应该先记录下来,而不是停留在你的脑海里。这是一切开始的基础。记住,用户很忙,没有耐心,甚至不聪明,这将不断促使您修改和调整。找人阅读并呈现结果,并询问其含义和建议。这是测试的最佳实践。也许有更好的方法可以在一段时间后再看一遍。这不是一个完整的(图片风格、插图图标等),还有很多地方可以补充。重要的是找到适合你的产品,并有意识不断优化你的产品内容,以便更好地为你的用户服务。
欢迎关注作者微信微信官方账号:「int-PD」

「扩展阅读,提高内容设计技巧」
文案设计|“这家大公司越来越重视体验文案作家,到底是什么?”UI文案|交互常识科普!文案设计界面易读性的五个原则和方法|“学习基础知识!如何科学提高UI界面的文本易读性?”