Week 12 Page 3: Negative Space
Every Design Needs Negative Space !!
Why Negative Space Is Important?
| Negative (or white space) is a design element too! (To see negative space as an element, try this: squint at the screen. See the shapes on the screen, not the details.) Negative space affects both how easily the content is interpreted and how attractive the screen design appears.
Negative space isn't just black or white space! It can be colored, textured or even a blurred photo in the background. Look carefully at the shape, size and placement of the negative areas in your layout. Use the negative space to accent the focal point, to add to the logical grouping of the written content (space between paragraphs, before subheads, etc.), and add to the overall artistic effect (lighten up the layout, interesting positive/negative interplay). Too little negative space makes a page crowded and unappealing. Too much negative space overwhelms the intended focal point and breaks apart the relationships between design elements. Negative space isn't always passive. It can play an active role in a design by guiding the flow through the content. When used in this way, negative space becomes a design element in itself. Negative space is a key factor in successful proximity and balance. |
How to Create Good Negative Space
Well-handled negative space is the sign of a good design! Here are some tips for using it:
- Use left aligned type: the right ragged edge invites white space into the page.
- Avoid centered elements: If you align elements on a center guideline rather than a strong edge, the negative space is ragged and uneven on both sides
- Check for strange negative space shapes: Make sure your design does not have trapped pieces of negative space that create unusual shapes.
- Add space between paragraphs (instead of indents in some cases).
- Add "Breathing room" between design elements. You should never have elements so close that they just touch but don't overlap. For example: wraparound text that touches the graphics, two columns of text that are too close together.
- Design for "Flow": negative space should flow into/around the design rather than being trapped. It should direct the viewer's eyes to the next piece of content.
-
Use macro and micro amounts: negative space shouldn't be uniform. Depending on the context, you should use larger or smaller amounts! Use macro (large) amounts around a focal point or heading. Use small amounts between a subheading and the paragraph that follows it.
Negative Space Examples
Let's look at two screen shots of web pages. We'll start with a "good" example!!
This site is a delight to look at! Notice how much space the designer has given around the different design elements. You can also see the design principle, proximity at play in the logical grouping of parts of the design. Here is the link (archived version): http://www.gesturetheory.com/
Links to an external site.
Now let's move on to a sadder example. The following design does not have much negative space and what it does have is poorly managed. Notice how the logo is so close to the top and the text type is jammed right next to the table borders!! There is barely any vertical negative space between the two boxes on the left!
They must have read my comments because the live site has since been improved. Here's the link to the archived version: http://www.carepathways.com/FAx.cfm
Links to an external site.
And lastly...
Successful Negative Space or Not?!!Look at the following sites and decide: Successful or Not Successful? • Santa Rosa Gymnastics: http://www.srgymnastics.com/ Links to an external site. • Neebo: https://neebo.snp.agency/new Links to an external site. • Status Audio: http://thestatusaudio.com/ Links to an external site. You can post your comments to our class Weekly Class Discussion, Discoveries and Questions Forum if you want to discuss these sites with other students. |