Website Link and Reflection

Here is the link to my final website:

https://gpvisuals.neocities.org

As a result of this assignment, I have learned that organisation is key. Whether it be correctly labelling all your divs or properly organising your files – this can seriously save you from a headache in the end. I also learned that it is very important to keep things simple because simplicity is usually the most usable and attractive. I decided to keep my design rather minimal with a black, white, and grey colour scheme, and to not “overload” it with content. I feel as though this decision was successful and I enjoy its minimalist character.

The key technical obstacles I encountered were always the littlest things! Minor problems such as difficulty centring/aligning items or linking other pages or websites. To overcome these small things, I would search online and usually ended up finding a solution. Once I found a solution, I could then understand and avoid the problem in the future. I feel as though I am extra careful now when checking for what the problem could be – I am consistently checking certain things such as if the spelling is correct and if divs are closed so I can avoid tiny problems later on. Other obstacles I encountered were larger more challenging actions such as javascript to create a slideshow of the images and other fancier effects. Again, I carefully search online or watch tutorials to overcome and learn something new. It is through a lot of trial and error that I have become more skilled at creating a website.

If I had another opportunity to complete this assignment, I would have started much earlier so I could cover the basics and then have a lot more time to create a more intriguing and interactive design. I felt as though I spent a lot of time learning the basics and wish I had more time to make it awesome. Now I know that creating a website requires a lot of time and energy, and is definitely not something that should be left until the last minute. If I had another opportunity, I would have also made sure to have my original content more organised and developed beforehand. I have learned how content is the most important part of the website.

What a learning process this was! I can say that I feel much more confident now in HTML and CSS. After spending so much time on this website, I actually began to enjoy the process and seeing it all come together. It is very rewarding to know I have made something and that it is now functioning and online.

Below are some screenshots of the finished website.

Enjoy!

 

This slideshow requires JavaScript.

Browser Test Report

I tested my website out across Chrome, Safari, and Firefox. I found that the website was very similar across all these browsers.

One thing I noticed when I first opened it in Firefox was that the Nav bar links were blue, instead of white like I had originally made them. However, after I clicked on them and arrived at different webpages, this problem disappeared and the links were exactly like the other browsers had displayed them.

In general, the alignment remained consistent throughout the browser testing. Hovering and overlay effects continued to work and the links continued to direct me to the appropriate webpage.

Chrome:

chrome

 

Firefox:

firefox

Safari:

safari

 

Here’s just an example of the comparison between the colour of the links in different browsers. I noticed there appears to be a different colour of blue. This is Firefox and Chrome.

insta_compare.jpg

Validation

I have finally validated my website to the point of no errors. I realised that I had a few styling codes in html, so I had to change it to CSS. I also found a few stray closed divs that were not necessary so I deleted them. I learned how important it is to validate my website because there may have been errors I would have never found.

Here you will find the screenshots of my validation results including both HTML and CSS.