Using photography the right way

Photography is pretty sweet. It can arguably be used to represent emotion, capture a moment or frame a landscape better than any poem, ballad or Bieber title. No I’m not a photographer but I do understand the value of a great photo and its implications in a web design.

A little tidbit of photography history, 101 – The first ever digital camera was created way back in 1975 by a Kodak engineer named Steve Sasson. It looked like a cousin to R2D2.

Interest and Technology Exploded!

Digital photography and increased interest in the Internet both took off at around the same time. Since then, they have continued to evolve to the point that a modern day web designer now has just as much flexibility and control over digital photographs, as a graphic designer does.

No kidding, right? It’s hard to think of an internet where large images couldn’t be downloaded easily, but the reality is that this shift in computer technology, web languages (CSS3/HTML5/Javascript) and internet speed has all been relatively recent.

The Trend of Giants

Due to all this, we’re currently seeing a trend of using massive images in web design, both as full screen background images and super-sized slideshows. Before you jump on the bandwagon or grab any old image, let’s first work out if a photography based website is effective for you, and whether you have the skills to pull it off.

Why use a massive image?

It’s general knowledge that mankind is impatient. Our first impression of anything is quick and definitive. When it comes to designing a webpage you have only a couple seconds to attract the attention of whoever was lucky enough to land on your site.

A great photo speaks 1000 words, impacts hard and fast and if relevant to a product, can help push sales. These are all great things and are awesome at first impressions.

Too good to be true?

There are risks to designing a website around large photography:

  • File size could seriously impact your users if you’re not optimising properly.
  • Can become a distraction to your primary content.
  • A wrong image choice could spell disaster for your design.

Choosing the right photo

Your users are around photos every day. They can tell if a photo is distorted, pixelated or out of proportion. Choosing an image with a high enough resolution is obvious, but you should also ensure the image is related to your content.

Don’t have a massive background of a pony because you love ponies. Use a massive image of a pony if you run a stable (and strap a horn on and ride that unicorn).

Be inspired by the beautiful

I’ve showcased a few examples that I think demonstrate good use of photography on a website. As you can see a different photo and colour scheme will impact the mood of any website.

Two Arms

Two Arms is a New York based Illustration/Design team that utilises a large, professional photo of their latest project. Positioned above the fold and with no-frills, this effective slideshow is a great example.

Two Arms - using photography the right way
Two Arms – using photography the right way

 

Minerva Streetwear

Minerva Streetwear uses huge photography and the popular parallax effect with great results. The large imagery have been optimised well to reduce downloads. Very nice and a great overall branding example.

Minerva - using photography the right way
Minerva – using photography the right way

Kentisbury Grange

Kentisbury uses dynamic angles and large images to bring about a great atmosphere on their website. Bright floral images showcase the best of British heritage.

Kentisbury Grange - using photography the right way
Kentisbury Grange – using photography the right way

Noe Interactive

Noe Interactive is a French based design group who use a very crisp full-width slideshow to showcase their recent and impressive apps.

Noe Interactive - using photography the right way
Noe Interactive – using photography the right way

Buffalo Systems

Buffalo uses a full window slideshow that shows off their products in the wild. The reason Buffalo’s website works well is that the photos are relevant to the brand (i.e. outdoor gear) and the photography is top-notch. Very impressive.

Buffalo Systems - using photography the right way
Buffalo Systems – using photography the right way

 

Experiment with photography, but keep in mind your target audience and their internet connection. Optimise well and stay focused on what you’re portraying to users. Do this and you can’t go wrong. Know any impressive photo-focussed designs? Get in touch with Media Heroes and let us know!