Jan 3 - Homepage Modification

Due to the time I needed to spend on revising for my mock exams, I didn't have time to work on my ICT coursework. However, today, I continued to modify the homepage of me and my clients website. First of all, me and my client found an image on the internet to use as a background: http://images2.alphacoders.com/564/56492.jpg. To put this image onto my website, I changed the body code in css to use an image for the background:

The background color has been changed to background-image, and I saved this file as a different name so I can keep both variations of the modified homepage.


I then showed both designs to my client, and we both agreed that the plain background would be better, since we agreed the design looked too 'confusing' and 'jumbled'. However, after looking at other images that could be used as a background, we stumbled upon this image that would look good as a background: http://th00.deviantart.net/fs29/PRE/f/2008/061/8/8/Background_for_my_Website_by_aisu_isme.png. This website background has a simple background and also looks simple. Compared to the graffiti background, it looks alot better. Here is a comparison:

Me and my client agreed that if we used this graffiti image as a background, it might not let the user see those buttons on the bottom clearly.

Instead, we came upon this image that blends both black and white as the background while finding an alternative background. We agreed that this image looks alot better and we decided to use it for our website. However, there was a slight error when I added this image to the website. The image would repeat itself since it isnt wide enough, as seen by the far right of the webpage. In order to prevent this, I would need to set the width of the background image. To do this, I added an attribute to the code:

I added the background-size attribute to make the image fit the website size, no matter what monitor size is used to view the website. This fixes the overlapping of the image and now the website looks like this:

The website is now alot more visually appealing than our previous edit of the homepage. I will continue to work on other parts of the website soon, to transfer this style into other sections of the website.