使用 HTML 字符实体

有这么一些字符 (如: 小于号和大于号) 是 HTML 中的保留标记. 为了以文本方式显示这些字符, 你必须在源代码中输入 HTML 字符实体. 例如: 可以通过输入 &lt; (实体名) 或者 &#60; (实体编号) 来显示小于号 (<). 在字符实体的列表里, 有非常多符号可以用在页面布局的设计中. 例如: → ♥ ♫ ✓ ✗ • ☞ ✁ ★ “ ⊕. 你以前是否已经见过雪人 ☃ 符号? 如果没有, 请继续阅读, 本文将给你更多惊喜.

字符实体相对于图片存在的优势

1. 加载速度快, 因为字符都是基于文本的.
2. 可以更具字体尺寸进行缩放.
3. 可以方便地改变颜色和改变造型.

撇号和引号

互联网上大部分的排版错误可能是混用了撇号好引号. 我们经常会将左单引号 (‘) 当作撇号 (’), 双撇号 (") 当作双引号 (“ ”) 来使用.

正确地使用撇号和引号, 你可以使用右单引号 (&rsquo;) 当作撇号. 使用左双引号 (&ldquo;) 和右双引号 (&rdquo;) 作为引用符号.

箭头符号

我尤其发现箭头符号很有用, 因为他们可以作为指向的箭头和面包屑 (页面导航) 的分割符.

链接分隔符

&bull; ( • ) 和 &sdot; ( ⋅ ) 是我喜欢的字符实体, 我将他们用来分割链接.

商标, 版权, 度数和货币符号

另外的一些通用符号可能就数商标, 版权, 度数和货币符号了.
Trademark ™ | © Copyright | Registered Trademark ®
Degree: 29° | 26 ℃ | 60 ℉
Currency: ¢ Cent | £ Pound | ¥ Yen | € Euro

用于网页设计的符号

这里有一些符号, 可能你会用在设计网页布局上.

各种各样的符号

这里有一些其他的符号, 很有可能你永远不会用到 (但它们很酷).

渲染问题

注意到 Mac 和 Windows 有不一样的渲染系统. 字符实体会在不同的操作系统中有不同的视觉表现. 在使用前, 请先核对一下.

参考链接

1. 这是一个完整的字符实体参考, Bigbaer.com - Character Entity Reference
2. W3Schools.com - Symbols Entities
3. Webstandards.org - Symbol Entities

译者的话

本文翻译自 Web Designer Wall - Using HTML Symbol Entities. 我同意作者关于字符使用三个优势的说法, 但是我不建议用户滥用这些字符, 因为不同的操作系统, 不同的浏览器和不同的界面字体都会影响其外观, 甚至是否支持某个字符都不确定.

如果你用某款手机打开这个页面, 可能会看到一些框框, 那是因为手机的字体集比较小, 字体库中没有这样的字符, 所以浏览器无法识别. 另外, 如果你使用不同浏览器打开这个页面, 出来的效果也可能大不相同. 这些差异都将导致用户体验逊色不少.

另外, 图片虽然讨厌, 但也有字符无法比拟的优越性. 试问一个字符可以用多个颜色来显示吗?

最后, 我建议择其常用字符, 必须使用的字符. 如 ©, <, >... 这些应用广泛的和必不可少的可以放心使用, 一些自己很少看到的 (如 ☃) 就不要用了.

尽信文不如无文, 希望看完这篇文章的朋友也有自己的见解, 欢迎下一个分享的人.