Photography adds something to a website that even the most sophisticated of vector design and illustration can’t replicate. A photo can add depth and interest, a sense of humanity, and interaction with other elements in ways that are endlessly changeable and interesting. There are a lot of ways that your images can be used, but for maximum effect, try out a few techniques that will take your photos to the next level.
Photography as the Background
One of the best ways to grab attention is to feature a gorgeous shot as the entire background of your page. Type layered over a good photo often interacts with the image in an interesting way, like on The Paper Mill‘s site.
There are also a lot of sites that overlap shapes or textures or both, for example, on Archikon‘s site.
Sometimes a background photo works better when blurred out and de-saturated. This is an especially useful technique when the type over it isn’t particularly bold, because it makes it much more readable. Givers Band‘s website took emphasis off the background photo and allowed the delicate title type to take center stage. This can be an especially effective technique for giving a unique spin to stock photography, or well-known images.
Photography in the Navigation
Another interesting way to use photos is integrating them into the navigation of your website. Many portfolio sites use photos of each project to navigate to each from the home page. This portfolio switches from black and white to color on rollover, which is a good idea to consider if the photos need to look more unified or simple.
Other sites have integrated a photo into the main navigational element itself; this one makes it look like a vintage amplifier.
Photography With Dimensionality
A tricky treatment that can nevertheless yield great results is making a photo look especially dimensional. Often this means the background is viewed as though it were a solid surface, and the photos on top of it are made to look more convincing with drop shadows. The bike parts in this design look like they’ve actually been laid on top of the grey background.
Another way to go about it is to employ a sense of perspective; that’s what gives this website its distinctive look.
Transitions Between Images
Transitions between photos are another thing to be considered. This photography portfolio slides the photos vertically into place.
This site, on the other hand, chooses to fade them in and out. In the first, the user can choose to go through the images manually, but in the second, the photos cannot be manipulated. The difference in these transitions make sense, because the primary focus of the portfolio site is to show off its photos, whereas the other site uses them as an evocative background to enhance the real information.
There are endless ways that these techniques can be combined and altered to create fresh new effects. Look to photography for an effortless upgrade in your web design, and discover what a difference it can make.
Nobody's made a comment yet. Why don't you be the first?