What print design teaches us about UX

Default avatar.
November 20, 2015
What print design teaches us about UX.
Every new field of knowledge and endeavor develops its own jargon and acronyms. Web design is no different; we have terms like tags, keywords, analytics, user testing, mobile first, responsive design, etc. We also have acronyms such as SEO, UI, and UX. In recent years, there is a new term – UX Design, or User Experience Design. It’s almost as if this is some new concept—the sleekest, eye-stopping design is worthless unless the user can navigate easily, can take in the important information quickly, can interact seamlessly, and get to conversion pages with no effort other than a click—in short that designers have to design for the user, not for themselves. But this concept of designing for the user is nothing new; magazines and newspapers have been doing this for years with engaging and compelling print design. Part of UX design, of course, is the written word, and how it is presented to the user. Print design was around long before the Internet, and it has permeated everyone’s lives, just as the Internet does today. Print design was, and still is, found in flyers left on doorknobs and in mailboxes; it is found in magazines, in newspapers, in printed grocery ads, in brochures found at brick and mortar travel agencies, and big box home improvement retailers. It is found on billboards. While there are no analytics to evaluate its effectiveness, there are years and years of experience under print designers’ belts. It’s experience that web and print designers should certainly take into account as they design sites.

Using grids

Newspaper and magazine print designers have known this forever: as content on pages is laid out, there is some type of grid pattern used. This should be no different when content is placed on a web page. Using a grid provides balance and provides a level of comfort for the user. If a page is divided into equal sections, more important content can be spread out into more sections on the grid that less important content.

A single focal point

In newspaper and magazine design, the focal points are easy to see: the large headlines. The same goes for web pages. There has to be a focal point to capture the “point” of the information on the page. The point is that the user should see that focal point first, so that the nature of the content on the page is clear.

Using white space

White space around the elements and the text provides “breathing space” for the user’s eyes, allowing those eyes to focus on images and words. This is one factor that early newsprint was unable to provide, other than space between paragraphs and columns. Once images were added to newspapers and magazines, layout designs provided for more white space, and that was a good thing. Today, web design allows for even more white space, and that enhances the UX.

Consistency

It’s all about repetition. This keeps the user comfortable. A grid gives consistency, but more importantly, typeface and content do to. Readers should not have to continually adjust their eyes to different print types. Consistency also means use of words and colors—keeping terminology the same and projecting the same image with color use. Repetition of placement of the same elements can also bring a consistency, if possible. Tight consistency may not always be possible; but good print design is as consistent as possible — especially with typefaces, terminology, and color.

Hierarchy

Font size and type are the best means to show the relative importance of different pieces of content. There are two goals here: we want content to be easy to absorb and for the user to know immediately what is contained on the page, and we also want the user’s eyes to travel as we want them to. Thus headlines are large and bold, sometimes in a contrasting color; sub-headlines are smaller and less bold perhaps, but still more important than the smaller text which provides the detail. These things also make a page more scannable. If there is a great deal of print, breaking it up with sub-headings in a large type and bulleted points improves scannability and, consequently, user experience.

Using scale

Some elements will be larger than others so that the reader will automatically be drawn to the larger elements in the layout and then move to the smaller elements as they read through the content. This allows the designer to “force” focus on the most important elements and text.

Legibility

Legibility means just what it says. Can the reader easily read your text without strain? Is it divided up into chunks with bullet points or other “dividers” so that it is scannable? What is the spacing between words and between letters within those words? If you make that difficult, the reader is not comfortable reading any of your content. Here are some things to consider:
  1. The text should not be too light or too bold.
  2. Letters need to have good space between them.
  3. Use ornate and difficult-to-read text very sparingly, and mostly for dramatic effect.

Use of color

When color came to print media, it was huge. Print designers had much greater opportunity to use colors and shades of color to attract the eye and to deliver some psychological messages as well. There is an entire field of the psychological appeal of colors, and good print designers will study this research in making color selections.

The takeaway

Decades upon decades ago, print designers were creating layouts for newspapers and magazines. They learned the basic principle of layout grids, of focal points, hierarchy of type, legibility, and, when it became available, color. Those principles still apply today, whether they are utilized in traditional print media or in website design. Featured image, print design image via Shutterstock.

Nicole Boyer

Nicole Boyer is graphic and web designer. She is also a contributing blogger for several websites. You can connect with Nicole via Google+ or visit her professional blog.

Read Next

3 Essential Design Trends, December 2023

While we love the holidays, too much of a seasonal theme can get overwhelming. Thankfully, these design trends strike a…

10 Easy Ways to Make Money as a Web Designer

When you’re a web designer, the logical way to make money is designing websites; you can apply for a job at an agency,…

The 10 Most Hated Fonts of All Time

Remember when Comic Sans wasn’t the butt of the jokes? Long for the days when we actually enjoyed using the Impact…

15 Best New Fonts, November 2023

2023 is almost over, and the new fonts are still coming thick and fast. This month, we’ve found some awesome variable…

Old School Web Techniques Best Forgotten

When the web first entered the public consciousness back in the 90s, it was primarily text-based with minimal design…

20 Best New Websites, November 2023

As the nights draw in for the Northern hemisphere, what better way to brighten your day than by soaking up some design…

30 Amazing Chrome Extensions for Designers and Developers

Searching for a tool to make cross-platform design a breeze? Desperate for an extension that helps you figure out the…

Exciting New Tools for Designers, November 2023

We’ve got a mix of handy image helpers, useful design assets, and clever productivity tools, amongst other treats. Some…

The Dangers of Doomscrolling for Designers and How to Break Free

As a creative professional, navigating the digital realm is second nature to you. It’s normal to follow an endless…

From Image Adjustments to AI: Photoshop Through the Years

Remember when Merriam-Webster added Photoshop to the dictionary back in 2008? Want to learn how AI is changing design…

3 Essential Design Trends, November 2023

In the season of giving thanks, we often think of comfort and tradition. These are common themes with each of our three…

30 Obsolete Technologies that will Perplex Post-2000s Kids

Remember the screech of dial-up internet? Hold fond memories of arcade machines? In this list, we’re condensing down 30…