use new icon library (Fork Awesome is deprecated)

[vincent-peugnet]

I just discovered that Fork Awesome which is used by W for icons, is deprecated. That's what is written on the README.

I red a bit about the reasons, and copied things that I found relevant in the context of W dev:

In short, icon fonts:

• are treated as fonts by browsers, and anti-aliased as such, which can decrease sharpness
• are positioned as pseudo elements, which are more complex/surprising to work with
• present an accessibility issue for screen-readers unless extra care is taken)
• need to be compiled per project, otherwise they contain unused icons

This last point bears emphasis: suppose, optimistically, a site uses 70 icons from Forkawesome. That means over 90% of the icon font was transferred and not used. The Forkawesome .woff2 + accompanying .css is 146.8 kB → ~ 130 kB wasted.

Icon fonts are a hack for <IE8. Any advantage they offer developers are outweighed by costs to users and network. All that said, the Forkawesome icon fonts do work OK!

I didn't knew all of that when we started using fork awesome.

So, it's not urgent at all, but maybe we can start scouting for the next solution. If anyone have ideas, it's very welcome !

[jbidoret]

Further reading : https://css-tricks.com/icon-fonts-vs-svg/
All in favor of SVG, mut requires a little more work than just dropping a font :)
A tool I used quite a lot is https://icomoon.io that allows to generate subsets from large (free or not so) icon libraries. Its app (https://icomoon.io/app/) allows to generate icon-font OR svg files (which could be the way to go).

[vincent-peugnet]

Ok thanks !
What I could imagine would be using font awsome icons svgs.
They have npm package but that contain only js.
I've found this: https://www.npmjs.com/org/svg-icons which coule be used to get the icons.
Then some tool to create a pack, I've found this one: https://github.com/svgstore/svgstore-cli
This will build icon pack to assets.

but maybe this is overkill.

svgstore-cli add 29 new packages