Notes about Layout
Notes of: AMBROSE, Gavin; HARRIS, Paul. Layout. AVA Publishing SA: Switzerland, 2011
Layout concerns the placement of text and image elements within a design. How these elements are positioned, both in relation to one another and within the overall design scheme, will affect how the content is viewed and received by the readers, as well as their emotional reaction towards it. Layout can help or hinder the receipt of the information presented in a work. Similarly creative layouts can add value and embellishment to a piece, whereas understated layout can allow the content to shine through.
Layout is the arrangement of the elements of a design in relation to the space that they occupy and in accordance with an overall aesthetic scheme. This could also be called the management of form and space. The primary objective of layout is to present those visual and textual elements that are to be communicated in a manner that enables the reader to receive them with the minimum of effort. With good layout a reader can be navigated through quite complex information, in both print and electronic media.
Imposition
Imposition describes the arrangement (sequence and position) of pages as they will appear when printed, before being cut, folded and trimmed.
The golden section
Before we can create a grid we need a page to place it on. In the field of graphic arts, the golden section forms the basis for paper sizes and its principles can be used as a means of achieving balanced designs. The golden section was thought by the ancients to represent infallibly beautiful proportions. Dividing a line by the approximate ratio of 8:13 means that the relationship between the smaller part of the line and the greater is the same as that of the greater part to the whole.
Fibonacci series
Fibonacci number sequences are a series of numbers in which each number is the sum of the two preceding numbers. Fibonacci numbers are important because of their link to the 8:13 ratio: the golden section. These numbers are also used as measurements for font sizes, text block placements and so on because of their harmonious proportions.
The Grid
The grid is a means of positioning and containing the elements of a design in order to facilitate and ease decision making. Using a grid results in a more considered approach and allows greater accuracy in the placement of page elements, either in terms of physical measurements or proportional space.
The symmetrical grid
In the symmetrical grid the verso page will be a true mirror image of the recto page. This gives two equal inner and outer margins. To accommodate marginalia the outer margins are proportionally larger.
Asymmetrical grids
An asymmetrical grid provides a spread in which both pages use the same layout. They may have one column that is narrower than the other columns in order to introduce a bias towards one side of the page (usually the left). This provides an opportunity for the creative treatment of certain elements whilst retaining overall design consistency. The smaller column may be used for captions, notes, icons or other elements, as the example opposite shows. In this way it can be treated as a wide space for outsized marginalia.
Elements on a Page
Text and images make up the key components of a layout and they must be presented to the reader in a way so as to communicate effectively. A design’s ability to communicate is influenced by a number of factors: the position of the text and images in relation to other elements, for example, or what the focal point of the page is, type alignment and how white space is treated.
Columns and gutters
Columns and gutters are some of the most basic elements used for placing text and image in a layout.
Images
Images are the graphic elements that can bring a design to life. Whether as the main focus of a page or as a subsidiary element, images play an essential role in communicating a message and are thus a vital factor in establishing the visual identity of a piece of work.
Alignment
Alignment refers to the position of type within a text block, in both the vertical and horizontal planes.
Hyphenation and justification
The aim of breaking words (hyphenation) is to produce text blocks that look clean and have no unsightly gaps or rivers. This is why it is important for a designer to control hyphenation.
Hierarchy
The text hierarchy is a logical, organized and visual guide for the headings that accompany body text. It denotes varying levels of importance through point size and/or style.
Arrangement
The different elements that will comprise a design, predominantly the type and images, could be treated as separate components that are to be arranged on the page with clear distinctions between them.
Entry points
An ‘entry point’ is a visual aid indicating where to begin reading. Newspapers, for example, contain textual content separated into discrete chunks – without this separation, the content would be too dense and too difficult to navigate or read.
Pace
All written copy naturally has pace. Some passages are quick to read, while others require more contemplation.
Controlling pace
In order to control pace, certain graphic devices can be used. The addition of a strong graphic statement, or the appearance of colour blocks can act as visual fullstops – encouraging the reader to pause. Ironically though, large text tends to be scanned rather than read. That is to say that the reader won’t necessarily read every word, but they will get an overall impression of the content.
Scale
Scale, when used in design terminology, applies to the size of images and text. Choices here affect the importance we attach to an image.
Orientation
Orientation refers to the plane or direction in which the elements of a design are used. Text and images are typically set so that they are read and viewed horizontally from left to right. Using other orientations such as vertical or angled is done typically to maintain a particular aesthetic in the design, as doing so makes the reader work harder to obtain the information by having to rotate the publication. This may encourage them to pay more attention to it, but can also have an adverse effect and make them lose interest.
Structure / unstructure
Layout concerns the structuring of elements on a page so that they can communicate effectively with a reader. Absence of a structure can also be used to good effect to convey certain characteristics in a design – although this in itself is also a type of structure. Unstructured designs can be some of the most visually creative and, by definition, are more difficult to control in order to achieve the desired results. When deconstructing fundamental layout principles to create an unstructured work a designer must consider whether the intended target audience will be able to identify and access the information it contains.
Juxtaposition
Juxtaposition is the deliberate placement of contrasting images side by side. The word is formed from the Latin ‘juxta’, which means near, and ‘position’. In graphic design and page layout juxtaposition may be used to present two or more ideas so as to impart a relationship between them, as seen in the example opposite.