RRH websites require specific image dimensions to ensure high-quality visuals, maintain design consistency, and optimize performance across hero banners, product images, blog thumbnails, and other key areas.
Hero Image
- Desktop
- 1920px x 960px
- .webp file format
- Under 200kb is ideal
- Mobile
- 960px960px width
- Under 200kb is ideal
Pop-Up Image
- 960X960px
Image Ad Banner (Menu Pages, homepage)
- Desktop: 1920x640 or any 3:1 image ratio
- Mobile: 960X960px
Video Hero
- .mp4 format
- Under 2mg is ideal
- No sound
- Cloud convert
- 1280x720
- 28 (low quality)
- Placeholder Image
- 1920px x 960px
- .webp file format
- Under 200kb is ideal
Store Locator Image
- 160X160px
Categories
- 1200px x 600px (2:1 ratio)
- .webp file Format
- Under 200kb is ideal
Joint
- 512px x 512px
- .jpg or .png file Format
- Under 200kb is required
OpenGraph
- 1200px x 630px
- .jpg or .png file format
- Under 200kb is ideal
Favicon
- 512 x 512px
- .webp file format
- Under 50kb ideal
Site Logo
- 700px width whatever height
- .webp format
- Under 100kb is ideal
Icons
- 512 x 512px
- .svg file format
- Black Color must be #000000 (This allows us to edit the colors in elementor)
SVG Exporting Notes
- Export as svg
- Layer name
- Open svg in dreamweaver
- Find and replace class names (cls-1, cls-2) within the style tag and make them unique. Right click and “replace in current document”
- “searchads-1” “searchads-2”
Assorted images / logos
- Minimum 768px wide
- .webp or .svg
- Under 100kb is ideal