How to Choose Great Images
Choosing great images for your website can be tricky business. Here are some things to consider when you're selecting and editing images for use on your website.
Consider context
Where will the image be shown?
Ask yourself what page(s) this image will be used on and for specifically what purpose. The more you can do to understand the role the image will play to your audience, the better. For example, if your goal on a page is to get students excited about an opportunity, you might consider a photo of students who are excited about the opportunity (OK, is that too obvious?).
Does your CMS automatically crop the image a certain way?
If you are using a Content Management System (CMS) like WordPress or Drupal, it is very likely that the page you are going to put your image on will automatically crop and scale the image for you. Check with your webmaster or website documentation to better understand if this is happening (or just test it out by making a test page and uploading an image to it). You can also look at an existing page and use Firebug or Web Developer Tools to inspect the image and see what size it is on the page. In knowing the final dimensions or whether your CMS crops the image a certain way, you can better prepare your image (by making it the correct ratio or dimensions ahead of time in Photoshop). This most often impacts image choice if you know that you need a portrait vs. a landscape ratio photo.
Is the image going to be used on one page, or used across multiple pages?
Often in content management systems, your content will get reused across your website in multiple ways. For example, a news story might show up on the homepage with a thumbnail of the image, and also show up as a featured news item in the news section with a larger version of the image. Consider all these contexts as you are choosing your image, and make sure that the image you choose can work well in all contexts.
Provide interest
Is it focused on the right thing?
An image with fuzzy focus or focus set on the wrong subject can make your website look unprofessional. Make sure to look carefully at your images and choose one where the focus is clear and on the correct subject. When choosing images of people (profile photos), the most important thing to have focus on is the eyes. We as humans are very attentive to eyes, as they are a big part of non-verbal communication. Having clarity of focus on the eyes in a profile photo will make sure your photo looks professional.
Is it too zoomed in or out?
The level of zoom, and careful consideration of what the subject of the photo actually is, is important. For example, you could have a zoomed-out photo of a crowd at an event, which you may think gives off a fun energetic vibe, but in reality, crowd photos tend to fall flat on the web without a specific point of interest. You might do better cropping in to capture real emotions on people's faces in the crowd or choose a photo with a clear subject (a single or a couple of people is a good bet). Zooming in on the details and cropping out unnecessary detail is a great way to turn a mediocre image into a great one. Below is an example of OK and better cropping of the same image:
Is there enough contrast?
When selecting a good image, make sure that the subject of the image has enough contrast with the surroundings. You want your subject to be set apart from the background via contrast (either through levels or color). In the example below, we see not-so-good contrast between the student, the hammock, and the surroundings on the left, and a better example where the student stands out from the background because of the color and luminosity contrast.
