1

Quick question.

Context: I'm learning CSS with my first website.

Let's say that i want to use a certain font on a header, this font doesn't come with any OS. So i can just place it in the server and use @font-face to instruct the browser to load and and display the font.

BUT that would add one more thing for the user's browser to load, and i want my website to be at least a bit lightweight.

Would adding one or two fonts make my website sluggish? or that wouldn't make much of a difference since .ttr files are very small?

1

It is an http request/file load... just like an image is an http request/ file load.

Is it "bad design"? No. It's fairy common now and really only becomes problematic if you are using too many fonts, especially custom fonts.

You can expedite loading, and possibly reduce http requests, by using common repositories, such as Google Fonts. That way fonts may have already been cached in the user's browser.

2
  • Oh cool, how does it work? do i need to instruct the browser to check the cache first and if it doesn't find the font check an url? Mar 14 at 2:19
  • @NandoAguiar No, you don’t have to do anything. If you use a Google Font, you link to the font directly on Google’s servers by simply inserting a snippet you get from the Google Fonts website, and they take care of all the caching and optimisation. You don’t have access to the user’s browser’s font cache anyway. Mar 14 at 9:30

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.