Websites. Applications. Digital solutions.Michael Oracle’s personal portfolio ↗
Start a project
← All articles

MICHAEL ORACLE’S BLOG

How do I add good website photos without making pages slow?

WordPress and Performance
Computer and laptop on a workspace

Photo: Mateusz Dach / Pexels. Illustrative photograph. Photo source · Pexels licence

Good photographs do not need to arrive at their original camera resolution on every page. Choose an image that supports the content, serve an appropriate size and preserve a stable layout. That can improve the experience without replacing real pictures with generic artwork.

Match the image to the task

A project case study benefits from an actual screenshot showing the feature being discussed. A general planning article may use a licensed photograph as context. Label stock images honestly and do not imply that the person or workspace pictured belongs to your business.

Keep a record of the source and permitted usage. A picture being visible in search results does not make it free to reuse. Credits are helpful, but a credit alone does not replace permission.

Send the right amount of image data

Create web-sized versions rather than uploading a huge original into a small card. Use responsive image support where available so the browser can choose a suitable file. Check the result visually; aggressive compression can make text in a screenshot unreadable.

Give images width and height or an appropriate aspect ratio. This reserves space before the image loads and reduces unexpected movement while someone is reading or pressing a button.

Load images in the right order

The main visible image should not be delayed unnecessarily. Pictures well below the first screen can often load later. Google's responsive-image guidance describes the browser features involved.

Test on a phone and a slower connection, then verify that the image still communicates its purpose. A small file that looks broken is not a successful optimisation.

I can help through website design and WordPress support. Explore my portfolio or discuss your site. Read Why is my WordPress website slow on mobile but fast on desktop? for a wider performance review and Why is my website picture missing when I share a link on WhatsApp? for images used in social previews.

Use images deliberately. Each one adds value when it explains the work or gives relevant context, rather than simply extending the page.