4.1: Document Design Essentials is Essential

Document Design Essentials is Essential

Document design as a component of technical writing continues to push further and further into the forefront of what it means to communicate effectively. Put simply, the bar for what is considered good design has been raised rapidly over the years and the minimum expectations of what a technical writer can do, and the value of being able to create good document designs, have risen. Think about websites, just for an example. How many times have you been hesitant to put your credit card information into a dated looking website? We judge websites, and documents, and the companies and individuals they are associated with, by their design chops.

Much of this rise in importance has gone hand-in-hand with technological advances—something we’ve discussed previously. Much like with visual design, document design software has developed and proliferated at an astounding rate. From the 1980s through today, the evolution of software and publication options has multiplied considerably, and in the last several years the explosion of design apps on phones and tablets has pushed this trend even further along. With the advent of software like Microsoft Publisher in the 90s, suddenly even small business owners could create their own custom signage, coupons, and brochures—something that we often take for granted today. Yes, the templates and the clip art are comical today, but at the time the software was revolutionary. Combined with the expansion of inkjet printers and eventually color laser printers and the expanding footprint of commercial printing services online and elsewhere, advances in technology and access have made creating and producing attractive documents easier than ever before.

Now, you aren’t going to be expected to work at the same level as someone who works primarily as a designer or artist—those folks have entire degrees focusing on the art of typography and drafting and other important skills if you’re going to be creating truly unique content as part of a design agency or the like. Instead, we’re going to be focusing on using the massive array of tools at our disposal these days to make attractive texts that are well-designed and well written for the context they’re going into. In particular, we want to focus on the design choices available to us and how to use those choices with meaning and purpose, not to simply click on buttons until things look nice.

To help prepare you for your work as a writer that has to keep design in mind concurrently with the usability and appropriateness of their writing, we’re going to cover some essential ideas as well as some tips and tricks that make working with highly styled texts much simpler and effective. We’ll cover in this introduction to design the research of design, the choice of paper/PDF, discuss styling tools for easy changes to texts, and cover images and accessibility/usability.

Design is Work, Research Work

Many times when we think of designers, we tend to think of folks who sit around all day dreaming up wonderful designs that are a delight to our senses. We may stereotype these folks as being sensitive, whimsical, and driven by fits and starts of inspiration. Generally speaking, these folks don’t exist—and if they do, they don’t have steady jobs. Good design, like good technical writing, is a job that is research-driven and process-oriented. Good designers are good researchers that work by process rather than waiting for the mood or inspiration to strike.

The goal of all of this work is to support your design choices, nay even to make those choices, based on the information you have about your goals and your users/audience. If someone wants to know why you used a certain color, you should have an answer that makes sense based on your research and the context. Generally speaking you shouldn’t be simply doing design on a whim—there should be a goal with research connecting that goal to your choice. The idea here is that if someone questions your work your time usage, you can explain what happened and why you made the choices you made.

The research for design is pretty much the same research we’re doing when we look at the research in the writing process or the design of visuals or data visualizations. In fact, though we’re separating each of these into discrete processes to aid in learning the importance of different facets of each of these processes, in practical usage you’ll make use of all of these processes together, tailored in a way that fits your personal needs and context. So, when we look at doing research for document design, we’ll follow off the information we have on audience and visuals.

The first and most important concern when doing design work is of course your audience—who is going to be using this and who are you actually creating it for? Your internal goals and purpose need to be honored while also adapting your text as much as makes sense to work with the primary folks using what you’ll be creating. Each of these groups has information you will need: you will need to know what style is appropriate for your organization and the document you’re creating, and you’ll need to know what types of styles will be appreciated by your intended readership.

When working internally, you’ll primarily need to know if there is a style guide that governs what you’re writing. Some organizations have expansive style guides with templates for almost any type of writing you would want to do, right down to putting the company or institutional logo on your polo or company car. Others have much more lax document requirements but extremely specific color and logo expectations. Figure out what is expected or required.

You’ll also want to think about the folks who will be using your design—not everyone values the same types of design and deliverables. For example, an ultra-trendy and modern design might not make a lot of sense if you’re trying to target senior citizens for a research study or educational opportunity. In the case of the older demographic, you may want to use styles that are attractive to them. Don’t know what those are? Do some original research! (I may have mentioned this a few times, but the last section of the book is chock-full of methods you can use to research audiences and usability). Remember that design isn’t universal—it is always situated in culture and individual perceptions. I, for example, roll my eyes when I see rebooted 80s and 90s fashion choices that I thought were awful when I was living in those decades worn by students on campus. I didn’t like acid wash jeans then, I don’t like them now. Folks view design through their own experiences and their own values.

