Forum Discussion
Hero Web Part Dimensions
Has Microsoft given any guidance on best practices for images used in the hero web part (i.e. dimensions or ratios)? I recognize that there are different versions of the hero web part and that the web part will adapt to the screen width, but I was still hoping for at least some basic best practices? Specifically 16:9 vs 4:3 and minimum length resolution.
Great question, I noticed we have it on UserVoice as well.
Tiles layout
- Web part is set to fit screen width (full-bleed), and height scaled accordingly to follow 8:3 ratio
- Images inside scales accordingly to follow the 4:3 ratio
Layers layout
- Individually layer scales to 8:3 ratio
- Image scales close to 9:16 ratio
4 Replies
- John_Sanders
Microsoft
Great question, I noticed we have it on UserVoice as well.
Tiles layout
- Web part is set to fit screen width (full-bleed), and height scaled accordingly to follow 8:3 ratio
- Images inside scales accordingly to follow the 4:3 ratio
Layers layout
- Individually layer scales to 8:3 ratio
- Image scales close to 9:16 ratio
Any guidance for image resolution (i.e. minimum recommended length or recommended length resolution)?
- John_Sanders
I would recommend using the highest (reasonable) resolution you have. We optimize the image shown to the user based on the size of the viewport (e.g. the device) they're viewing your page from.
