Document Design

“Document design is the field concerned with creating texts, that is books, pamphlets, posters and others that integrate words and pictures in ways that help people to achieve their specific goals for using texts at home, school, or work” (Shriver, 1997).

Good document designs

•               Guide readers through by directing attention.

•               Create retention value on important points.

•               Increase reader interest.

•               Achieve focus through

–              Conscious use of design principles

–              Graphic aids

–              Attention-getting format devices

•               Reflect and enhance the desired message.

The principles of design are qualities important to any visual presentation. According to Reep (2006), 4 general principles are to be considered when designing any document:        

–              Balance

–              Proportion

–              Sequence

–              Consistency

Balance

Page balance is about comparable visual “weight” on both sides of a page.

·         Weight matters!

·                     Big weighs more than small.

·                     Dark weighs more than light.

·                     Color weighs more than black and white.

·                     Unusual shapes weigh more than simple circles and squares.

·         Positioning – where the above elements are placed and used offers perspective on how to use the document.

·         Arrangement – arrange elements so that the overall look is held together in harmony.

Proportion

·         Size and placement of text, graphic aids and format elements – serves as a guide and help draw attention to what matters more on the page.

·         The Rule of Thirds technique helps to establish proportion in an image.

Sequence

·         Establish the hierarchy in the best possible order for easy comprehension.

·         Draw the eye to the most important point and then to the next.  

·         Readers tend to read starting from top left and then scan down left-right before ending downwards towards right. Read about the Gutenberg diagram (cited in Butler, et.al. 2003).

·         Use ‘weightier’, that is, heavier colours to guide desired direction and sequence.

Consistency

·         Keep to similar features, similar elements and similar styles.

·         Keep margins and indentations uniform.

·         Typeface – Use the same family of fonts to avoid disjointed content.

The use of white space, colour, typographic devices, graphic image, graphic aids and formatting elements are also pertinent to good document design. Good document design aids document usability and offers clarity of content and message.   

Related readings:

A Visual Guide to Document Design and Layout

Ten Steps to Good Document Design

Reference

Butler J, Holden K, Lidwell W 2003, Universal Principles of Design: 100 ways to enhance usability, influence perception, increase appeal, make better design decisions, and teach through design, Rockport Publishers, Beverley, MA.

Reep DC 2006, Technical Writing, 6^th edn, Pearson/Longman, New York.

Shriver KA 1997, Dynamics in Document Design, John Wiley & Sons, New York.

Image source: http://www.webcoursesbangkok.com/wp-content/uploads/2010/05/gdb-session1.png

Designing for Print versus Designing for Online

As Nielsen (1999) proclaimed, ‘anything that is a great print design is likely to be a lousy web design.’ I have made a summary of some key points to note when designing for each genre as highlighted by Nielsen (1999, 2008):

PRINT	ONLINE
Superior type and image quality. High resolution graphics possible.	Low resolution graphics and limited type availability due electronic format limitations and browser compatibility.
Users ‘read’ the publication.	Users ‘scan’ the publication.
Navigation - Simple user interface - i.e. page-turning in cases where article unusually exceed allotted canvas area –a full page or double-spread allows full capture of article.	Navigation - Scrolling required sometimes right from the start. Hypertext navigation to lead to links for further reading, subject to information architecture.
A canvas experience -      Full-page newspaper or large magazine layout possible	An electronic document experience -      Limited to the size of the computer screen
2-dimensional	1-dimensional & N-dimensional
Longer text, full sentences and details are possible with linear content, allowing storytelling.	Shorter text, fragmented sentences owing to reader eye-fatigue and typical impatience of web-users. A solution-hunting, actionable content model.
Immediate access to article.	Access is slowed down by download speeds and internet connectivity. But all these can be improved with technology advances.
Static elements. Lacks user interactivity.	Non-static. Its multimedia elements and overlays enhance user engagement and interactivity.
Creative headlines and titles are used frequently as teasers to draw audience in to read further.	Reliant on plain keywords and highlighted text to enhance Search Engine Optimization (SEO) utility.

The differences in designing for print and designing for online meant different design approaches should be taken to utilize the strengths of each medium and minimize its weaknesses. Agree wholeheartedly with Nielsen (1999) that the differences should be respected and relished!   

Related reading:

Writing style for print vs web

Designing For Print vs. The Web

Web is Not Print - But Good Design Practices Still Apply

References

Nielsen, J 1999, Differences between print design and web design, Jakob Nielsen’s Alertbox, 24 January 1999, viewed 15 October 2010, <http://www.useit.com/alertbox/990124.html>

Nielsen, J 2008, Writing style for print vs. web, Jakob Nielsen’s Alertbox, 9 June 2008, viewed 15 October 2010, <http://www.useit.com/alertbox/print-vs-online-content.html>

Image source: http://www.link-creative.com/wp-content/uploads/2010/01/webprint21.jpg