Welcome Font Awesome 5 - The Free Font that made 1 Mln on Kickstarter

Font Awesome 5 was just released today. But it's much more than just an icon-font - here's what you need to know.

Icon-Fonts use has Changed

I believe we've all worked with icon-fonts, and after an initial learning curve we kind of figured it out. But the web has changed a lot since then, and needs changed.

8 Problems we had with old-style icon-fonts

1. Glyphicons - the famous icon-pack included in Bootstrap 3 (but not BS4) always needed 2 classes to add, so you had to create a <span class="glyphicons glyphicons-up"> to make it work. That is still common today, though it's just an unecessary hassle, thanks to now widely supported CSS3.
2. Font-packs grew larger and larger, and suddenly started slowing down websites which needed only 5 icons, but always downloaded the font with 2'000 icons
3. Font-icons were an important solution to "bundle" small icons together, because many small requests slowed down the page dramatically. But this is becoming obsolete, thanks to HTTP2.
4. Every icon-font was always missing 1-2 icons, so people would start using multiple libraries, slowing down the site even more, and causing various issues like icon-class-name collisions. 
5. When using icon-fonts with screen readers, this cause issues because internally the icon was just a cryptic, japanese or mongolian character number, which the screen reader couldn't interpret.
6. When using icon-fonts in desktop solutions (Photoshop, Illustrator, etc.) it was very hard to pick an icon, because they didn't have ligatures (nice names)
7. As online typography matured, many new needs arose like professionally created bold-styles (so no the crapy just-make-the-line-thicker stuff)
8. As screens got better, small icons looked bad on high res, and high-res icons looked bad in tiny scenarios.

JavaScript Automation Changes Needs

JavaScript automation (incl. Webpack, Gulp, Angular-CLI etc.) changed the way developers solve problems:

1. we now want to package our own custom icons-fonts at dev time (making smaller, custom icon libraries)
2. in many scenarios we prefer SVG icons to font-icons
3. ...and SVGs can also be included in a compact SPA JavaScript, further reducing the need for more server requests and creating single-file deployment solutions

Font Awesome 5 for 1'000'000 USD

That's right: the most popular, free icon-library raised one Million dollars on kickstarter to fix all these things, and open-source all the tools they developed in the process. How awesome is that? Here's the link BTW.

So what did they do that is so awesome?

1. they designed all icons in a top-notch manner, providing every icon in the correct typographic version incl. solid, regular, light etc.
2. they added ligatures to all icons, so that screen-readers (accessibility) and desktop-designers could finally use them in the right way
3. provide everything in font-format, as well as SVG
4. created an open-source JavaScript framework to use svg-icons the same way you would use font-icons, allowing us to bundle it into existing solutions
5. gave us all a free CDN for people who want to use the whole font
6. ...and way more

Kudos to the FontAwesome team 

You did an amazing job, and open-sourcing your work will help other fonts to quickly achieve a similar level of professionality. You guys rock!

Love from Switzerland,
Daniel

PS: Read more about font-icons in our blog posts.