Paper, PDF, and Beyond

When you’re doing document design, an essential choice is the venue for your document. Are you going to be creating something that will be printed? Are you going to be printing something that is in color or black and white? Will this be on the web? Will it be on phones? Will it need to be multilingual? The choices are endless, but you need to know what type of document you’re creating!

Practically speaking, you should know fairly early on what will be possible or not possible. If you’re doing something for a class, obviously you have more freedom than if you’re going to be published a run of 5000 documents that will be printed and delivered to their users. Find out what the goal of your work is and what will be expected.

When it comes to design, the medium matters—some mediums cost more, some allow for more options and design moves, and some present more accessibility barriers than others. For example, electronic documents can be more readable for folks using a screen reader, but only if the document is designed for that usage. In another situation, you might be creating a resume that you know will be photocopied. you’ll want the actual text to look nice, but you won’t want to use colors that will lose their legibility when they’re transferred to a black and white copy.

One final consideration with the medium—color. Be aware, and we’ll discuss this more in later sections, that there are different color palettes used for screen and print. Generally speaking, you can get much brighter and more vibrant colors on a screen than you can on the printed page. Now, that’s not to say you can’t get super-vibrant printed colors—you can—but, these colors often come from special palettes that can be expensive and hard to set up for a production run. The primary two palettes you’ll want to know about are CMYK and RGB. CMYK is the set of colors used in most printing and consists of a mixture of cyan, magenta, yellow, and black. You may well have seen these colors in the ink cartridges of a printer. RGB is the set of colors used on screens, and is made up of red, blue, and green. Though it may seem counterintuitive, the smaller selection of colors creates the brighter shades.

If you ignore the question of color, you may end up with unintentionally hilarious or just plain awful results. If a printer is given a document set up for a screen, a document that uses RGB color, then it will perform an on-the-fly correction. This correction isn’t going to be perfect and you may end up with a markedly different shade than you originally intended. At the same time, if you don’t check that your RGB colors are going to translate to the printed page, you may pass along a digital proof of something that simply can’t exist on the printed page without a lot of extra work and equipment. Often software makes use of out-of-gamut warnings or the like to give you this information, but you need to be aware those features exist and matter. (If you’re wondering what this looks like in real life, think about any time you’ve had a really vibrant picture you’ve taken on your phone and had printed. It tends to look duller and less colorful when you get it printed, especially in the areas of intense color. This is what happens when you send something out of gamut—the printer will downgrade the colors to fit the available palette, often with dismal results).

Styling Text and Quality of Life

While we are going to be discussing typography and layout in much more detail later in this chapter, I want to spend a brief amount of time early on letting you know about the most powerful and life-changing tool that you may well have been ignoring for most of your academic career—paragraph and character styles.

When you work with a large document, you often want to have a good selection of stylistic choices available to create signposts for your readers in the text. We’ve discussed this at length earlier in the text, and we’re going to be coming back to it later in this section when we look at combining document design with signposting. The end result of this process is that you end up with a lot of text with specifically styled choices, choices that you may well want to edit later in your project! If you’ve ever spent fifteen minutes changing the font size or weight on a resume that you’re tweaking before sending it you, you know just how miserable changing the font choices and design moves in a large document can be. There is, however, a better way.

Paragraph and character styles are tools built into most word processing suites that allow you to markup your text to allow the program to remember what type of styling you want to use for a particular segment of text. This information can relate to spacing, font, color, etc. You may well have noticed this before when using something like Microsoft Word when you see the various styles listed as Heading 1 or Sub-Heading in the top section of the user interface.

By painting a selection of text with one of these styles, you’re allowing the document to know that this text has a certain purpose within the text. You may be saying this is a section heading, or it might be a keyword, or it might be a warning. In any case, the text has a label that you will be associating with a design. The magic of these styles, much like the magic of CSS when doing work with HTML, is that the program will always remember the purpose and label of the text, but it will be able to change the style associated with the text anytime you’d like. What you’re doing is creating a label that then gets used to selective apply style choices like holding the text. If you decide later to change the font from bold to underlined, you can simply alter the settings for that style and then every single instance of the text that is labeled with that style will be altered. It really is life changing.

When working with a larger document, using styles is almost a necessity and needs to be part of your workflow. Think about what types of text you will need to label for signposting and then create styles for those types in your word processing program or using existing styles as a starting point. By coming up with the styles that you’ll need for signposting and design at the start of drafting, you’ll be enabling yourself to easily change how the styles work as the document gets longer and more complicated. Suddenly, changing the font on a part of your resume goes from a painstaking process of clicking and dragging over and over again to simply selecting a new font or font permutation via the style settings.

