Why should you use spatial perspective?
First off, many of my readers may not know what spatial perspective is. The simple ways to explain it is to think of spatial perspective as transparent layers of atmosphere. It is actually visible because of layers of atmospheric molecules in the air, and that is why a lot of people know it by the term of atmospheric perspective. This can be an array of colors due to the different chemical compounds in the air. In a clear sky it would be blue but a smoggy sky it would be more of a gray. To get a better visual of what spatial perspective think of some mountains, or a large city in the distance. Our eyes have evolved to use this perspective to registrar a field of depth. So when using it in a design aspect you can trick the eye to see depth. Which can be useful in many different ways.
Usage
Using spatial perspective in a web page can give a user an extra dimension of depth. There are some elements that would be better when pushed to the furthest point in vision, while some need to be in the foreground to get the users attention. There are different ways to emulate this. One is just to use contrast. Things that are in the background should not contain a deep black or a pure white if you want to push it to the back of the users attention. For a the font of the main content you would want to use a midnight black or a pure white. In the example below I illustrate how using this method can add depth to a webpage.
In the example I used only gray scale colors ,but another way to use spatial perspective it to pick an atmospheric color other than grey. This is usually characterized by the background, but also can be used with any other various element. When making a link, text or graphic that you want to be pushed back into the background simply layer on the atmospheric color. If its a font color pick a color that is in between the main context color. If its a graphic use you graphic editing program and put a transparent layer of that color over the graphic. I recommend around 20% opacity so that most of the detail is still preserved but the contrasted line are now more subtle. There are many places In the webpage this can be executed to add depth to your webpage.
There is always content you want more noticeable then other content, and spatial perspective is a perfect way to execute the effects wanted. This can be used links, headings, content, and logos. Also you can make a the content of you blog stand out more then your navigation bar, footer, header, and sidebar using spatial perspective. If you were to look at an well designed webpage you would see that different sections of the page use a spatial perspective to emphasize an element of a page.
Using Multiple Atmospheres
Since this is the web we can creatively use spatial perspective in ways that you would not see in everyday reality. You can use multiple atmospheres in a small area. Lets say we have a red div were the rest of the atmospheric color is a medium gray. Its easy to think of that red div as its own atmosphere and that all the content inside that div uses that atmospheric color rather than the medium gray.

This can be used in any diverse ways, and will work with any colors. See how far you can stretch this idea. Maybe add in other perspectives to this one and mash them together for a larger field of depth.
Also can you let me know what you think of this tut. This is my first tut and I am eager to better myself through critizism. Thanks



August 25, 2011 at 8:43 am
I am sure it would be a great tutorial if the images were not all broken graphics
August 28, 2011 at 3:40 am
@Chris yeah sorry I switch host and apparently not everything came with the transfer. Slowly building everything back up
added now.