diff --git a/docs/basic-features/font-optimization.md b/docs/basic-features/font-optimization.md
index a36b731b29b4..217267338e5a 100644
--- a/docs/basic-features/font-optimization.md
+++ b/docs/basic-features/font-optimization.md
@@ -23,29 +23,7 @@ By default, Next.js will automatically inline font CSS at build time, eliminatin
## Usage
-To add a web font to your Next.js application, override `next/head`. For example, you can add a font to a specific page:
-
-```js
-// pages/index.js
-
-import Head from 'next/head'
-
-export default function IndexPage() {
- return (
-
- )
-}
-```
-
-or to your entire application with a [Custom `Document`](/docs/advanced-features/custom-document.md).
+To add a web font to your Next.js application, add the font to a [Custom `Document`](/docs/advanced-features/custom-document.md).
```js
// pages/_document.js
@@ -74,6 +52,8 @@ class MyDocument extends Document {
export default MyDocument
```
+Note that we don't recommend adding fonts with `next/head`, as this only applies the font to the particular page and won't work with a streaming architecture.
+
Automatic Webfont Optimization currently supports Google Fonts and Typekit with support for other font providers coming soon. We're also planning to add control over [loading strategies](https://github.com/vercel/next.js/issues/21555) and `font-display` values.
See [Google Font Display](https://nextjs.org/docs/messages/google-font-display) for more information.