I’m not going to go through the process of telling you how to go about setting up styles in this text—that would be likely a choice that would instantly date this text and the software I’m using. I would instead encourage you to look up the style options for your software of choice. If you’re using something like Adobe InDesign or Scribus, the options will be overflowing. If you’re using a cloud-based option, you may find significantly less tools available. Do some searching in the online documentation for your software for paragraph and character styles and go from there. When doing so, be aware that usually character styles are simply the characters in the text—not the spacing. Paragraph styles incorporate the style of full paragraphs, including line spacing and page spacing. Character styles tend to overwrite paragraph styles, allowing you to set up a particular font and spacing for your paragraphs and then selectively override the font when you have a single bit of text, such as a keyword, that you need to consistently look different.

Images, Video, Accessibility, and Use

One last important area that we need to cover is the inclusion of images into your documents. Images are more and more common, especially in digital deliverables that don’t have to rely on being printed. With the spread of high quality camera and camcorders via smartphones, almost anyone can take a quick photo or video that is impressive in quality versus anything available to the average person in previous decades. (Writing this text is making me feel old). Because of the availability and ease of creating images and video, we see them a lot. But, their uses are not always effective or even legible.

One important aspect of using images is the quality of the image—images are created at a certain level of pixel density and using a particular ratio for the dimensions. Despite what you see on TV, you can’t simply yell at a screen with an image to “enhance,” and expect magic to happen. The pixels you need to create a more detailed image simply don’t exist—they were not recorded when the image was taken or they’re not present in the current form of the image. You can’t get them back with programming magic, though sometimes you can attempt to extrapolate what they might look like.

For our purposes, you want to make sure that your image is not pixelated and that it will print at a decent quality if you’re going to be doing a printed project. Different applications have different needs—you can get away with different densities when printing depending on the size and use of the image. Test out different densities and see how they look. For printing, starting at 300dpi can be useful. And, of course, if you’re going for a pixelated look to begin with, that’s okay. After all, it wouldn’t be a proper picture of Nessie or Bigfoot or a UFO if the image was in focus.

When it comes to images on screens, keep in mind that our desktop or laptop screens and our phones can have drastically different levels of image density. An image that looks awesome zoomed in on a desktop with a dated display will look awful when you zoom in on a mobile device with a high density display. Keep in mind that the size of the image, no matter the medium, needs to be scaled with the quality of image available and the space requirements you have.

When it comes to video, think about your composition and framing. Basically, remember that most people prefer video in landscape format for professional usage. Unless you’re composing on Earth 2, please try to hold your phone sideways when you film footage. Just saying.

Images and video also introduce accessibility issues for some readers. To assist these readers, you’ll need to give titles and alternative text for each of your images in digital deliverables. This alternative text will allow a screen reader to read to your user whatever you consider to be a good description of the image that you’ve provided. Usually you want to design your alt text to allow the reader to get from the image whatever you’ll be using it for later in the text. If you don’t do this extra work, folks with screen readers will have no clue what your images are.

Going along with the question of alternative text is the question of how to title and refer to an image, or a visual, in your document design. Generally speaking, you’ll want to give a title to your images in a text that will be referencing them. You may call them Figure 1, or Figure 2, or Image 1, but you’ll need to have some form of reference. This allows the reader to understand when you’re discussing a particular image, and allows for easy navigation back to an image later on if you reference it again. In some contexts going without labels is preferred, but if you’re going to reference an image a lot over the span of several pages, titles can help.

Finally, you want to make sure your image is actually visible and doesn’t blend into your text. Often times when you include a photo with a skyline, for example, the edges of the image may tend to bleed towards white due to how the image has been exposed and balanced by your phone or camera. When you place an image like this on a printed page, you end up with a visual that blends into the document itself, creating issues with visibility and crispness. To avoid these issues, you can often using a simple border that is maybe 1 or 2pt in stroke. Something that contrasts with the background of both the image and the page can work—usually black will work. You won’t want an overly thick border, but you’ll be amazed at how much a simple stroke can change how easy an image is to see and how professional a layout looks.

Section Break - Document Design is Essential

1. When we use colors, we often think in generalities—red, blue, green, etc. When we design with color, we need to think in specifics that will get us the color we want time and time again. Do some research on the color codes associated with iconic brands and institutions you admire. See how many types of codes you can find—CMYK, RGB, Hex, etc.
2. Try out using styles with a simple document. Create a series of headings, sub-headings, and paragraphs with associated styles. Save the text with three different final looks, altering the styles between each version.