How big should my background picture be when building with SitePro?

There is no best size for background image! It all depends on you and your idea how the site should look like.

According to worldwide statistics for the last quarter of 2016, the most used screen resolution is 1366 x 768 px, followed by 1920 x 1080 px.

However, if you want to have full background image we recommend picture with dimensions 1980 x 1280 px (width x height). This will ensure you have full size background image on your site. It's not a problem if your picture is higher, just make sure it's width is correct. Here is a visualization of website visible part on the most used desktop screen:

Marked areas on both sides might or might not be visible for most of your visitors, that’s why they shouldn’t be full with content. If you know that most of your visitors are browsing on larger screens we suggest you to activate “WIDE” visualization from responsive options.

How to find image dimensions on iOS (mac)?

Method 1
  1. Open Finder and find the location of your image file.
  2. Right-click on the image and select "Get info".
  3. Scroll to section "More info" where you can see file dimensions.
Method 2
  1. Create a new folder with your images.
  2. Change the name of the folder to “Pictures” (case is important!)
  3. Go to menu "View" and select "as List" option.
  4. Right click on the list's titlebar to enable the "Dimensions" column.
  5. Once activated you can rename back your folder to whatever name you prefer. The Dimension column will remain there.

The list of extra columns is relative to the folder's name/location. In order to get the dimensions available, the folder in question should be renamed to "Pictures" or has to reside somewhere under ~/Pictures/.

How to find image dimensions on Windows?

Method 1
  1. Open the folder where you picture is located.
  2. Right-click on image and select "Properties".
  3. Scroll to section "Image" where you can see file dimensions.
Method 2
  1. Put your image files in a folder.
  2. Go to menu “View” and select "Choose details".
  3. Click to enable the check box of "Dimensions" and click on OK.
  4. Show the pictures in detailed list.

This article is not yet rated.

Login to give us feedback


Processing...