diff --git a/website/docs/usage/101/_vectors-similarity.mdx b/website/docs/usage/101/_vectors-similarity.mdx
index c27f777d8..6deab926d 100644
--- a/website/docs/usage/101/_vectors-similarity.mdx
+++ b/website/docs/usage/101/_vectors-similarity.mdx
@@ -134,6 +134,7 @@ useful for your purpose. Here are some important considerations to keep in mind:
 <Image
   src="/images/sense2vec.jpg"
   href="https://github.com/explosion/sense2vec"
+  alt="sense2vec Screenshot"
 />
 
 [`sense2vec`](https://github.com/explosion/sense2vec) is a library developed by
diff --git a/website/docs/usage/layers-architectures.mdx b/website/docs/usage/layers-architectures.mdx
index 37f11e8e2..8f6bf3a20 100644
--- a/website/docs/usage/layers-architectures.mdx
+++ b/website/docs/usage/layers-architectures.mdx
@@ -113,6 +113,7 @@ code.
 <Image
   src="/images/thinc_mypy.jpg"
   href="https://thinc.ai/docs/usage-type-checking#linting"
+  alt="Screenshot of Thinc type checking in VSCode with mypy"
 />
 
 </Accordion>
diff --git a/website/docs/usage/projects.mdx b/website/docs/usage/projects.mdx
index 8ec035942..f3cca8013 100644
--- a/website/docs/usage/projects.mdx
+++ b/website/docs/usage/projects.mdx
@@ -943,7 +943,7 @@ full embedded visualizer, as well as individual components.
 > $ pip install spacy-streamlit --pre
 > ```
 
-![](/images/spacy-streamlit.png)
+![Screenshot of the spacy-streamlit package in Streamlit](/images/spacy-streamlit.png)
 
 Using [`spacy-streamlit`](https://github.com/explosion/spacy-streamlit), your
 projects can easily define their own scripts that spin up an interactive
diff --git a/website/docs/usage/spacy-101.mdx b/website/docs/usage/spacy-101.mdx
index a02e73508..6d444a1e9 100644
--- a/website/docs/usage/spacy-101.mdx
+++ b/website/docs/usage/spacy-101.mdx
@@ -567,7 +567,10 @@ If you would like to use the spaCy logo on your site, please get in touch and
 ask us first. However, if you want to show support and tell others that your
 project is using spaCy, you can grab one of our **spaCy badges** here:
 
-<img src={`https://img.shields.io/badge/built%20with-spaCy-09a3d5.svg`} />
+<img
+  src={`https://img.shields.io/badge/built%20with-spaCy-09a3d5.svg`}
+  alt="Built with spaCy"
+/>
 
 ```markdown
 [![Built with spaCy](https://img.shields.io/badge/built%20with-spaCy-09a3d5.svg)](https://spacy.io)
@@ -575,8 +578,9 @@ project is using spaCy, you can grab one of our **spaCy badges** here:
 
 <img
   src={`https://img.shields.io/badge/made%20with%20❤%20and-spaCy-09a3d5.svg`}
+  alt="Made with love and spaCy"
 />
 
 ```markdown
-[![Built with spaCy](https://img.shields.io/badge/made%20with%20❤%20and-spaCy-09a3d5.svg)](https://spacy.io)
+[![Made with love and spaCy](https://img.shields.io/badge/made%20with%20❤%20and-spaCy-09a3d5.svg)](https://spacy.io)
 ```
diff --git a/website/docs/usage/visualizers.mdx b/website/docs/usage/visualizers.mdx
index f1ff6dd3d..1d3682af4 100644
--- a/website/docs/usage/visualizers.mdx
+++ b/website/docs/usage/visualizers.mdx
@@ -437,6 +437,6 @@ Alternatively, if you're using [Streamlit](https://streamlit.io), check out the
 helps you integrate spaCy visualizations into your apps. It includes a full
 embedded visualizer, as well as individual components.
 
-![](/images/spacy-streamlit.png)
+![Screenshot of the spacy-streamlit package in Streamlit](/images/spacy-streamlit.png)
 
 </Grid>
diff --git a/website/pages/index.tsx b/website/pages/index.tsx
index 4c0932926..3f08ec007 100644
--- a/website/pages/index.tsx
+++ b/website/pages/index.tsx
@@ -89,8 +89,8 @@ const Landing = () => {
                 </LandingCard>
 
                 <LandingCard title="Awesome ecosystem" url="/usage/projects" button="Read more">
-                    Since its release in 2015, spaCy has become an industry standard with
-                    a huge ecosystem. Choose from a variety of plugins, integrate with your machine
+                    Since its release in 2015, spaCy has become an industry standard with a huge
+                    ecosystem. Choose from a variety of plugins, integrate with your machine
                     learning stack and build custom components and workflows.
                 </LandingCard>
             </LandingGrid>
@@ -206,7 +206,10 @@ const Landing = () => {
             <LandingGrid cols={2}>
                 <LandingCol>
                     <Link to="/usage/projects" hidden>
-                        <ImageFill image={projectsImage} />
+                        <ImageFill
+                            image={projectsImage}
+                            alt="Illustration of project workflow and commands"
+                        />
                     </Link>
                     <br />
                     <br />
diff --git a/website/src/components/card.js b/website/src/components/card.js
index 9eb597b7b..3e973daae 100644
--- a/website/src/components/card.js
+++ b/website/src/components/card.js
@@ -1,6 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
+import ImageNext from 'next/image'
 
 import Link from './link'
 import { H5 } from './typography'
@@ -18,8 +19,7 @@ export default function Card({ title, to, image, header, small, onClick, childre
                 <H5 className={classes.title}>
                     {image && (
                         <div className={classes.image}>
-                            {/* eslint-disable-next-line @next/next/no-img-element */}
-                            <img src={image} width={35} alt="" />
+                            <ImageNext src={image} height={35} width={35} alt={`${title} Logo`} />
                         </div>
                     )}
                     {title && (
diff --git a/website/src/components/title.js b/website/src/components/title.js
index 0aab4b5ba..64754d7d6 100644
--- a/website/src/components/title.js
+++ b/website/src/components/title.js
@@ -51,8 +51,7 @@ export default function Title({
 
                     {image && (
                         <div className={classes.image}>
-                            {/* eslint-disable-next-line @next/next/no-img-element */}
-                            <img src={image} width={100} height={100} alt="" />
+                            <Image src={image} width={100} height={100} alt={`${title} Logo`} />
                         </div>
                     )}
                 </div>
diff --git a/website/src/templates/universe.js b/website/src/templates/universe.js
index e68acfad2..73dde219c 100644
--- a/website/src/templates/universe.js
+++ b/website/src/templates/universe.js
@@ -81,10 +81,11 @@ const UniverseContent = ({ content = [], categories, theme, pageContext, mdxComp
                                     }
                                     const url = `/universe/project/${id}`
                                     const header = youtube && (
-                                        // eslint-disable-next-line @next/next/no-img-element
-                                        <img
+                                        <Image
                                             src={`https://img.youtube.com/vi/${youtube}/0.jpg`}
-                                            alt=""
+                                            alt={title}
+                                            width="480"
+                                            height="360"
                                             style={{
                                                 clipPath: 'inset(12.9% 0)',
                                                 marginBottom: 'calc(-12.9% + 1rem)',