Choose hero images for Website Pages.
Select a permitted image that supports the Page offer, keeps its subject in the crop, and remains readable on mobile.
Build around this situation.
Use your own accurate details and check the result as you go. You can return to the relevant Website editor to make corrections.
Choose the Page job
Select an image that clarifies the offer or subject visitors are deciding about.
Check the crop
Preview the same source at desktop and mobile widths and keep the important subject visible.
Review text and save
Confirm Alt text, Caption, and Page status before publishing the Page.
Illustrative exampleWhat a useful result looks like
- The result
- A hero image that supports the heading and remains legible on small screens.
- What to check
- Check the subject, crop and any overlaid text at each preview width.
Adapt the example to your Website and review the result before moving to the next task.
Let the image carry information
A project detail, person, or place can help visitors understand the Page when the crop and surrounding copy agree.
Do not hide the offer in the image
The heading and body should remain understandable when the image is cropped, delayed, or unavailable.
Before you continue
A hero image supports a Page; it does not prove the offer, replace accessible copy, or publish the Page by itself.