Custom Adobe Font take too many bandwidth

Here is our website: https://www.miensaigon.com/ build by webflow.

Like the title, we used custom font Garamond Premier Pro from Adobe, but it take up a ridiculous amount of total bandwidth. Which is not good since it also slow down our website.

If someone got an answer, please help us, thank you!

Hi there!

Custom fonts can significantly impact your site’s loading speed and bandwidth usage. To reduce bandwidth consumption from fonts like Garamond Premier Pro, follow these steps:

  1. Open the Style manager and search for the font name to locate all classes and HTML tags using it.
  2. Either remove elements using this font and clean up their unused classes in the Style manager, or update the font selection for those classes through Style panel > Typography > Font.
  3. Navigate to Site settings > Fonts tab > Custom fonts and click Delete next to the font you want to remove.
  4. Republish your site to apply the changes.

Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.

Custom fonts tend to be large files and you are forcing everyone to download them before they can view your site. Your only real option is to reduce them, but there are a few ways;

  • Reduce your use of fonts by cutting out variants, e.g. bold or italic, so fewer files need to be downloaded.
  • Eliminate the custom fonts altogether. e.g. If you’re only using the font in page headings, or CTAs, you might be able to replace those instances with images instead.
  • In some cases if you need support for a range of weights and italic versions, look at replacing it with a variable font. The font file is larger, but you only need 1 or 2 to support a full range of weights.

If you’re concerned about performance, you could consider reducing the font files needed specifically on mobile phones where the network can be slower and more expensive, depending on your user base.

If you’re concerned about bandwidth, you could consider off-hosting the custom fonts, which requires a bit of technical acumen and custom code setup to support the designer.