When a website uses a font your device doesn’t support, the browser usually shows a fallback font instead, such as a default system font or another font listed in the site’s font stack. If no fallback is available, some characters may appear as blank boxes or missing glyphs, and the text can look different from what the site designer intended.

What you might notice

  • The page still loads normally, but the text style changes.
  • Headings or brand text may look less polished or inconsistent across devices.
  • In some cases, special characters may not render correctly and appear as boxes or placeholders.

Why this happens

Websites often define a font list, so if the first font is unavailable, the browser tries the next one. For web fonts, problems can also come from loading issues, browser restrictions, or unsupported font weights/styles.

Simple example

A site may ask for a decorative font first, then fall back to Arial, then to any generic sans-serif font. On your device, you may see Arial or the generic font if the decorative one is missing.

How site owners avoid it

  • Use web-safe or widely supported fallback fonts.
  • Include a proper font stack in CSS.
  • Host or embed the font correctly with @font-face when appropriate.

TL;DR: the website usually doesn’t break; it just displays a different font, and in worst cases some characters may not render properly.