A BB2 page is made up of a number of "containers", laid in layers one on top of another.
Have you ever got confused trying to change the background color of your page?
Once you understand how these layers work, changing the background colors is much easier.
Before you read any further, just watch this 30 second silent animation showing you the layers in motion.
Later in the series we'll show you how to alter the backgrounds of the various layers, and how you can design your own template in BB2.
When you look at a web page on your PC, it looks flat, as though everything has been drawn onto one single flat sheet of paper. We're so used to using pen and paper since an early age, that this is the first mental model that occurs to us.
In reality, the html code underlying the page draws a number of distinct containers, each holding text and images.
These container boxes act as though they are in 3 main layers, piled one on top of another.
Here we've taken a flat screen Dell monitor and placed it on its back on the floor. Then we've drawn representations of each layer onto the monitor.
Then we've put a Starbucks Grande coffee cup onto the floor on the left hand side of the monitor. That's so you can easily get your bearings, never mind which angle we use to show you the picture!
If you change your viewpoint so that you are directly overhead, then you get a Plan View, like this.
If you move in the other direction, so that you are viewing the page at a flat angle from the front, this is what you see.
The simplest way to visualize these layers is to compare them to a series of see-through plastic sheets that are used with Overhead Projectors (OHP's).
OHP's are not that common anymore, but once upon a time they could be found in nearly every classroom.
The presenter draws onto a clear plastic transparent sheet and places it onto the flat surface of the OHP.
The bright light underneath shines up through the transparency, and projects the image onto the screen via the mirror.
If more than one transparent sheet is placed onto the OHP, then a single picture is projected onto the screen combining the images from all the layers.
And if the presenter draws a large black box on the top sheet, then everything under that box is hidden from view on the screen.
A very similar process occurs with your web page.
There are 3 main layers.
They look like this.
Let's look at these one by one.
Understanding which layer contains your content is the key to being able to alter your template design.