advanced photoshop

Tutorial preview: Unique web layouts

Posted in:
Magazine previews, by Julie Bassett

How to make simple but effective web layouts in Photoshop

We share techniques and styles to maximise the impact of a one-page site, linking to your online portfolio

Tutorial preview: Unique web layouts

The one-page website is certainly hot right now. In a time where social media sites are peaking and web design costs are not always catering to those digital artists starting out, these creative landing pages are a godsend. The one-page website ensures that visitors aren’t trawling through page after page, or waiting on Flash-based loading, knowing everything they need to in one friendly sound bite.

Photoshop of course does its upmost to complement web design, and in this tutorial we’ll show you the essential tools and palettes to produce cool results. Layout hierarchy is created with the Ruler and Guide options. Determining the layout of your space is the first hurdle. You, as the designer, have the power to direct the visitor’s eyes where you want them to go. People naturally notice big things first and small things last, so your use of font style and size is also fundamental; here is where you can marry the Type tool with layer mask options and Brush tools to create visual impact. Colour swatches let you apply unifying tones, and all other effects applied are geared to show off your space and really grab everyone’s attention.

Read more in Advanced Photoshop issue 91, on sale now