Interactive Web Template Evaluation

I first began with the basic template given and experimented with changing elements in the HTML & CSS code to fit with my design template. I added some dummy text to show a text box on my website and then changed the names of the webpage and navigation buttons to suit the purpose and design of my website. I also gave it the existing colour scheme for the company of purple (using the CSS functions to change colours and border tools).

Next I added a left navigation bar (using the coding learnt through codecademy), which they already have on their website. I need to ask the client if they would still like this as it does take a proportion of the website that could be better used. 

I toned down the colours to make it look more professional by creating a new logo for the company (using the image place functions) and using less purple for the boxes on the page. However, doing this has created a few problems with my layout which I will need to get sorted before I continue with anything else.

Here is my homepage so far: 

I have sorted out the layout and everything is pretty much in its place. I have added speech bubbles with quotes from famous poems (as specified in my design template) However, these are only images and do not dissolve/rotate to reveal a different quote - so I will be learning how to do this over the web in the next few weeks. I think it is a fun and clever way to get the quote/testimony read by the visitor where it may have been overlooked in the past. I think the logo is simple and suits the theme of the company of combining poetry with competition - I need to link this image to the homepage as this area of a web page will usually take you back to its home page. I have added social network sites and an email address to keep them up to date with the latest trends and allow for increased awareness - these all work apart from the envelope is also linked to the 'in' (linked in) button when it should have no link. The navigation bar works but is very dull and almost unnoticeable - I would like to add hover functions and have them surrounded by a bubble or oblong shape. As I said previously, I need to check with the client if they would still like the left navigation column as it does take up a lot of space unnecessarily. The title of the text box is supposed to be in bold but it isn't so I need to look into that.

Overall, I would say it was challenging to get to this stage as I encountered a lot of layout problems after adding each new feature. I have developed my understanding of HTML and CSS as I used a lot of the skills learned through codecademy and used it to look back and check my own codes - this allowed me to have a go at building what I put on my template and consult codecademy or Mike for any guidance. I think that for a first attempt at web design coding I am very pleased with the result as I didn't know how to do anything at the start of this brief so to be able to insert images with links, create 'divs' to divide areas of the page, make navigation bars and so many more elements that I have included already at an early stage in my design. I still have so much more to do to get it looking like my design and make it interactive for the user while suiting the clients needs - so I will be continuing to consult codecademy and other sources for prompts on how to get it looking the way I want it to.