You don’t have to be a professional designer or photographer to know when a particular photo doesn’t look good on a website. Sometimes you just know. With more and more small businesses opting to manage their own websites, it often becomes the case that a site owner, who may have keen sales expertise, has no clue what qualities make a great photo for his or her website. Add to that the proliferation of higher-quality mobile phone cameras, and social media photo sharing sites like Instagram, more and more people think every photo is worthy of sharing with the world. This is not to say that we don’t love Instagram — we do! But if you view all photos through the square-photo Instagram aesthetic and try to apply that to your custom real estate brokerage website,
Using TRIBUS’ most popular website theme, Ashland, as our model, we’ll show you how certain photos are better to use than others, and why.
Filling the Space
Initially, it’s helpful to keep in mind the space you want to fill. Or more importantly, the shape of the space you want to fill. We could get really technical and introduce terms like resolution and aspect ratio, but to keep things super simple, when you add a photo to your site, you’re usually trying to fill a space.
Learn About Our New Ads and Leads Program - TRIBUS Engage
For the purposes of this post, we’ll stick mainly to the homepage real estate website background image, a.k.a., the “hero.” It’s almost always the first impression of you that visitors will get when they encounter your site, so you want the photo to draw them in.
Does the above photo draw you in? Full disclosure, we cropped it poorly on purpose. (This house might have a garage, but who knows!)
The vast majority of computer monitors aren’t square. Most are wider than they are tall. Consequently, most hero image spaces are rectangular. Now, you can use a square photo here. You can use any photo size or shape you want. Who are we to judge? In fact, your site’s theme will fill the given space with your photo, regardless, so you could, in theory, go nuts! However, and for better or worse, there is no pop-up warning to alert you that the photo you’re attempting to upload is going to look bad. As with many aspects of your website, sometimes it’s just trial and error. But take our advice: don’t put a square photo where a rectangular photo should be.
Learn About Our New Ads and Leads Program - TRIBUS Engage
For a real-world example of how this photo looks on an Ashland site, here you go:
Not so great, is it? Notice the square image had to be zoomed in quite a bit to fill up the space. Now, not only is the garage gone, but so is the front yard!
A more obvious example of a poor choice for a hero image is any photo that’s not in landscape orientation.
Take a look at how this vertical photo of a living area looks in the hero image space. Need we say more?
Learn About Our New Ads and Leads Program - TRIBUS Engage
In fact, the Ashland theme provides a helpful size guideline info tip for users. 1800 x 624 pixels work best for a real estate website background image, where the first number is width, and the second is height.
The raw photo below isn’t cropped exactly to hero specifications, but you can see right away that it would make a fine hero image.
A good real estate website background image is one where the subject of the photo doesn’t take up too much of the frame. If your photo’s subject is much bigger than one-third of the frame, you’ll probably have trouble making it fit into your hero’s space. As you can see here, there’s plenty of room around the house (above), so the photo can be cropped to hero dimensions and still fit the entire structure into the space (below).
This is not to say that you can never use photos on your site that don’t adhere strictly to hero-image specs. Other parts of our Ashland theme do in fact highlight more traditional photo dimensions, like the Featured Images on this blog archive page.
And on your site’s pages and blog posts, you’re in complete control of any photos you choose. Feel free to use a variety of landscape shots, portrait, square aspect ratios, and everything in between.
If you’re not sure what photo dimensions will work best for the different parts of your site, TRIBUS can provide you with a handy cheat sheet that spells out the dimensions of every photo “container” on your site. Just ask!
Our next post will focus more on finding photos for your site. Of course, this assumes that you don’t have a photographer on staff! :)
