Skip to Main Content
Front end developer coding at desk
Front end developer coding at desk

Perfect website photos

The images on your website have a huge effect on the overall look and feel, but it can be really difficult to know what makes a photo right for your website, or how to source the images that are going to create the right impact on your audience.

Photographer choosing photos

Here's what we're talking about in this article.

Hopefully this guide will give you the confidence to pick the perfect photos for your website, so it makes an incredible visual impact right from the first click.  

 

What is a good picture?

Lots of people ask us what pictures they need to provide, and of course that's a complex question to answer!

Later in this guide we'll go into a bit more detail about how to find or take the right picture, but to get started, we'll talk about the technical requirements we need from you.

Orientation

It's something that gets overlooked an awful lot, but it's always best to provide landscape pictures - not portrait.

This is because a lot of the images that get used on websites are actually more of a letterbox style so they fill the width of a screen without descending too far down the page.

That shape is fairly easy to generate from a landscape photo, but if all you've got to work with is portrait, you're left with a tiny fraction of space to work with.

Have a look at these examples to see what I mean.

Example of usable space in website image  

See how the actual usable space from the landscape image is much larger than on the portrait photo?

So, if you're providing your design agency with pictures, try and make sure that as many are possible are landscape. Portrait photos may be usable in some circumstances, but whereas it's easy to make a landscape image into a portrait, it's a lot harder to go the other way.

Focus

This is quite similar to the orientation issue, but if you're replacing an image on your website (particularly in a heading), really think about where the focal point needs to be.

Lots of sites have large headings with text over them. If you're providing an image for one of these areas, make sure that the main focus of the image is not going to be hidden under the text. 

Example of headers with main focus

See how one image works perfectly with the balance of text, and the other is a bit of a jumble, making the image difficult to see and the text hard to read.

If your heading has text on the left, make sure the focal point of the image is on the right - and remember that your designer can't just add more space onto the left side of that picture, it needs to be in the image to start with.

Size

In the world of web images - bigger is better! Your design agency will be able to reduce the file size as needed for use on different devices, so the larger the file size the better.

Again, it's easy to make a large file smaller, but it's impossible to make a smaller file bigger, so provide the best quality images you can, and let your agency handle the compression.

Style

Now, this really is a big deal, and we'll be going into more depth later in the guide, but the basics of getting the photography style right is by listening to your design agency.

One of the best ways to make sure you're going for the right style, is to wait to do photography until you've already got a design concept.

Your designers will most likely use stock photos as placeholders, and you can use these as a guide to the sort of picture you should be getting to fill each space on the site.

If you want to provide photos before the designers get started, remember that the style of your images will impact what they can do.

If your site targets a very serious audience and you decide to go for a wacky style of photography, that's likely to put your designers in a very difficult position.

To take a deeper look at this issue - read on!

 

Sourcing photos

When you're gathering images for your website, it's really important to have a plan in place so that you know what images are needed.

Take direction from your designer

If you're putting together a bank of photos before your agency starts work on your design, just give them everything you've got, but if you're trying to source photos specifically for your website design, it's essential that you speak to your designer first.

It can be really counterproductive to pick an image style simply because you like it, whereas your designers will guide you to a style that's going to speak to your audience, and will complement the rest of the design.

Your design agency will be able to give you guidelines on the sort of photos they need, giving you a list of types of image, what and who should be in them, and the style to go for.

If you've already got a design concept, and you just need to replace stock images with your own, use the placeholders as a guide and try to create similar pictures. They don't need to be identical, but make sure you're replacing like for like - don't provide a picture of your warehouse to replace a picture of your team in a meeting.

Get a professional

The easiest way to get the right photos, is to hire a professional. Paying for a photographer for a few hours or days can quickly pay for itself, and should give you a bank of photos that you can use not only on your website, but in brochures, advertising and on social media.

You can even put your photographer directly in touch with your web design agency so they can discuss the types of shots needed, and make sure you get the most out of your shoot.

Lots of people try to take their own pictures with a phone or camera, and while you can get some decent images, there's really no comparison with what a good photographer can do. 

A professional is going to be able to manage things like lighting and composition. They will know how to get natural looking photos of your staff without them becoming cheesy or feel staged. 

They'll know from experience how to create the right type of image, and will be able to take a good range of photos that give your designers a good bank of suitable images to choose from.

