Media in Strapi: Image Formats, CDN Strategy, and SEO Alt Text

Strapi stores uploads and returns URLs in API responses. To get fast, SEO-friendly images you need a plan for formats, CDN, and alt text.

Where media lives

By default, Strapi stores files on the server’s filesystem and serves them from its own URL. For production, that’s often not ideal: you want a CDN and control over formats. Use a Strapi upload provider (e.g. S3, Cloudinary, R2) so uploads go to object storage; then either serve through that provider’s CDN or put a CDN in front. Configure the provider via Strapi’s plugin config so all new uploads use it; existing files may need a one-time migration.

Image formats and optimization

Strapi doesn’t resize or convert images by default. For responsive and modern formats (WebP, AVIF), either use a provider that does transforms (e.g. Cloudinary) or process images in the front end. In Next.js, use next/image with the Strapi image URL as src and add your Strapi domain to remotePatterns; Next.js will optimize and serve the right format. Alternatively, generate responsive URLs in your API layer (e.g. append query params that your CDN or provider understands) and pass those to the front end. Either way, avoid serving raw full-size uploads to the client.

Alt text and SEO

Store alt text in Strapi: use the alternativeText field on the Media type (or a custom field if you’ve extended it). Expose it in your API response and use it in the front end for every <img> and in next/image’s alt prop. Require alt for images used in content (e.g. in rich text or hero); make it optional only for purely decorative images. That keeps accessibility and SEO consistent. If you have a separate “caption” field, you can use that for visible captions and keep alternativeText for screen readers and crawlers.

<Image
  src={getStrapiMedia(image.url)}
  alt={image.alternativeText ?? ""}
  width={image.width ?? 800}
  height={image.height ?? 450}
/>

Summary

Send uploads to object storage and a CDN via an upload provider. Rely on Next.js image optimization or a transform service for formats and sizing. Store and expose alt text from Strapi and use it in all image tags. That’s a solid media strategy for Strapi with good performance and SEO.