Forum Discussion

Steven Tolboe's avatar
Steven Tolboe
Iron Contributor
Nov 27, 2017
Solved

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 we...
Responsive
SharePoint Online
  • John_Sanders's avatar
    John_Sanders
    Nov 28, 2017

    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 ​
Steven Tolboe's avatar
Steven Tolboe
Iron Contributor
Nov 28, 2017

Any guidance for image resolution (i.e. minimum recommended length or recommended length resolution)?

John_Sanders's avatar
John_Sanders
Icon for Microsoft rankMicrosoft
Mar 19, 2018

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.

Resources