简体   繁体   English

为什么图标字体总是使用PUA?

[英]Why do icon fonts always use the PUA?

Sorry if this question is phrased awkwardly (or doesn't even make sense). 对不起,如果这个问题表达得很尴尬(或者甚至没有意义)。 I am struggling to understand a bit more of fonts and unicode but I am sort of lost. 我很难理解更多的字体和unicode,但我有点迷茫。 This question uses the Awesome font as an example because I assume it is well known, but the question applies to other icon fonts as well. 这个问题以Awesome字体为例,因为我认为它是众所周知的,但问题也适用于其他图标字体。

Unicode has many symbol characters. Unicode有许多符号字符。 I can do ☼ 我可以做☼ and (if all goes well) the user will see: ☼ 并且(如果一切顺利)用户将看到:☼

In case that did not render properly in your browser: it is a sun. 如果在您的浏览器中无法正确呈现:它是太阳。 The ☼ ☼ HTML entity corresponds to unicode point U+263c . HTML实体对应于unicode点U+263c

Now consider the famous Awesome font. 现在考虑着名的Awesome字体。 It also has a sun. 它还有一个太阳。 You render it by using a <i> element and setting this element's class to fa fa-sun-o . 您可以使用<i>元素并将此元素的类设置为fa fa-sun-o来渲染它。 This class is defined in the stylesheet as: 该类在样式表中定义为:

.fa-sun-o:before {
  content: "\f185";
}

From what I understand, the \\f thingy refers to unicode point U+f185, which is in the PUA, which basically means that font designers can use it for whatever they like. 根据我的理解,\\ f thingy指的是unicode点U + f185,它位于PUA中,这基本上意味着字体设计师可以将它用于他们喜欢的任何地方。

Now, I can understand that the PUA points are used for symbols that simply aren't in the unicode specification. 现在,我可以理解PUA点用于那些根本不在unicode规范中的符号。 But that doesn't apply to the sun icon. 但这并不适用于太阳图标。 Why didn't they just use \\263c ? 为什么他们不只是使用\\263c

Icon fonts do not always use the PUA. 图标字体并不总是使用PUA。 For example, the Wingdings font uses the range U+0021...U00FF. 例如,Wingdings字体使用范围U + 0021 ... U00FF。 This means that icon glyphs are assigned to code positions that are reserved for something else in Unicode, so this approach has obvious disadvantages (and some advantages). 这意味着图标字形被分配给为Unicode中的其他内容保留的代码位置,因此这种方法具有明显的缺点(以及一些优点)。

When an icon has not been encoded as a character in Unicode, the only feasible way to include it in a font is to use the PUA. 如果图标尚未编码为Unicode中的字符,则将其包含在字体中的唯一可行方法是使用PUA。 The PUA is meant to be used by private agreements in such cases. 在这种情况下,PUA旨在由私人协议使用。 In effect, an icon font design constitutes an agreement as soon as you knowingly decide to use the font, hopefully understanding the implications. 实际上,只要您有意识地决定使用字体,图标字体设计即表示协议,希望能够理解其含义。

There can be issues with symbols that might or might not be interpreted as already encoded in Unicode. 可能存在或可能不会解释为已在Unicode中编码的符号存在问题。 A font designer may find it simpler to allocate all icons in the font to PUA codepoints. 字体设计者可能会发现将字体中的所有图标分配给PUA代码点更为简单。

In particular, U+263C WHITE SUN WITH RAYS “☼”, although it is more or less iconic in nature, is still encoded as a character . 尤其是U + 263C WHITE SUN WITH RAYS“☼”虽然它或多或少具有标志性,但仍然被编码为一个角色 This means that it may vary, and is expected to vary, across fonts. 这意味着它可能会因字体而异,并且预计会有所不同。 In fact, it varies considerably. 事实上,它差异很大。 Although the basic shape tends to be the same, the size (relative to font size), stroke width, lengths of rays, etc. vary. 虽然基本形状趋于相同,但尺寸(相对于字体大小),笔划宽度,光线长度等不同。

A pure icon, in constrast, is just a specific shape. 相反,纯粹的图标只是一个特定的形状。 It may look similar to, or even identical to, the glyph of some character in some font, but it's still regarded as a standalone symbol. 它可能看起来与某些字体中某些字符的字形相似甚至相同,但它仍被视为独立符号。 This may change (it may become a character), if the icons are coded as characters later. 如果图标稍后被编码为字符,则这可能会改变(它可能变成一个字符)。

And, in practice, the fa-sun-o icon, although it could conceivable be used aa glyph for U+263C, differs from most glyphs for it (by having rather short rays). 并且,在实践中,fa-sun-o图标虽然可以设想用于U + 263C的字形,但与大多数字形不同(通过具有相当短的光线)。 If Font Awesome glyphs will be encoded a characters some day, it is quite possible that fa-sun-o will not be unified with U+263C, but a new character will be allocated. 如果Font Awesome字形有一天会被编码为字符,那么fa-sun-o很可能不会与U + 263C统一,但会分配一个新字符。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM