Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Icons – Google Fonts

fonts.google.com

Post reply on HN
Print view View original

181–190 of 190 posts

Re: Icons – Google Fonts

#181

Post by vagab0nd »

tomasroggero wrote: post #152
vagab0nd wrote: post #97

Google Fonts used to have this great feature where I can select a number of fonts and view them all on a single page. It was super useful because I can type in any text and preview the text in these selected fonts. However, I can't seem to find this feature any more. Right now if I select fonts, they just show up in the sidebar. But I can preview them in any way. There's gotta be something that I missed?

After you selected a few, you can review your selection in the Share page. For example, https://fonts.google.com/share?selection.family=Akaya%20Teli...

Wow, thank you! Why in the hell would they hide such a useful feature?

Re: Icons – Google Fonts

#182

Post by pocketgrok »

legitster wrote: post #131
eek04_ wrote: post #112

Earlier quoted context omitted.

> Also, never use Google’s CDN for loading fonts or icons — always self-host them. The CDNs are used to track your users. Any evidence of this claim? Also, given that the Google CDNs allow caching for 24h, it seems extremely ineffective even if it was done.

Yeah, seconding this. The main benefit of using a Google CDN is that there is a huge chance it's already cached on the client device. Which would mean that there is less useful tracking information.

Browsers are moving to block cross-site caching though.

https://blog.mozilla.org/security/2021/01/26/supercookie-pro...

Re: Icons – Google Fonts

#183

Post by ficklepickle »

SquareWheel wrote: post #57

The real benefit here is that you can export these as SVG. Please do this instead. Icon fonts are convenient, but they're really bad for web performance. It needs to download the entire font even if there's only a handful of icons on a page. SVGs have excellent browser support, and decent CMS support. You can enable them in Wordpress for example with a little tinkering. If you want to make your site faster (and I hop…

Keep in mind the quantity of DOM nodes being rendered, especially on mobile.

For example, this[0] page loads too slowly on low-end mobile, even though each individual SVG is aggressively optimized to be a tiny file size.

I need to replace them with PNG/WebP. The file sizes would increase, but overall performance would be better (I have tested this).

Now these are illustrations, which are more complex than icons.

0 - https://justtrivia.fun/categories

Re: Icons – Google Fonts

#184

Post by pests »

SquareWheel wrote: post #57

The real benefit here is that you can export these as SVG. Please do this instead. Icon fonts are convenient, but they're really bad for web performance. It needs to download the entire font even if there's only a handful of icons on a page. SVGs have excellent browser support, and decent CMS support. You can enable them in Wordpress for example with a little tinkering. If you want to make your site faster (and I hop…

Semi related but there was a HN post a few weeks back about a tool that would scan your site and then modify the font file to only include the characters or icons you actually used. I still think SVGs are a better option.

Re: Icons – Google Fonts

#185

Post by SquareWheel »

ficklepickle wrote: post #183
SquareWheel wrote: post #57

The real benefit here is that you can export these as SVG. Please do this instead. Icon fonts are convenient, but they're really bad for web performance. It needs to download the entire font even if there's only a handful of icons on a page. SVGs have excellent browser support, and decent CMS support. You can enable them in Wordpress for example with a little tinkering. If you want to make your site faster (and I hop…

Keep in mind the quantity of DOM nodes being rendered, especially on mobile. For example, this[0] page loads too slowly on low-end mobile, even though each individual SVG is aggressively optimized to be a tiny file size. I need to replace them with PNG/WebP. The file sizes would increase, but overall performance would be better (I have tested this). Now these are illustrations, which are more complex than icons. 0 -…

Good point about DOM size. I wonder if using external SVGs would have had the same effect? I don't know enough about browser rendering to know if that matters.

Re: Icons – Google Fonts

#186

Post by eurasiantiger »

charcircuit wrote: post #165
Kaze404 wrote: post #69

Earlier quoted context omitted.

Ticket: "Your website isn't very accessible to people using screen readers. Could you improve it with aria tags please?" Response: "It's not my fault you're blind. Ticket closed."

No, my response is that your screen reader sucks. For example a bad screen reader might require that an image of an apple has to be labelled apple for it to work, but a good one could just see that image and recognize that it is a picture of an apple.

That is actually an awesome idea.

Re: Icons – Google Fonts

#187

Post by petters »

DangerousPie wrote: post #24
petters wrote: post #23

Earlier quoted context omitted.

When developing, the fact that icon fonts follow the size and color of the surrounding text is nice, though. E.g. when tweaking the text color of a button. At least in my limited frontend experience.

SVGs can do the same thing.

Thanks for the clarification. Clearly, I have things to learn about SVGs.

Re: Icons – Google Fonts

#188

Post by emarthinsen »

Macha wrote: post #94
emarthinsen wrote: post #79

Interesting that they have icons for "nordic walking" and "electric rickshaw", but nothing for twitter or a tweet.

Seems pretty clear they're avoiding icons that specifically reference 3rd party brands. What would a generic icon for a tweet be that differs from a "message" icon?

Maybe. They have a Facebook one and a few for some other social platforms. I'm not sure why there isn't one for Twitter and GitHub. I'm not saying there is any strategy going on, it's just interesting to see what is and isn't included in icon sets.

Re: Icons – Google Fonts

#189

Post by vintagedave »

bckygldstn wrote: post #123
crazygringo wrote: post #115

Earlier quoted context omitted.

On the one hand, I absolutely agree with you. I tremendously lament the fact that outline, color, and shading have been thrown out so now we're trying to decipher little rounded-box hieroglyphics based on lines being subtly different. But on the other hand, the problem is that icons took so much work to create before, and also because they had such a recognizable identity/brand they weren't easy to reuse. Now the ico…

FYI there is a setting in gmail that turns the mystery icons into text labels: https://support.google.com/mail/answer/2473038?hl=en-GB

Bizarrely, it changes the buttons to text _only_. Not a glyph plus caption.

A glyph plus text is more recognisable and explanatory than either.

Re: Icons – Google Fonts

#190

Post by panarky »

eurasiantiger wrote: post #4

The provided usage example is bad for accessibility: the name of the icon, e.g. ”check_circle”, will be announced by screen readers. If there is other contextual information that explains the icon, the icon can be hidden from screen readers using aria-hidden=”true”. However, in cases where the icon appears stand-alone, it needs to contain a human-understandable text that explains its meaning. Also, never use Google’s…

> The CDNs are used to track your users

Is there evidence of this or is it just your conjecture?

Post reply on HN