Images & videos for websites

Source, format and size – otherwise the page gets heavy and legally shaky.

The right format for images and videos

Images and videos make up most of a website’s weight. The right choice decides loading time, readability and whether Google rates the page well at all.

Image formats
WebP is today’s standard: usually smaller than JPEG or PNG at the same quality. Photos: WebP with a JPEG fallback. Logos, icons and sharp edges: SVG. PNG only where you need transparency and SVG does not fit. I do not use AVIF by default – the same quality number as WebP does not mean a smaller file. Contao builds the WebP variants automatically.

Size, not just format
A 4000-pixel photo in a 400-pixel column slows every page down – whatever the format. Images belong in the HTML at the width of the slot, with 1× and 2× variants via <picture>. Nothing should arrive larger than the screen needs.

Alt text
Every image needs a short alt text that says what is in the picture – for screen readers and image search. Good: “Cologne Cathedral at dusk, view from the Rhine”. Bad: “Image1” or the file name. Decorative backgrounds may be empty; content images may not.

Embedding videos
Short background or explainer clips loosen up a page. Compress them, no audio autoplay, and give them a still (poster). Large films are better loaded from YouTube or Vimeo so they do not bloat your own site – and watch the privacy side (cookie, two-click embed).

Licences
Not every image on the web may go on your site. Your own shots, paid stock or clearly licensed libraries (below) – “found on Google” is not a licence. That is how you stay clear of formal warnings.