网页上文字的最佳宽度是多少？

Question

我有一个流体布局，但是如果浏览器窗口被拉伸得太大，文本就会变得太宽，使得在一行上阅读如此长的句子变得奇怪。那么对于文本来说，什么是好的最大宽度呢？我想这取决于字体大小。是否有某种公式或启发式算法？

目前我的特定情况下，字体为16像素有衬线字体，但我很想知道不同字体和大小的最佳实践是什么。

- at.

---

试着去http://ux.stackexchange.com/问问，他们擅长这种东西（而且可能已经回答过了）。 - mbillard

Answer 1

Smashing Magazine曾对流行博客进行过设计研究，其中包含了本文所需的信息。下面引用2.2节中的信息。

2.2. 每行多少字符？

为确保最佳可读性，需要保证阅读舒适。虽然一些研究结果显示，每行字符数在52-68个之间（包括标点符号和空格）是最佳的，但其他研究表明，即使行越来越长，也不会对可用性产生显著影响。由于没有提供经验法则，设计师会尝试使用各种不同的行长度。

为计算每行最大字符数，我们使用了浏览器的默认设置以及样式表提供的默认排版设置。

• 10％的博客使用65-74个字符每行（PostSecret、Beppegrillo、Perez Hilton、Scobleizer、Blogoscoped）
• 18％的博客使用75-84个字符每行（Dooce、Blogs.nytimes.com、Joystiq、CopyBlogger、TUAW、Slashfilm）
• 34％的博客使用85-94个字符每行（Lifehacker、Huffington Post、Kottke、Ars Technica、Huffington Post、BoingBoing、Seth Godin、Treehugger、Problogger）
• 18％的博客使用95-104个字符每行（Mashable、ReadWriteWeb、Smashing Magazine、Google Blog、A List Apart、Search Engine Land）
• 16％的博客每行使用超过105个字符（Engadget、TechCrunch、GigaOM、Wired、TMZ）

根据我们的调查结果，我们有信心建议最常用（不一定最用户友好）行长度为80到100个字符之间。

有趣的是，并没有一个博客使用两端对齐文本——所有的博客都使用左对齐文本。

因此，宽度并不是真正重要的因素，影响可读性的是字符数。

- mbillard

Answer 2

我认为你可以使用960网格作为指南，并为您的流体布局设置最大宽度（我将我的设置为960像素），因为如果布局适应视口的宽度，没有人会喜欢在宽屏幕监视器上阅读文本。

所以，对于你的问题，我认为你应该根据字体的整体间距（行高和内容的填充/边距）设置宽度，并确保它与设计融合得很好。您的字体行高应在20像素至26像素之间，而填充/边距取决于您设计的风格。

希望能有所帮助 :)

- Billy

Answer 3

这取决于：

1. 字体大小
2. 列宽度
3. 平均访客屏幕分辨率
4. 您支持的设备。

我建议您检查分析中的平均屏幕分辨率，并为该受众提供服务。

话虽如此，如果您有一列固定的文本，请通过添加以下方式缩短行长：

a) 更多的列或
b) 图形或图片

- Jason Gennaro