Conmajia

Stop stealing sheep!

导航

< 20253 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

统计

空格在科技类文章中对阅读体验的影响

Conmajia © 2018

1 共勉

研究显示打字的时候不喜欢在中文和英文之间加空格的人感情路都走得很辛苦有七成的比例会在 34 岁的时候跟自己不爱的人结婚而其余三成的人最后只能把遗产留给自己的猫毕竟爱情跟书写都需要适时地留白 ——V2EX

中文和英文及数字之间要不要加空格我猜很多人从来都没考虑过这个问题. 他们一边信奉“细节决定成败”的鸡汤一边“从来不在意这些细节”. 如果你也是这样的人emmmmmturn around and leave.

2 概述

科技类文章通常在中文之间混杂较多的外文词汇或字母例如“Unity 从入门到精通”“关于 http 和 https 之间的区别”“我有学过 українська мова所以 русский язык 我可以稍微看得懂”等等. 在阅读网页文字的时候由于汉字均为全角字符而外文——尤其是英文——字母多为半角字符因此容易造成视觉粘连. 对比下面两个例子

示例 1

在LeanCloud上,数据存储是围绕AVObject进行的。每个AVObject都包含了与JSON兼容的key-value对应的数据。数据是schema-free的,你不需要在每个AVObject上提前指定存在哪些键,只要直接设定对应的key-value即可。

示例 2

在 LeanCloud 上,数据存储是围绕 AVObject 进行的。每个 AVObject 都包含了与 JSON 兼容的 key-value 对应的数据。数据是 schema-free 的,你不需要在每个 AVObject 上提前指定存在哪些键,只要直接设定对应的 key-value 即可。

试试看

你可以先花 1 分钟仔细阅读上面两个例子然后再给出自己的判断.

中文和英文及数字之间的起到的是分词的作用也有部分 kerning 的作用所以对于专有名词例如“20豆瓣FM”这种混合词就不能分开但是“20 战斗机”豆瓣FM 软件”是可以分开的.

3 争议

正是因为间距直接影响了文字阅读的视觉效果所以在网页上中英文之间常常添加空格来进行调整. 但这属于阅读呈现样式的问题并没有强制性的规范更多的只是建议. W3C 曾在 2015 年提出过一个中英文混排建议规范. 据说汉字委员会也在对此进行讨论未见下文.

然而手工添加空格相当于在代码里硬编码文字说明这是和“样式-内容分离”原则背道而驰的. 但是就目前的浏览器渲染方式来说没有人会他妈关心你写的文章阅读起来体验是怎样的. 所以手工添加空格更多的是作者本人为了提升阅读体验的折衷.

4 现状

目前就网页或计算机软件而言单一内容来源者倾向于添加空格以提升显示效果例如大公司的网页或文档. 而不添加空格的通常是论坛博客或百科类网站因为这些网站内容由多人提供无法形成有效规范.

4.1 支持的例子

4.1.1 Microsoft

微软一直是坚定的空格支持者. 图 1图 2图 3 分别是 Windows 98 安装界面MSDN 文档和 Word 编辑界面截图注意中英文之间的间隔. 在网页上使用空格分隔而 Word 中是由软件自动分隔的不需要手动添加.

![](https://images2018.cnblogs.com/blog/407692/201802/407692-20180223204322972-520339539.jpg)
图 1 Windows 98 安装界面
![](https://images2018.cnblogs.com/blog/407692/201802/407692-20180223203324393-929626657.png) 图 2 MSDN .NET Core 网页版文档
![](https://images2018.cnblogs.com/blog/407692/201802/407692-20180223203503331-1409647904.png) 图 3 Microsoft Word 2016 工作区
### 4.1.2 LATEX 排版系统

这是科技文献排版系统的事实标准它的 CJK 宏包支持完美的中英文分词.

4.1.3 Apple 中国

苹果一向以高水准的设计著称它的中文官方网站所有内容中英文之间均添加了空格参考图 4 和图 5.

![](https://images2018.cnblogs.com/blog/407692/201802/407692-20180223203515410-1395574145.png)

图 4 Apple 中国官网 2018 年首页广告

![](https://images2018.cnblogs.com/blog/407692/201802/407692-20180223203619092-1190276178.png)

图 5 Apple 中国官网文章

### 4.1.4 IBM 中国

IBM 中国官方网站绝大多数网页内容中英文间也添加了空格参考图 6.

![](https://images2018.cnblogs.com/blog/407692/201802/407692-20180223203841483-1435935505.png)

图 6 IBM Hadoop 产品页面

### 4.1.5 电脑报

图 7 是电脑报 2014 年 5 月 5 日的一篇文章可以看到中英文间添加了空格.

![](https://images2018.cnblogs.com/blog/407692/201802/407692-20180223203850841-2103516276.jpg)

图 7 电脑报文章

## 4.2 部分支持或不支持的例子

4.2.1 亚马逊

亚马逊中国的页面相当任性空格添加与否完全视工程师的个人喜好.

例如图 8 展示的个人帐户菜单我的Prime会员我的 Kindle Unlimited”和“您的 Amazon Drive”三个菜单项不管从空格的应用还是从遣词手法风格迥异很难说它们出自同一个工程师之手.

![](https://images2018.cnblogs.com/blog/407692/201802/407692-20180223003254351-270979237.png) 图 8 亚马逊中国网站“我的帐户”菜单
### 4.2.2 百度百科维基百科

百科类网站特点在于共同编辑. 在享受集体智慧的同时也无法要求实现统一的阅读效果.

4.2.3 博客园

博客园的主要用户群体是软件工程师俗称码农.

这个群体的特点是很少在意措辞讨厌写文章不擅长交流——不管是口头还是书面. 因此码农在写文章的时候完全不考虑读者的感受只管自己瞎鸡吧写. 打开博客园首页几乎没有看到在中英文间添加空格的文章参考图 9.

![](https://images2018.cnblogs.com/blog/407692/201802/407692-20180223204109443-2048662779.png)

图 9 博客园首页

> 当然我也是写开心就好而且禁止评论.

5 造成这种情况的原因

简单来说就如这段引文所讲.

毕竟不算大众需求

  1. 只有部分国家的人需要
  2. 这些国家的普通用户恐怕大部分都不在意这些空格

6 现有的解决方案

6.1 CSS

正如我前面说的将中英文分开本质上是内容呈现样式的问题和内容本身是无关的. 遗憾的是尽管 CSS 3CSS 4 标准均有 text-autospace 的相关内容然而在目前的技术和现实环境下只有微软的 Internet Explorer 支持 -ms-text-autospace 特性可以为中英文间自动添加空格微软在文字处理方面一直领先业界.

6.2 浏览器插件

在多数浏览器均不支持的情况下一般使用 js 插件或者其他语言写成的插件完成. 比如 text-autospace.js为什么你们就是不能加个空格呢Chrome/FireFox 插件等.

The End.


  1. 因我写作的内容常有数学公式习惯使用英文句点“.”代替中文句号“但引用的文字均按照原文使用中文句号. ↩︎

  2. Chinese Copywriting Guidelines阅读原文. ↩︎

  3. GitHub/text-autospace.jsdemo. ↩︎

  4. GitHub/pangu.jsview on GitHub. ↩︎

posted on2018-02-23   Conmajia  阅读(1014)  评论(0编辑  收藏  举报

编辑推荐:
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?
点击右上角即可分享
微信分享提示