Page Layout
- Clear visual hierarchy
I utilized this concept throughout my pages in several ways. First of all, I divided different portions of my page by color, size and position. For instance, the header, which can be seen at the top of every page, including this one, is bigger than anything else, and is the only portion of the site with a colored and textured background. I also positioned it on the top of the page, giving it distiction above everything else. By using these techniques to create visual hierarchy, it is clear that the header is important and different from the rest of the page.
- Following web conventions
I also tried to implement traditional web conventions into my design to make it easier to use. For instance, the navigation is on the left side of the page and look something like buttons. Each button also changes when you hover over it. Both of these things help new users realize that this section is navigation, connecting them easily to the rest of my site.
- Break up pages into areas
I already spoke about how I've used color, position, and size to divide up my page, giving it visual hierarchy. These same things have helped to break up each page into areas, specifically the head, navigation, and body copy. This page also has a good example of this concept. Below this copy there is a list of links. In order to separate this list from the footer and the body copy I have used a horiontal rule. This breaks up the page, making it easier for users to recognize this list of links at a glace.
- Make what's clickable obvious
There are several ways to make what is clickable obvious and most involve following standard web conventions. On this page and all the others on my site I distinguish clickable links by leaving them blue (or purple if they've been visited) and underlined. For instance, the footer has several parts, and not all the parts are links. The only way to recognise what is and what isn't is by the color of them and the fact that they are underlined.
- Keep down the noise
On my pages I have done several things to "keep down the noise." I have tried to use lots of white space and a calm color scheme, as you can see by this page. I have muted the text a little, so that instead of being a stark black on a white background it is more of a dark grey. I also tried to cut out any content or images that would distract from the purpose of my site.
- Provide Mindless Choices
My page layout is also intended to leave the user very sure of their movement through my site without really think about it. I have done this by labeling my navigation buttons and various links clearly. For instance, on my main navigation I wanted to name my assignments page "education" because it fit in with the purpose of my site a little better. I decided against this because I knew anyone looking for my assignments page would not immediately turn to the education button without being at least a little stumped first.
Intro • Page Layout • Page Copy • Navigation • Home Page Development