Agreed. It's been like 7 years since icon fonts were recommended and it's a real shame I still regularly see people do it today.

I mean the outdated tutorials still suggest icon fonts. What’s a good alternative?

I sometimes use svg's define symbol method `<defs>` (https://developer.mozilla.org/en-US/docs/Web/SVG/Element/def...), you combine all the icons you use into one document that you load with display none and then reference those symbols anywhere else on the page using svg `<use>`.

Use graphics for icons.

For a11y reasons, include a text alternative, like the alt attribute on <img> elements or adding a <title> in your <svg>.

https://css-tricks.com/accessible-svgs/