The value of taking the time to edit photos so they match the tone of the site is sometimes underestimated. If photos come from different sources or cameras, or have been taken at different times of day, slight adjustments to brightness, contrast and cropping can go a long way in making them gel together. Using a photo editor (opens in new tab) or exploring some CSS3 effects can be a great way to spruce images up.
- 28 outstanding examples of CSS (opens in new tab)
Grid systems can be used to help place images within a system and also break the columns as needed – and honestly, the web could use a bit more of that grid-breaking. Photos don’t have to always be full-width, with parent elements and child elements. And it’s not just photos that can break the grid: buttons, text and masks (although check CanIUse first) can all help you shift away from overused patterns.
Here are three sites that get their photography just right.
01. Double Eight (opens in new tab)
Italian clothing brand Double Eight doesn’t overuse grid structures and lets the type overlay the images. The images themselves are consistent in their contrast and composition.
02. StartupLab (opens in new tab)
StartupLab uses experimental CSS to mask imagery over large, thick sans-serif lettering.
03. Gabriel Ribes (opens in new tab)
- The 33 best photo apps (opens in new tab)
- 6 big visual trends for 2017 (opens in new tab)
- How to get fantastic results from Google PhotoScan (opens in new tab)