Monday, 2 December 2013

Colour change

After completing most if not all of the structure work I have decided to look at the colour of my website in a lot more depth as I expressed in previous post I am still not happy with the colour of the website and so decided to have a play about with the layout of the colours just to see if that made any difference.
I started off with the background strip behind the masthead with this bright yellow colour as I felt that this bright colour at the top of the page would help to tell the people clicking onto this page the three colours in my colour palette: yellow, grey and white. Unfortunately after discussion with both my peers and my lecturer they agreed that this is the part of the website which didn't particularly work very well and so decided to have a look at what other colours would work and so tried lighter shades of yellow, darker shaded of yellow and then I tried white, which din't seem to make the background seem very appealing and so decided to go for a two tone effect by changing from white to grey and so looked at all the greys shades and seeing which seemed to work the best and so finally ended up with this style below.
I finished my website, to a point that I was happy with and then moved onto the poster and created several different versions and ended up creating a bright poster, I then went back to my website to see what information I had used on my website the Facebook, Twitter pages. I really like the use of different colours for the tag line and so I am going to use this style in both my poster and my website.
_________________________________________________________________________________



There were also other things that needed to be changed and also after changing the background strip it became apparent that the strong matching yellow background was too much for your eyes to take in, with just one look and so to tone it down I decided to add a background behind the text so that the yellow wasn't so strong looking on the page. I again flicked between what colour to use behind the text but felt that by using the grey for the background strip it would work well for behind the text also. Once seeing the effects after changing the colour and still keeping the yellow behind it made more sense and it also made the text stand out a lot more as the colours made the text easy to read.


I have changed the background for the background so that instead of a bold yellow there is a grey on grey combination and then I will use yellow at specific features on the website the reason why I have chosen to only use yellow in certain areas of my website is because I felt that yellow was such a bold colour and by using yellow in the whole website there would be know effect of using it as there would be know feature colour sections and so decided to change the colour to follow this theme.



This is the new and improved look of my website because after looking at other competitors of my newspaper products I noticed that the colours I would have been using would not appeal to my audience and when you look at other newspapers you can see the running theme of other newspapers running through and realised that I was not following the conventions of the newspaper for the website and so decided to totally re-work the look of my website and I wanted to include the parts of my there products into my website and as  it is already conventional to use the same article on your newspaper as your website along with other media products I decided to add the same colours and style as my poster as I felt that my poster product looked really professional and I wanted the professional element to be a running style throughout my products and so decided to add the coloured text from my poster and place them on the side masthead.
As well as the side additions I decided that the way in which I had the masthead featured it wasn't making the most of the space and more than anything it was wasting space and so after feedback I got recommended to go to the BBC's website: http://www.bbc.co.uk/news/ and use their layout for the masthead and so I went to work and moved the text and image into an appropriate place. I used the sam e Times New Roman font however this time I used blue for the colour and decided to make the text a lot bigger so that it would fit the space better. I felt that when placing this text on the website it would be easier to use if it was a image and so took a screenshot of the text and then placed the image on the top of the website. I then changed the colouring of the masthead so that the bridge was blue the background was white and I left the colour of the road as black. I then started to experiment on where the masthead should go and felt that the masthead for the BBC used the masthead however they positioned it so that only part of it was showing and this is a good idea as you still get to see what the masthead is however the space is being used effectively. So when experimenting I positioned it in the same way the BBC has done and partially covered the top and bottom of the masthead, this looked good however with the strong colours of the masthead image and the masthead text it was hard to focus on one of them as they seemed to be fighting for attention and so it was recommended to me to lower the opacity of the image, which is something I done on Photoshop and then placed the image onto WIX after turning the opacity down. Once I had turned the opacity down I felt that the masthead images still wasn't making the most of the space and so I experimented and flipped the image so that the image was facing the opposite way using the editing equipment on wix.com:
I still like the idea of using different coloured font for the home page, news and what's happening pages and so decided to place them back in, I also needed to change the colour scheme for the rest of the website and so needed to change the colours and so right clicked over the titles, clicked onto Change Style, click edit style next to the button lab led Button Menu  and a box will appear and this is where I changed the different options so that certain colours would appear once the button had been hovered over or pressed etc. I decided to use the same blue colour as the masthead text so there was a continuity of colour throughout. Once I was happy with the choices I clicked onto the OK button to see how the new button changes would work in action and so clicked onto the preview button to see how the live website would work with my audience. 





After sorting the top half of the website out I needed to make a start on the rest of it and so decided to add a pastel blue colour for the background the main story, I then added another box for just the text and the reason for doing this is to reinforce the colour theme for the website.



I went to the side option and clicked onto the plus icon, clicked onto Shapes & Lines and then clicked onto Box and chose the colouring that fits with my colour scheme.


I then moved onto the rest of the articles and I decided I needed to go for a more professional look and so made it look very plain and sleek and the only colouring was for the sub-titles for the articles, the colour is the same colour as the text masthead and again I want to use only a small amount of this colour so that when it is used people recognise this as being the colour palette for the website. 
The colouring for the advertisement was not changed too heavily as I don't want to use the blue colour from the colour palette although I have created this I don't want my audience to think that this is another story and so I have changed the layout of the advert, used two images and have used a different colour for the background of the article. The reason why I have chosen to use this yellow colour is because I felt the colouring although not the colours used in my colour scheme I felt that because I am using a mixture of colours for the top beside the masthead this colours fits in well and I didn't want to use a random colour just so it was different I want it to fit in with the styling of my website.
Again I have not changed the information part at the bottom as the colours I used previously have been reused in this new colour scheme and so it fits in well and looking at this part of the website i feel that it fits in well and I feel that this feature looks very professional as well as letting my audience know more information.



No comments:

Post a Comment