The biggest elements on the page are the Google Doodle that features the Google logo and the search bar. There are a few small links across the top of the page, but most of the page is negative space.

This clean design makes the page visually appealing and draws their attention to the part of the page that they need to interact with to meet their needs, which is the search bar.

The importance of negative space

1. Use negative space to indicate if elements are related.

   • If two objects are positioned closely together on a page without negative space between them, they will be perceived as being related.
   • This concept is based on the Gestalt Principle of proximity, which you explored earlier in this program.
   • Remember that proximity means that elements that are close together appear to be more related than elements that are spaced far apart.

2. Negative space draws attention to important elements.

   • Users generally have short attention spans! If the information on a page or screen isn’t easily scannable, you'll lose user attention quickly.
   • Using negative space is one way to help users focus on the reason that they opened the page or app.
   • For example, using negative space around a button in your mobile app design will help users focus on the most important action, clicking the button.

3. Negative space gives users a visual break.

   • Negative space helps prevent users from becoming overwhelmed or distracted.
   • The negative or white space in your designs can provide users with a visual break as they scan the content.

4. Negative spacing increases readability.

   • You’ve probably encountered online sales that advertise an entire page full of items. The page is usually really colorful, with a lot of information to sift through, including prices and descriptions.
   • Ads like these tend not to include much negative space, which can make the information appear overwhelming and difficult to read.

Use negative space in your designs

• Line spacing

  • is the vertical space between two pieces of text.
  • Think of reading a book: the negative space between sentences in a paragraph keeps letters from overlapping and makes content easy to read.

• Padding

  • is the negative space surrounding content, or between the border and the design elements.
  • Padding gives objects space to exist before the user moves to look at another element of the design.
  • In the image above, padding in the dog walker app provides symmetry to the design and keeps elements from being crowded together

• Margins

  • are the space outside the border of the design.
  • You can think of margins as a way to keep you coloring between the lines of your design.
  • In the image above, you’ll notice the edges of the design surrounded by the margin.