Adding Images and Media Correctly

Adding Images and Media Correctly

Images bring a page to life, but adding them the right way keeps your site fast, accessible and on-brand. A few minutes of preparation saves a great deal of tidying later.

This article covers choosing the right file, uploading it, and filling in the details that help both visitors and search engines understand your media.

Preparing the File

Photos straight from a phone or camera are far larger than a web page needs. Resizing and compressing them first keeps pages loading quickly.

  • Use JPG for photographs and PNG for logos or graphics with text.
  • Aim for a file under 300 KB where possible.
  • Give the file a clear, descriptive name before uploading.
  • Use SVG for simple icons when your editor supports it.

Adding Alt Text

Alt text is a short description of an image. Screen readers read it aloud, and it appears if the image fails to load, so it is essential for accessibility.

  1. Select the image after uploading it.
  2. Find the Alt text or Alternative text field.
  3. Describe the image in a few plain words.
  4. Leave it blank only for purely decorative graphics.

Frequently Asked Questions

My image looks stretched or blurry — why?

It is probably too small for the space it fills. Upload a larger version, or choose an image closer to the displayed size.

If you need a hand with any of this, your Progressive Robot delivery team is ready to help. Raise a ticket from the Support area of your client portal or speak to your account manager and we will guide you through the next steps.

Did you find this article useful?