Of course, the downside is that a photographer costs money. But it's highly recommended that you factor this cost into your website design and build costs, as a picture really is worth a thousand words.

Using stock photography

There may be some situations where you've really not got any option but to use stock photography.

In these cases, it's usually best to give your design agency free rein to choose what they think works best, but if you decide to source stock photography yourself, make sure you're choosing the right sorts of images.

The biggest consideration with stock photography is licensing.

A lot of people think that if you find an image on Google, you can use it for free. 

This is NOT the case!

It's essential that you obey licensing and copyright restrictions for any images you do use. 

A design agency won't know whether the pictures you send them are licensed or not, so if you supply them with an image, they will take it in good faith that you have secured the rights to use it. So don't depend on them to police your image choices*.

One of the best ways to navigate using stock photos, is not to try and find the exact ones you want to use, but to create a pinterest or mood board of the images you like and share it. Your designer can then source similar stock images, and you'll be safe in the knowledge that they are definitely licensed for you to use.

*We once heard from a client who has been sent a very stern letter from Getty Images, with the instruction to take the photo they had used down or pay a VERY hefty licensing fee. They let us pick their images after that!

Team photos

Some of the most difficult pictures to get are your team photos. There are a number of really common pitfalls with these, including letting people supply their own, or not factoring in that you'll need more when new employees join.

Uncomfortable subjects

A really common issue with taking team photos, is that one or two people will be adamant that they hate photos and don't want to be part of it.

That's fair enough if you're happy that they don't actually need to be on the website, but if they're an essential person, getting that profile photo is really important. 

Don't let them chicken out and allow them to provide their own photo (we'll talk about that in a second!), or let them break the style you've established because they don't like their picture being taken. 

Using your own photos

Never, ever let your employees provide their own photos for your website. You will end up with a completely random assortment of styles, mostly taken with phones, with people in the background, poor quality or just really unprofessional*. 

You should always take team photos specifically for the site, and make sure they are a standard style and composition. That way your team page will look professional, and everyone's profile is consistent.

*We actually received a photo from a client once which was clearly taken in the pub. Nice picture, but it's just not right for a company site.

Complex styles

Some people like to get really creative with team photos, and have a really stylistic photo shoot. This can be fantastic and really make you stand out - but remember, any time you get a new employee who needs to go on the site, you'll need to create a similar picture.

For some companies, where there's not a big turnover of staff, that's not going to be a problem, but if you regularly have new profiles, you might want to reconsider a style with lots of props or complicated themes, because you need to be able to recreate it every time you employ someone new.

Fixing the problem

One of the best ways to avoid the problems above, is to hire a photographer to manage the team photos for you. They'll be experienced in coaxing a natural shot out of the most uncomfortable subject, and establish a style for your profile images that's fairly easy to recreate, as well as fitting the culture of your company and style of your site.  

Storing and organising your photos

Once you've sorted out your photography, the next phase is to get them over to your design agency.

It's always best to get imagery to your designers as soon as you can, so they can look through and let you know if there are any gaps, or if they need a bit of additional guidance from you about what goes where.

It's also really helpful when you organise your images before sending them over. Make sure you arrange files into folders so that your Team, Product and About photos are all separated and easy to find.

Making sure your image files are named appropriately can also be a massive help - particularly with profile and product images. So instead of IMG1234567890, try naming the file johnsmith or by the product name or number.

If you've had a photographer, they can liaise directly with the design team to provide the image files. Providing those pictures in an unedited format is always best, as the design team may want to add their own filters to go with the design.

When you get to actually sending images, some of the best strategies are to use file sharing services like Dropbox, or using dedicated transfer services like WeTransfer.

If you want to send something on a USB or flash drive, make sure you have a backup before popping it in the post - just in case it gets lost - and remember to mark the drive clearly so your agency knows what they've been sent and can easily identify it in the office.

 

Picture Perfect

This guide should help you navigate some of the more problematic issues of getting the right photos for your website.

But the general rule if you're unsure is always ask your designer! They know what they need for your website, and they'll be more than happy to guide you through this.

Website imagery really sets the tone for the whole design, so your agency will be just as keen to make sure you've got fantastic pictures as you are.

If you're ready to start a project and want an agency who'll give you help and guidance choosing your images, get in touch with us - we'd love to hear from you!

sam.jpg

Sam Orchard

Creative Director