CommunityNews

CommunityNews

Stop Using Icon Fonts

Just one year before the first web page went live in 1991, Microsoft began shipping perhaps the most well-known icon font, Wingdings. However, it would be nearly 22 years later before icon fonts would become a design trend on the internet.

The introduction of the @font-face CSS at-rule allowed web designers to specify custom fonts with which to display text. By 2011, all major browsers supported it. This gave birth to the idea that fonts composed of pictograms, like Wingdings, could be used in place of raster images on the web. Considering that real SVG support across all major browsers didn’t become stable until early 2020, icon fonts were the defacto way to add vector-based icons on your web site.

But icon fonts on the web were fundamentally flawed from the beginning. And now, with full SVG support at our disposal, it’s time to put a stop to their use, once and for all…

This thread was posted by one of our members via one of our news source trackers.

Where Next?

Popular Frontend topics Top

New
First poster: PaigePalmer
Progressive Web Apps (PWAs) are starting to get some attention. For instance, Amazon is using it for game streaming service on iOS. PWAs ...
New
First poster: dimitarvp
The future of web-based software architectures is already taking form, and this time it’s server-rendered (again). Papa’s got a brand new...
New
First poster: dyowee
The key reason why you (and likely most developers) struggle with CSS, is that you underestimate it. Underestimating CSS leads to a stra...
New
First poster: bot
The Tower of Hanoi is a classic mathematical puzzle that is often used as an introduction to recursion. We can express a solution to this...
New
New
First poster: bot
In this article, we will look at the fascinating evolution of graphics in browsers from the prehistoric days of the early browsers. We wi...
/js
New
First poster: bot
CSS Fingerprinting is a technique of tracking and gathering information on site visitors. This method exploits the nature of CSS to track...
New
brainlid
You are storing some Phoenix LiveView state in the browser. You want to retrieve that saved state as early as possible to improve the use...
New
New

Other popular topics Top

PragmaticBookshelf
Write Elixir tests that you can be proud of. Dive into Elixir’s test philosophy and gain mastery over the terminology and concepts that u...
New
wolf4earth
@AstonJ prompted me to open this topic after I mentioned in the lockdown thread how I started to do a lot more for my fitness. https://f...
New
siddhant3030
I’m thinking of buying a monitor that I can rotate to use as a vertical monitor? Also, I want to know if someone is using it for program...
New
AstonJ
Just done a fresh install of macOS Big Sur and on installing Erlang I am getting: asdf install erlang 23.1.2 Configure failed. checking ...
New
AstonJ
Biggest jackpot ever apparently! :upside_down_face: I don’t (usually) gamble/play the lottery, but working on a program to predict the...
New
AstonJ
We’ve talked about his book briefly here but it is quickly becoming obsolete - so he’s decided to create a series of 7 podcasts, the firs...
New
PragmaticBookshelf
Author Spotlight Mike Riley @mriley This month, we turn the spotlight on Mike Riley, author of Portable Python Projects. Mike’s book ...
New
PragmaticBookshelf
Author Spotlight: Peter Ullrich @PJUllrich Data is at the core of every business, but it is useless if nobody can access and analyze ...
New
PragmaticBookshelf
Develop, deploy, and debug BEAM applications using BEAMOps: a new paradigm that focuses on scalability, fault tolerance, and owning each ...
New
CommunityNews
A Brief Review of the Minisforum V3 AMD Tablet. Update: I have created an awesome-minisforum-v3 GitHub repository to list information fo...
New