Is there a purpose to the grouping of stones in the Figure 20 image below? Is this a rock formation, landscape art, or just a random collection of boulders?

Figure 20. “Small Tree In Field Of Rocks” by Linnaea Mallette is in the Public Domain, CC0)

Consider the difference between the image above and the one below. The careful positioning of the rocks in Figure 21 makes it evident that the items were arranged with purpose. This is the Ham Hill Stone Circle in Somerset, England. A product of modern England, the work was constructed in the year 2000 to commemorate local stonemasons and the long history of quarrying local hamstone.

Figure 21: “Ham Hill Stone Circle” by Gaius Cornelius is licensed under CC BY-SA 3.0.

Though page and document design don’t involve working with stone, we can take a lesson here. When we work with pictures and blocks of text, placing elements near each other in certain ways shows readers or viewers that these elements are meant to be considered together and have some sort of relationship. For example, photos and figures have captions that explain their contents; the captions should appear close to the images or graphics they refer to. Images often illustrate the content found in body text, and should be close to the text they illustrate. Headlines are placed above body text they relate to.

Proximity can be especially critical in booklets, newsletters, and brochures, in which certain pages or panels might be grouped together under a subheading. Individual pages can be designed to reflect a larger relationship with the overall theme or subject matter. For example, the themes provided by blogging platforms like WordPress take care of this for you—every page will have a recognizable layout and, though individual pages might be slightly different, they’ll be recognizably related to the blog’s main page. Web sites work the same way, as do book chapters.

The principle of proximity also affects white space: equal amounts of white space and equal line spacing indicate that items are related or should be considered as parts of a whole. If headlines, captions, or body text blocks aren’t close enough to the image or text to which they pertain, the reader could be confused about what is—and is not—related.

For an example of confusion, check out the Venn diagram below. What’s going on here?

Figure 22. Venn Diagram of language issue space by KDS4444 is CC0, Public Domain

Why are there different font weights, sizes, and quotation marks setting off the words? Note that entries for the “Acceptable” lavender category are in both the top left and bottom right of the circle. Their relatively distant position (proximity) makes the relationship of these terms unclear. There are no headlines or labels here to help us understand, and the design strategy isn’t doing readers any favors.

Planning and adjusting how items are grouped on a page helps you design your text, graphics, and images so that readers can see what’s related, what goes together, what’s similar, and what’s different. Items grouped near each other will be seen to have a relationship. Moving items further away decreases the strength of that relationship in the minds of your readers. Use proximity to make relationships between items clear to your audience.