These wire frame designs are just mock layouts drafted to show a mock client as part of my college course. I hope to recreate these designs, and create some new ones, in the near future as actual webpages to show the range of different layouts that I am capable of creating with the aid of CSS.
This is a very basic design that uses your web browsers own vertical scroll bar. As you can see by looking at the design it is pretty conventional with the logo and header at the top of the page, the navigation displayed down the left hand side of the screen.
The main website content will be displayed next to the navigation panel and take up most of the screen to maximize the viewable content.
At the very bottom of the website you will find the footer which can be used to contain copyright
details or secondary navigation for websites that user non textual hyperlinks.
This is a very similar to design 1. Again this design uses your web browsers own vertical scroll bar. As you can see by looking at the design we still have the header at the top of the page but this time the navigation is displayed beneath the website header.
This design allows the websites main content to be displayed taking up the entire width of the screen to maximize the viewable content.
At the very bottom of the website you will find the footer which can be used to contain copyright details or secondary navigation for websites that user non textual hyperlinks.
One design feature is the header and footer images are rounded making the whole design more appealing.
Wire Frame Design 3 - This is a very similar to design 2 but would be better suited for flash based websites. Therefore this design does not use your web browsers own vertical scroll bar.
Instead this design uses a flash scroll bar which allows it to be positioned where you want it as opposed to right up against the right hand side of the screen.
Another benefit of this is for pages that don't have scrollable content you dont have the scrollbar on the page unnecessarily, taking up viewing space.
Other than the scrollbar being different this design is identical to design 2. Some of you may have noticed that the text in this design wraps around the image.
This is achievable if it is a repeating background image with some carefully placed div's, but for general use and changeable pictures this ability to wrap text is as yet unavailabe.
Hopefully this is something that we could achieve in the future as our technology improves.