9 ms·

Web Fonts for images are a true anti-pattern. It's actually almost funny how many pages are full of ſ and so forth, because they assume that folks are using a

by wtbob 10y ago

Web Fonts for images are a true anti-pattern. It's actually almost funny how many pages are full of ſ and so forth, because they assume that folks are using a graphical browser running JavaScript.

tajen 10y ago
Some day we should deprecate browsing the web with HTML 1.0 tools, apart from web crawlers who know what they are doing. Sticking with that is akin to sticking to horses on the road: It has its advantages, but you can require everyone to build horse-friendly roads for you in 2016. At least horse riders aren't vocal about their bad experience.
- ffggvv 10y ago
  Screen readers, scrapers/crawlers, future readers (will your page be readable in 1000 years?), archiving...
  - throwanem 10y ago
    > will your page be readable in 1000 years? In entire fairness, the evolution of language may well make this impossible, or nearly so, regardless of how you structure your content. It's not unreasonable to shoot for 100 years, though.
    - zeveb 10y ago
      > In entire fairness, the evolution of language may well make this impossible, or nearly so, regardless of how you structure your content. Are you aware that we're completely able to read documents from thousands of years ago? C.f. Caesar's Bellum Gallicum, which is about 2,050 years old.
      - throwanem 10y ago
        You're absolutely right, of course. I'm not even sure why I thought that made sense when I said it; thanks for catching the oversight.
        zeveb 10y ago
        Thank you for responding so nicely! As to why you wrote it — heh, we've all been there.
