Composing my website

I began by doing some mock ups of my pages first in Illustrator, so I could configure various different looks. My first mock up that I did right back when we were doing our presentations, was way to simplistic and did not really have any significance, however it did help me to create a vision in my head to where I would like to place different elements. I did create a new mock up which was much closer to how I would like my web page to look.

Above is how I would like my home page to look like, it is very simple and plain, however I wanted to start with what I understood how to do, I did not want to include lots and lots of advanced elements as I wanted to create a fully functioning site, that was easy to navigate your way round, therefore catering for the all abilities.

However as simple as it is to look at, I found it very confusing at some points in its development. For example I got it all in place how I wanted it, but the navigation at the top of my page would not link or change colour when I hovered over it. This I found very confusing indeed. It was as if something was over the top of it, even when I used firebug it could not find/select it. After much restructuring my pages both in CCS and HTML, and through trial and error of removing elements and rearranging I did manage to sort it out.

I created all my images, for example, the navigation bar and the various different titles, I then saved them to web and devices so I was then able to insert them as divs onto my site. It was important to have a strong and well structured file structure.

My navigation bar, to create that almost painted look effect on the edge of the circle, I applied a brush style, and just changed the size and colour to each circle, I feel that this is very effective.

Once I had sorted out my problem with the nav bar, that I explained above, I then used the working page and duplicated it several times and just changed links, text etc, I did this so I knew that they in theory should all work, this worked!