Saturday, 2 March 2013

Part 5: Research - Designing grid and dealing with images


Page layout design is one of the most important parts in design process which comprises placing and arranging textual and graphic components. Dealing with large amount of text and graphic elements is quite complex task and can result in visual disconnection and chaos as well as in good balance and visual dynamic. Understanding the page layout means exploring the grid as its primal structure. Using the grid is helpful in creating and maintaining consistency throughout layout so I will start with some basic grid structures.

Two columns grid is often used in books, newsletters and some narrow publications. Having two columns of text instead of single one, makes text more readable as the line length is shorter which is more comfortable for eyes. This is a simple layout which can be enriched by different position of images and headlines.

Three columns grid is often used in journals and newspaper. Two columns of text may appear too wide on some wider pages so arranging layout into three columns is another common option. This kind of grid also gives more flexibility as there are more options how graphic components can be positioned; text and images can span one, two or all columns. This type of grid is the most commonly in use.

Four columns grid is delicate for use. It can work fine if there is enough space to create column whose width is not too narrow; otherwise it could be uncomfortable for reading. It should also bear in mind proper use of white space as it creates breathing space which is effective in busy pages. More columns are used in newspaper layout.

Grid is also is characterized by its flexibility so asymmetrical grid is commonly used as well. The most popular asymmetrical three column layout is one with a sidebar. Sidebar is a narrow column position either on a left or right hand side; it is not used for body text but instead holds the related text like headings, pull quotes, notes, graphics but it can also be used as a white space.   

Below are examples of some asymmetrical grids.


When we speak about layout design and grids we should keep in mind that borders, margins and gutters also play important role in achieving readability and overall harmony. Margins are considered as a border around the page and it is very rare that they are of the same width; more often is that we need extra space on the top for a header or on the bottom for footer information such as page number. Inside margins are usually wider for bound publications in order to prevent content disappear into spine. Gutter is a space between two columns.

Mixed grid layouts can be used in situations where certain content varies greatly from the rest of the document. Instead of forcing to follow the certain structure at any cost, it is better to choose different grid that suits better.  

Breaking out grids is interesting and creative way to break the rules. This can be achieved by extending an element out to the page edge or even across the entire spread which is effective when dealing with large images.

The second way is to position some elements outside of grid, like text frame containing the pull quote which is centered on the page across three columns.

Breaking out grids may also be achieved by rotating some elements like images but it shouldn’t be overdone as it can create disorganized look.

Using diagonal lines can also make layout look interesting and dynamic but this should also be done carefully in order to keep consistency.

If the space is at premium and there are many columns it is common practice to justify text as it looks neater.

Source:

No comments:

Post a Comment