Website Part V: The Evaluation and Other Stuff

Well this the summary post. If you look HERE you will see my original design and if you click HERE you will see the final version. As you can see there are not many differences but I am going to outline those few differences and explaint them. The final website is a much darker green than my simple design. This is because I thought the green I used for the design was too bright for my liking. The other reason for the change is because, well, I sort of forgot what green I had originaly used but I now do prefer the green I went with.
As you can see I scrapped the "title of the page the user is on" thing going underneath the banner. This was because I figured it would be more practical to just use a title on the page to display this rather then big letters underneath a banner. Finally the curves on my corners are a lot bigger than those on the design, thats because I was able to get better curves when I got to the final website. Below is the CSS I used to create my curved corners.

#topbar {
background-image:url(banner.gif);
width: 100%;
height: 150px;
background-repeat: no-repeat;
}
#footer {
background-image:url(bottombar.gif);
width: 100%;
height: 50px;
background-repeat: no-repeat;
text-align:center;
font-size:12px;
}

Now I will go onto the rest of my CSS. For the final website I used several CSS files instead of just one. I did this because I found it was easier to style each page that way especially as the contact page is so different to the other two. The reason I did seperate ones for the index and about page is simple. In the CSS file I used "auto" and when it came to the height on the index, because there was not a lot of content, it would shorten it to a very short length. I did not want a short height for my index and I wanted it to be slightly similar to the other two, longer pages. Therefore I just duplicated my CSS file and made the small change.

Right next would be the javascript. In This Post you can see the code for my form validation. I am very proud I got this to work because validation is important and alert windows make this easier. My code works by looking at the fields one by one, starting at the beginning. For example if the "Name" box was empty an alert message would appear. If it was filled then the validation would jump down to the "Email" box to check if that is filled. If that is filled then it would then check to see if the Email Address entered is valid. It does this by checking for an @ sign beyond the first character and then a . beyond the second character. If that is all good then it finally jumps down to the "Message" box and if that is filled then the form will be submitted.
However that is not the only javascript I used on my website. There is another bit.

function leaveConfirm() {
if (confirm("Clicking this link will direct you away from my website. \n\nDo you still wish to continue to my blog?")) {
window.location.href = "http://tomsaundersmpt.blogspot.com/";
}
return false;
}

This makes a pop up box appear asking the user if they are sure they want to visit my blog. This works after the user has clicked the blog button and that is when the alert appears. If the user clicks OK then they proceed to my blog however, if they click Cancel, the process will be cancelled and the user will be returned to the page they were just on. Thats about it for javascript, now onto what I think about the website.

Well to say I am proud is an understatement. This is my very first website that is officially on the internet! I am very happy to see it there. First all I believe that the best designs of things are those that are kept simple and I believe my website is as simple as it gets. It is a single coloured rounded rectangle with a few links, text and images on. I would have definitely liked to make it a bit more colourful and have more going on but I am happy with the simplicity of the design, as the saying goes, I believe it is "Simple yet Effective". I am also proud of my buttons I created allowing people to link up with me on Social Networking Sites. These were done simply in Photoshop with logos gotten off the internet. Usually I would not be proud of simple buttons but this is because I made them myself. I am of course proud of my Javascript, it took ages to complete but it all works a charm now. I love the fact I got my curved corners eventually. They took a lot of time but they are done and make the site look better than it would with square ones, I think so anyway. And finally I am pleased that my CSS turned out ok and everything works.
Of course there are some things I am not so happy with and if I had left more time I would have certainly implemented on my website. I would have liked to have made a more complicated form with more than three fields but I am content with it for now. I would have liked to done something more with more images like create a small gallary that uses Javascript. Finally I also would have liked to have added more content and to make the current content a little less predictable and standard.

However at the end of the day I am very proud with what I have achieved, hope everyone likes it. All thats left to do at the end of this monster post is post a link and advertise!

CLICK HERE

Enjoy!