Eventually you will convert your basic layout ideas into a formalized permanent structure.

A grid (or template) can be as simple or as complex as you wish. The basic skeleton for print usually consists of a double-page spread, showing bleed and trim sizes, page margins and text columns, but any amount of additional information can be included - it is normally defined on a master page so recurring graphic elements, for example, or hanglines or folios (page numbers) can also be included.

The basic skeleton for a web page is more complicated as the possible size will vary dependent on the viewers monitor size and resolution. However the same decisions have to be made - column widths, margins etc. For regular HTML pages frames, tables or layers are used to create placeholders for text and images. If your are using Flash the design process will more like print-based DTP but with animation and multi-media elements as well.

Grid setup

The setting-up of a screen-based grid will vary according to the software used. For print-based DTP the master page, appears as a fixed background to the publication pages. The screen-based grid (rulers and guides) will, of course, never appear on the typeset page. The text will flow down the columns and run around inset graphics or pictures; the headings will hang or sit on the relevant grid line; and boxes can be drawn in position to provide keylines for pictures. Some Web design software follows the print paradigm; a template image appears on a layer under the working area so the web page can be assembled on top of it.

Using the Grid

Having designed the grid, you should test it to see that you have included all the information you will need to create additional spreads or web pages. It is, however, possible to clutter up the grid with too much information, making it confusing. A grid with more columns-six, for example-is more flexible than one with fewer. For printed work a bleed is required. The purpose of the bleed (which will be trimmed off) is to ensure that pictures that extend to the edge of the page are not left with a thin strip of white paper if the page is trimmed a little oversize. The distance between the trim and the bleed will normally be 3-5mm.

The Grid and Printing

The size of the margins is important too, particularly the gutter. A 100-page, perfect-bound (square-backed) publication will not open out as flatly as a 16-page, wire-stitched one and so will require a wider gutter margin. Bleed pictures will also be trimmed at the gutter because the 100 pages will be cut into a stack of single sheets and glued together at the spine. It is this glue, which is squeezed a small distance onto each page, that stops the publication from opening flat. (Normally, this bleed into the gutter is ignored on the grid, but it needs to be taken into account when you are scaling up pictures, or they will be 3-5mm undersized.)

Always remember that the grid is just a tool to help you. Adhering to it slavishly can result in boring, repetitive layouts; ignoring it, on the other hand, can produce disjointed, uneven ones.

© 2001-2002 Graham Davis, E-Design
All rights reserved, text, graphics and HTML code are protected by international copyright law and may not be copied, reprinted or distributed by any means