Choose link-page images that clarify the offer
Select, crop, describe, and maintain images that help visitors recognize products, understand services, and trust what they are seeing.
The useful takeaway
Choose each image for a specific communication job, then check it at the size visitors will actually see.
The best image for a link page is not always the most dramatic image in your library. It is the one that helps a visitor understand something useful: whose page this is, which product was featured, what a service looks like, or what they can expect after clicking. Choosing by purpose prevents a small page from becoming a collection of unrelated attractive pictures.
Assign a job to every image
Before selecting files, list the visual questions the page needs to answer. A portrait may identify a solo professional. A product image may connect a social post to an item for sale. A work example may help someone judge whether a service matches their needs. If two images answer the same question, decide whether both are necessary.
For a hypothetical handmade stationery shop, a clear notebook photograph may be more useful than a wide desk scene containing many products. The scene communicates mood, but the close view identifies the item. You can use both if they serve different sections, but the main product action should not rely on a visitor recognizing a small object hidden among decorative props.
Check accuracy before aesthetics
An image should represent the current offer honestly. Verify the color, included accessories, packaging, and scale where they affect the decision. A styled photograph can still be useful, but supporting copy should clarify what is actually included. Avoid using an old version of a product simply because its photograph is better than the current one.
For services, choose examples that reflect work you genuinely provide and have permission to show. Do not use stock imagery in a way that implies it is a completed client project. If an image is an illustration or concept, identify that when the distinction matters. A smaller collection of accurate images is preferable to a polished gallery that creates unrealistic expectations about the business's work or facilities.
Crop for the actual card and screen
Preview the image in the intended layout, not just in an image viewer. A square card, wide banner, and circular portrait each emphasize different parts of a photograph. Keep the important subject away from crop boundaries and inspect both narrow and wide screens. If the crop removes essential context, select another image or use a layout that preserves it.
Check sharpness at the displayed size. Enlarging a small source file can make a page look blurry, while uploading a very large file without appropriate delivery can waste bandwidth. Web.dev explains responsive images as a way to serve suitable image resources for different display conditions. If your builder handles optimization, still inspect the published result; an upload preview does not prove that the final crop and resolution are appropriate.
Prepare meaningful alternatives and metadata
The W3C images tutorial explains that image alternatives depend on purpose. Describe important information for an informative image, represent the action for a functional image, and avoid unnecessary descriptions for purely decorative content. Do not turn alternative text into a list of search keywords. It should help someone understand the page without seeing the image.
Keep the original file and a record of its source. This helps with future crops, replacements, and permission questions. Use descriptive file names in your own asset library so the next person can distinguish a current product photo from an old campaign variation without opening every file.
- Subject: what should the visitor recognize or learn from this image?
- Accuracy: does it show the current product, service, location, or person?
- Permission: are you authorized to publish it in this context?
- Crop: does the subject remain clear in the actual mobile and desktop placements?
- Alternative: what useful information or function needs to be conveyed in text?
- Maintenance: what change would make the image outdated or misleading?
Review the page as a visual sequence
Once the images are placed, look at the page as a whole. Do they support the order of decisions, or does the most striking image draw attention to a secondary task? Do several unrelated styles make the business feel fragmented? Consistency does not require every photograph to look identical, but differences should not obscure the offer.
Ask a reviewer which product or service they think each card represents before showing the destination. If the image and label suggest different things, adjust one of them. Recheck images when stock, packaging, services, or branding change. A useful image system is not a one-time gallery selection; it is a small maintained set of visual explanations that remains accurate as the business evolves.
Sources & further reading
References for the principles and technical details in this guide.
Found something that needs correcting? Send us a correction.