madeofpalk 10y ago
I don't think there's anything wrong with assuming people are running a graphical browser. We're at the point where, depending on your exact industry/usecase, earlier IE versions are less than 1% for a lot of 'mainstream' sites. The amount of people who aren't able to render a custom web font, let alone a non-graphical browser, would be in the extreme minority. IMHO, that is not a use case that's not worth worrying about.
- johannes1234321 10y ago
  Well, of course there are those who are weird, like Mr. Stallman: > I generally do not connect to web sites from my own machine, aside from a few sites I have some special relationship with. I usually fetch web pages from other sites by sending mail to a program (see git://git.gnu.org /womb/hacks.git) that fetches them, much like wget, and then mails them back to me. Then I look at them using a web browser, unless it is easy to see the text in the HTML page directly. I usually try lynx first, then a graphical browser if the page needs it (using konqueror, which won't fetch from other sites in such a situation). https://stallman.org/stallman-computing.html https://stallman.org/stallman-computing.html But there are other groups of people for which this is relevant: Blind or otherwise visually impaired people depending on screen readers or similar. Those don't have a good choice and abusing text there makes the experience unbearable.
  - blowski 10y ago
    I received an accessibility report for a website made by a big reputable accessibility agency, and they had no problem with us using Font Awesome. It's ignored by screen readers, unless you put a title attribute, which you can do if the icon is more than decorative. That said, I use NoScript with 'Forbid Font-Face' enabled, so a lot of the time I see squiggles instead of icons. But that's my choice, and I'm almost certainly in the minority, so I'm not angry about sites that use fonts instead. SVG probably will come to replace font icons, but for now, they've been really helpful for a lot of small sites.
  - madeofpalk 10y ago
    I don't understand this. Most icon fonts use PUA codepoints to avoid issues with screen readers. If you're not going to use icon fonts, what are you going to use? Images? CSS Backgrounds? Inline SVGs? Screen readers can't read any of them. Thankfully there are ways to make all of these accessible, with things like ARIA attributes.
gpvos 10y ago
Hear, hear. Web fonts are fine when used as fonts. They are not fine when used as images (unless the image corresponds to an actual Unicode character).
deleted 10y ago
[deleted]
Zardoz84 10y ago
aria-hidden="true"
YngwieMalware 10y ago
From a design perspective font icons are a very good solution when compared to sprite sheets or SVG. They are scalable, they load a single time, and contain nearly every iconic type of symbol you could want in a UI. That's not an anti-pattern.
- wtbob 10y ago
  > They are scalable, they load a single time, and contain nearly every iconic type of symbol you could want in a UI. An SVG is scalable, cacheable and can contain any vector art you could wish for. And it doesn't use characters to represent images.
  - recursive 10y ago
    Are you aware of any of the recent actions of the Unicode consortium? You can start here. http://www.unicode.org/emoji/charts/emoji-released.html http://www.unicode.org/emoji/charts/emoji-released.html
    - gpvos 10y ago
      Compounding mistakes doesn't make it right.
    - wongarsu 10y ago
      Emoji are almost exclusively used embedded in regular text. Emoji work similar to our regular alphabet, only that they are typically used to express emotions and abstract concepts that are harder to express in regular words. Since we have regular text and emojis used in the same context (and often as part of the same sentence) it makes sense for unicode to support both. This is fundamentally different from icon fonts. twitter icon or mailbox icon are not meant to be used inside of text, so they have no business in fonts.
  - amelius 10y ago
    > An SVG is scalable But fonts have hinting, so they look nice at low sizes and low resolutions. This is something that SVG is still missing.
paulddraper 10y ago
You'd rather see SVG XML?

by wtbob 10y ago

Web Fonts for images are a true anti-pattern. It's actually almost funny how many pages are full of ſ and so forth, because they assume that folks are using a graphical browser running JavaScript.

tajen 10y ago

Some day we should deprecate browsing the web with HTML 1.0 tools, apart from web crawlers who know what they are doing. Sticking with that is akin to sticking to horses on the road: It has its advantages, but you can require everyone to build horse-friendly roads for you in 2016. At least horse riders aren't vocal about their bad experience.

ffggvv 10y ago
Screen readers, scrapers/crawlers, future readers (will your page be readable in 1000 years?), archiving...
- throwanem 10y ago
  > will your page be readable in 1000 years? In entire fairness, the evolution of language may well make this impossible, or nearly so, regardless of how you structure your content. It's not unreasonable to shoot for 100 years, though.
  - zeveb 10y ago
    > In entire fairness, the evolution of language may well make this impossible, or nearly so, regardless of how you structure your content. Are you aware that we're completely able to read documents from thousands of years ago? C.f. Caesar's Bellum Gallicum, which is about 2,050 years old.
    - throwanem 10y ago
      You're absolutely right, of course. I'm not even sure why I thought that made sense when I said it; thanks for catching the oversight.
      - zeveb 10y ago
        Thank you for responding so nicely! As to why you wrote it — heh, we've all been there.

madeofpalk 10y ago

I don't think there's anything wrong with assuming people are running a graphical browser. We're at the point where, depending on your exact industry/usecase, earlier IE versions are less than 1% for a lot of 'mainstream' sites. The amount of people who aren't able to render a custom web font, let alone a non-graphical browser, would be in the extreme minority. IMHO, that is not a use case that's not worth worrying about.

johannes1234321 10y ago
Well, of course there are those who are weird, like Mr. Stallman: > I generally do not connect to web sites from my own machine, aside from a few sites I have some special relationship with. I usually fetch web pages from other sites by sending mail to a program (see git://git.gnu.org /womb/hacks.git) that fetches them, much like wget, and then mails them back to me. Then I look at them using a web browser, unless it is easy to see the text in the HTML page directly. I usually try lynx first, then a graphical browser if the page needs it (using konqueror, which won't fetch from other sites in such a situation). https://stallman.org/stallman-computing.html https://stallman.org/stallman-computing.html But there are other groups of people for which this is relevant: Blind or otherwise visually impaired people depending on screen readers or similar. Those don't have a good choice and abusing text there makes the experience unbearable.
- blowski 10y ago
  I received an accessibility report for a website made by a big reputable accessibility agency, and they had no problem with us using Font Awesome. It's ignored by screen readers, unless you put a title attribute, which you can do if the icon is more than decorative. That said, I use NoScript with 'Forbid Font-Face' enabled, so a lot of the time I see squiggles instead of icons. But that's my choice, and I'm almost certainly in the minority, so I'm not angry about sites that use fonts instead. SVG probably will come to replace font icons, but for now, they've been really helpful for a lot of small sites.
- madeofpalk 10y ago
  I don't understand this. Most icon fonts use PUA codepoints to avoid issues with screen readers. If you're not going to use icon fonts, what are you going to use? Images? CSS Backgrounds? Inline SVGs? Screen readers can't read any of them. Thankfully there are ways to make all of these accessible, with things like ARIA attributes.

gpvos 10y ago

Hear, hear. Web fonts are fine when used as fonts. They are not fine when used as images (unless the image corresponds to an actual Unicode character).

deleted 10y ago

[deleted]

Zardoz84 10y ago

aria-hidden="true"

YngwieMalware 10y ago

From a design perspective font icons are a very good solution when compared to sprite sheets or SVG. They are scalable, they load a single time, and contain nearly every iconic type of symbol you could want in a UI. That's not an anti-pattern.

wtbob 10y ago
> They are scalable, they load a single time, and contain nearly every iconic type of symbol you could want in a UI. An SVG is scalable, cacheable and can contain any vector art you could wish for. And it doesn't use characters to represent images.
- recursive 10y ago
  Are you aware of any of the recent actions of the Unicode consortium? You can start here. http://www.unicode.org/emoji/charts/emoji-released.html http://www.unicode.org/emoji/charts/emoji-released.html
  - gpvos 10y ago
    Compounding mistakes doesn't make it right.
  - wongarsu 10y ago
    Emoji are almost exclusively used embedded in regular text. Emoji work similar to our regular alphabet, only that they are typically used to express emotions and abstract concepts that are harder to express in regular words. Since we have regular text and emojis used in the same context (and often as part of the same sentence) it makes sense for unicode to support both. This is fundamentally different from icon fonts. twitter icon or mailbox icon are not meant to be used inside of text, so they have no business in fonts.
- amelius 10y ago
  > An SVG is scalable But fonts have hinting, so they look nice at low sizes and low resolutions. This is something that SVG is still missing.

paulddraper 10y ago

You'd rather see SVG XML?