[docs] Remove outdated references of .ttf and .woff

[oliviertassinari]

Seeing .ttf and .woff still mentioned in the docs feels very clearly: "this is a 2019 project stuck in the past". Aren't those web font formats now very outdated? https://web.dev/articles/font-best-practices#use_woff2

We need to be coherent with https://mui.com/material-ui/getting-started/supported-platforms/#browser. So, hence the fix (faster to make a PR than to create an issue 😁).

Preview: https://deploy-preview-48399--material-ui.netlify.app/material-ui/customization/typography/#self-hosted-fonts

A continuation of #48398

[code-infra-dashboard]

Deploy preview

• docs/data/material/customization/typography/typography.md

Bundle size

Bundle	Parsed size	Gzip size
@mui/material	0B(0.00%)	0B(0.00%)
@mui/lab	0B(0.00%)	0B(0.00%)
@mui/private-theming	0B(0.00%)	0B(0.00%)
@mui/system	0B(0.00%)	0B(0.00%)
@mui/utils	0B(0.00%)	0B(0.00%)

Details of bundle changes

---

Check out the code infra dashboard for more information about this PR.

[ZeeshanTamboli]

Can we update this font-face style below to remove local:
src: local('Raleway'), local('Raleway-Regular'), url(${RalewayWoff2}) format('woff2');

[oliviertassinari]

Can we update this font-face style below to remove local:
src: local('Raleway'), local('Raleway-Regular'), url(${RalewayWoff2}) format('woff2');

@ZeeshanTamboli Why?

Those seems to work https://schalkneethling.com/posts/understanding-local-in-at-font-face-a-deep-dive/. A browser won't use a local font when declaring the font (@font-face), it only use the local font when referrencing one that is not declared.

The main problem with this seems that users might not have the "right" font installed under that name.

[ZeeshanTamboli]

Can we update this font-face style below to remove local:
src: local('Raleway'), local('Raleway-Regular'), url(${RalewayWoff2}) format('woff2');

@ZeeshanTamboli Why?

Those seems to work https://schalkneethling.com/posts/understanding-local-in-at-font-face-a-deep-dive/. A browser won't use a local font when declaring the font (@font-face), it only use the local font when referrencing one that is not declared.

The main problem with this seems that users might not have the "right" font installed under that name.

I misunderstood. Thanks for the explanation!