What size should I use for background images?

SnapPages works differently than other website builders or graphic editors you’ve typically used in the past because it’s built from the ground up to be responsive to any screen size. This basically means that it will automatically resize your content and change layouts so that it looks great no matter what device you view it on!

This sounds like a simple concept but there is really a lot of complicated things going on behind the scenes to make this happen. One area this can cause some confusion is when it comes to the question of what image size you should use for background images.

In other fixed-width graphic design programs, you would be looking for a standard image size like 2000x500 pixels, or something like that. However, with responsive design, your background image might be cropped differently in each different device size so you really have to pick your images a bit differently to ensure they look great in each situation.

Below are some tips to help you pick good background images for your responsive website:

Tips For Picking Responsive Background Images

What size should I use? - We recommend using images that are at least 2000 pixels wide anywhere from 500-1500 pixels high. This will keep your image from looking blurry on larger desktop screens without being so big they negatively impact load times.

What style images look best? - Try to avoid vertical images as they won’t look as good in wider settings. Try to select images that don’t need to be centered a certain way or don’t look good cropped at different sizes. Abstract or scenic images typically work great!

What about images with text? - We highly recommend avoiding images with text on them as they can sometimes be cropped when viewed on a mobile device. Instead, use the built-in Text and Heading blocks on SnapPages to layer the text directly because that will resize with the screen size.

Did this answer your question?