Choosing Photos for Your Website
About this Video
Photos are so important to me as a website designer because photos can really make or break a website. When a potential client comes to me and we are talking through the details of what they are looking for in a new website, I always bring up the topic of photos and if they do not have current or new or professional photos that are ready to go, I don't let them start their website project yet. I know it might sound harsh but it's true. You need to have photos before you can start your website design. So, I'm creating this video to share with you what I say all the time on these calls so you can get a glimpse behind the scenes of what it's like to work with a website designer. I'm also going to show you behind the scenes of my own brand photo shoot and go through this gallery of photos that I got back and how I choose and narrow down my selections so you can do the same with your photos. I know it can be overwhelming when you get this big gallery of pictures back. How do you even make decisions on what to use on your website? That is what we're going to go over in this video.
I am Katherine Forbes, founder of Designing the Row, your one-stop shop for Squarespace websites. This video is part of my branding video series where I'm walking you through creating all of your brand elements because I think you need to have your brand locked in before you can design your website, so that is exactly what this is about. We've, we've gone through the messaging parts and now we're diving into the visual aspects of your brand. And obviously specifically, picking your pictures. So in this video, we're going to talk about picking your feature image and what that even is, and then how to narrow down a gallery of image images into just nine selections. If you'd like to take notes as you go through this video and the rest in the series, go to designingtherow.com/branding.
Timestamps
0:00 Intro
1:39 Get video series free resources
1:53 Feature image - what is it?
2:25 Feature image guidelines
6:19 Narrowing down a photo gallery to 9 image selections
8:15 Photo SEO bonus tip
9:46 What’s next
Okay, so first up, let's talk about what I mean when I say “feature.” A feature image is just what I call that picture that you see across the top of your website. When someone comes to your website, this is the first picture that they're going to see. A lot of times this is just a full screen horizontal image. And so it's very important. It's the first impression that you're going to make on your website. So you need to be very intentional when you're going to pick it. And with that, I have a few guidelines for you to help you decide on what this might be:
This photo should be horizontal, landscape, whatever you want to call it so that it can fit very nicely in a full width across your website.
There also needs to be what I call white space around you if you are especially a personal brand and this is a picture of you. You don't want a picture that's so cropped close up on your face because think about it this way, on desktop your picture is going be more horizontal, but mobile it might crop in more vertical, so you need some space around your face so that it can be responsive on all device sizes.
The next thing that I like to have an feature image is having you looking at the camera or making eye contact with the camera. You want to be artsy? I suppose you could be looking off into the distance or whatever. But it makes a really good first impression if you are just looking straight into the camera for this first feature image on your website.
Next up are the colors. You need to like the colors of the photo because in the next video I’ll show you how to create a color palette using this image to make your website feel very professional, very put together, and very on brand. So you need to like the colors that are in your feature photo.
Those are my guidelines! I also like to encourage people to use this as the default image on all their social media. Then, not only is it the main image on your website, but it's also the main image across all of your social media. That will give you just a very branded and consistent look across all of your online platforms.
I'm going to show you my own gallery and how I have decided on what picture is going to be my own feature image. This is like a half preview gallery of my images - there's still more coming, but if you scroll through here you can see that there is a good amount to choose from. How in the heck am I supposed to pick one from all of these to be my favorite?
Remember I said colors. Colors is how I first narrowed this down for myself. I knew at the top of my website I wanted to have a black background picture, so that kind of narrowed my options down if we do black. And then horizontal, there's these two here and then several here. Then remember I said to pick something where you're looking at the camera? I've got a few here where I'm not looking at the camera where I am looking at the camera so that narrows down the options even more. Then ultimately I ended making my choice based on which shirt I like better. And that is how I personally picked my own feature image for my own website rebrand. That hopefully helps you narrow down your pictures to one feature image. Oh yeah, and let's look at the white space. You can see, let me get a good example... the ones that are close up all seem to be in portrait mode, but you can see how all these horizontal ones, there's some blank space around me. This one right here where my head is pretty close to the top, that one might not be the best option, but as you can see all these have some really good space around me. Especially this one that I've chosen.
Now let's talk about narrowing down all of the rest of those into just nine photos. Of course you can use more photos than just nine for your website, but a lot of times people are just like, I don't even know where to start, so I'm going to help you just pick nine to start with. Then you can pick a few more here and there as you need. Let me give you my guidelines to help you pick the nine pictures:
3 landscape photos
3 portrait photos
3 detail photos (photos without you in them)
You can see that I've got my nine up at the top of the screen. I've got three landscape, three portrait, and three detail photos. What I did for this example was just pick one in each color scheme for the landscape and portrait. Then for my detail photos, I made sure to pick them kind of all in the same scheme so that my detail photos had some consistency through them.
If we go here, I don't have as many guidelines and rules for picking your nine photos. Like I said, I separated mine out by colors. For the horizontal ones, I do think it's great to kind of stick to the feature image rules so that you can use those in multiple places that are full width across your screen and then maybe for your portrait you can experiment a little bit. You can see I have like one headshot style, one with my laptop, and one with a notebook. Really, just pick your favorites! Pick three portraits, which ones would you pick? That's a great way to start narrowing down your images.
One more little bonus tip for you: if you are going to be putting these on your website, if you're choosing these for your website, I'm guessing you are, renaming the files of your photos will really help with your SEO. Instead of these saying like the photographer's initials plus some numbers plus like my last name or whatever it is when I download them, change them to be your keywords that you want to use on your website. Go back a couple of videos, watch the SEO video, figure out your keywords and incorporate those into the file names. I know it sounds very detailed, but this is actually an element that really helps. If you think about it just the same way that you Google search for a website, how do you think Google images works? The same exact way! Make sure that your images have specific file names that are somewhat related to what's actually in the picture. You don't want to just use keywords that have nothing to do with what's in the pictures. But for a lot of mine, there's some variation of my name, “Designing the Row,” “website designer,” “Nashville,” “Squarespace.” All of my file names include those keywords and that helps with SEO. Just a little bonus tip for you there. 😉
That is my quick rundown for how to choose photos for your website. Next up in this series is creating brand color palette, choosing brand fonts, and then putting all of your brand elements together into this brand guidelines template. I will give you this template for free and show you exactly how to customize it so don't worry. Again, you can find more about the series at designingtherow.com/branding. Otherwise, subscribe to the Designing the Row YouTube channel and stick around for the next one!
Subscribe to this branding video series to get all the free resources sent directly to your inbox!
Google Doc Branding Video Series Workbook • Font Pairing Menu • Canva Brand Guidelines Template
Want more website and branding advice? Here’s what’s new on the blog…
Need some 1:1 Squarespace help?
Book Katherine, a “Squarespace Authorized Trainer,” for an hour to work with you via Zoom on your Squarespace website. Learn more here or click below to schedule your session!
