Because the images I had already saved for the website were using blue I needed to go back through them and re-do the images to match each pages colour combination.
As you can see below, the muted colours are definitely looking better already.
I also went through to the other pages (see two below) and edited their colours to match each of the buttons, I feel as though uses of different muted colours stops the pages from being too dull and cream/beige neutral looking.
I managed to create the buttons on the top left but I had some difficulty actually ensuring each of them were a different colour. So therefore I had to do a little bit of searching online to ensure that each of them were a different colour.
("Important" command for each of the classes)
The image above indicates how each of the classes (buttons) has its own colour, the "important" part commands that this colour must be used because the computer wants to automatically change all the buttons to the same colour.
I am quite pleased with my progress so far as I have been able to adjust the code quite confidently from learning using code academy and w3 schools. However the texture I have used on the buttons doesn't make them as vibrant as they were on photoshop so I think I am going to experiment with different textures or even possibly lighten the colours to stop the page appearing extremely dark.
I tried some different textures to see if it would lighten the buttons:
After experimenting it isn't the end result I was hoping for but it is much better than how it started, I think perhaps colours and layering work much quicker and more capabilities in photoshop than dreamweaver actually allows because I had initially saved the colour and then added a "soft light" overlay which makes the colours vibrant. I also need to edit the images again such as the diet page:
Now the colours match after editing on photoshop which look much better visually with the navigation bar.
No comments:
Post a Comment