• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Chapter 10. Multiple Items > Layout tips for Web and print

Layout tips for Web and print

Just as a composer creates a musical score or an artist paints a picture, all the elements on your page have to be arranged so the message is understood clearly by your audience. If the writing is poor, your copywriter has more work to do, but your readers will become weary of even the best writing if the layout and typography are poor. Your audience doesn't have to be spellbound, but you do want to capture their attention long enough to get the message across. Here are a few suggestions:

  • Let in some air. Leave a little white space around your text and pictures. How you do this depends on your subject matter. Use Text Inset values to add some air between a picture and its frame. Use ample gutters between columns (add delicate vertical rules for definition). Or gather elements up at the top of the page and leave the bottom of the page blank. Peaceful passages provide an important counter-point to louder passages, and confident composers know how to play them off each other to their advantage.

  • Use a grid as an underlying structure to organize elements. Whether the grid is obvious to your readers or not, it still makes for a more pleasing and orderly page, and it makes it easier to make decisions right off the bat as you layout and edit your page. In fact, many designers still use pencil and paper to sketch out broad design ideas before they create a layout on the computer.

  • Break out of the grid in select areas to add some punch. As an example, you could put thin rules around most of your pictures, then use a different type of picture with an irregular edge to add a more interesting, non-rectangular shape to the page.

  • Just as composers juxtapose opposing forces to create what we call “good tension”—slow versus fast, complex versus simple, loud versus soft, percussive versus melodic, and so on—there are many ways to create good tension in a layout. For example, instead of plopping two medium-sized pictures smack in the middle of the page, put one large picture off to the side (let it bleed off) and a small picture in the opposing corner. Don't automatically stick everything in the center.

    Elements that can be used to create pleasing tension include scale (large vs. small), shape (regular vs. irregular), placement (diagonal, vertical, and horizontal), color (raucus vs. subtle), and shade (light vs. dark).

  • When you arrange multiples of a similar object (e.g., pictures and their accompanying captions), the result doesn't have to be static. Use repetition to your advantage to create texture or rhythm. But do align the objects carefully—misalignments are distracting (use Super Step and Repeat to make copies of an object or group or use Space/Align to align existing objects). Keep in mind the overall shape multiple items will form when they're grouped together (e.g., the whole navigation bar, if you're designing a Web page). A good formation will have solidity and order. To see how the whole page looks, choose a small view size and turn guides off (it's the equivalent of squinting).

  • And last but not least, don't forget to set type like a professional (Chapter 7 is chock full of tips for setting professional-looking type). The details matter as much as the broad strokes.



Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint