A work in progress...

I changed the location of my logo from my plans since a) it seemed very difficult as a beginner web designer to complete this, and b) as a design choice, it being central actually gave it too much direct focus. So I moved it to the left. I had a play around with the gradient fill tool learned from w3schools to fill the navigation bar with my branding colours, which you will see later on I changed since the gradient is too much on the eye. I also used a Tutorial on youtube to help me build a navigation bar with tabs that slide across with a line at the top rather than underneath, and also changes colour.

Below are images of where ive changed the colour of the header from a bright coloured gradient to a simplistic off white/ beige colour to create a more minimalistic look. I have also made the text colour of the tab titles to stay the same, and to just have the bar that moves.

As you can see, I have also added the 3 images for each of my projects. I created a div for each image, gave it a class of "image", included "href" for each image to open up a new html page to showcase each full project, sourced the image using "src" and used a "onmouseover" and "onmouseout" for the gradient overlay effect when the mouse is hovered over it. I also added a width and height, and an "alt" incase an image cannot be displayed online. 
 

-

Below is the tutorial which aided me with my website design, as well as using w3schools, and the help of Tom in the media labs.