Negative Space in Webpage Layouts: A Guide May 18 2010 by Joshua Johnson |74 Comments |Stumble Bookmark Negative space is often misunderstood as a tool to implement in certain designs that call for a simple aesthetic. However, it is in fact something you should pay attention to and carefully structure in every design you create. This guide discusses what negative space is and how to effectively use it to analyze and improve your designs. What is Negative Space? Negative space, also known as whitespace, can be loosely defined as the area of a page not occupied by content. More appropriately, it is the space between specific items on the page. Negative space does not have to be white, or even solid in color. It can contain gradients, patterns or background objects. In the example below, you’ll see that it contains complex graphical content, yet it still employs negative space between the headline and the search bar.
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 1/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 2/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 3/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 4/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 5/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 6/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 7/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 8/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 9/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 10/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 11/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 12/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 13/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 14/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 15/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 16/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 17/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 18/19
8/7/2019 Negative Space in Webpage Layouts
http://slidepdf.com/reader/full/negative-space-in-webpage-layouts 19/19
Related Documents
