Web Site Assignments - Abingdon Computing Essentials, Rotorua
The first five of the following websites are the result of assignments undertaken in the Diploma in Web Mastery I am currently studying at Waiariki Institute of Technology.
Semester 1, 2009 - Abingdon Computing Essentials, Rotorua
Each of the first three have the same Hyper Text Markup Language (HTML) code and as a major portion of the assignment, we were not permitted to alter the HTML code. To attain the differences we were instructed only to use Cascading Style Sheets (CSS) code and to use images that would not breach any copyright. In each case I have used pictures taken by me, or with me in them.
For each of the sites it was important that they fitted neatly on a screen with the resolution set at 1024 x 768. For that reason all the sites have been been set to meet that requirement and have "internal" scroll bars where needed.
This was an interesting assignment and required a lot of thought and some carefull planning. Now the assignment is over, I have amended the footer in each case to link back to my Abingdon Computing Essentials site.
The fourth and later the fifth, websites were really a step up from the previous ones.
Semester 2, 2009 - Abingdon Computing Essentials, Rotorua
The fifth was a group project and took several weeks to complete.
Real Commercial Work - Abingdon Computing Essentials, Rotorua
Paul Adlam, owner of Screw Productions in Rotorua, needed his site updated and new data to be placed in it. This work initially involved converting a site built several years ago using tables into a site using current techniques and meeting todays standards. Paul also wanted the abilty to add or amend data on the site. This was achieved by taking his in-house Word documents, converting them to PDF format and using links to them.
Semester 1, 2009 - Abingdon Computing Essentials, Rotorua
Formula 5000 - Abingdon Computing Essentials, Rotorua
Although I had been trying things out before, this was my first "real" website.
As this was new to me, I made the F5000 heading using WordArt, saved the file into MS Word, then copied it as an image.
The background came from an overhead picture of one of the race cars on the pit lane. I cut a strip of the tarmac, white lines, concrete and dropped this into a graphics program. The final effect was achieved by turning the cut image 90 degrees and altering the portions to suit.
All of the smaller images were cut from pictures taken on the race day at Taupo. This was the largest collection of F5000 cars seen anywhere in the world for the last 30 years!
Click here to visit my F5000 site
Milford Sound - Abingdon Computing Essentials, Rotorua
This site is hopefully an improvement on the previous site.
The background colour is taken from the green on the bus seen in the first image in the Gallery. The heading for each page is sliced from a picture of the boat that took us out into Milford Sound. The background for both the website and browser are set to the same, so the green colour will seamlessly fill the screen on screens with a larger resolution the 1024 x 768.
Click here to visit my Milford Sound site
Hotair Ballooning - Abingdon Computing Essentials, Rotorua
By now I was getting to grips with CSS a bit better and made several changes to this site.
The background browser image is of clouds I had taken from an aircraft. The website background image is looking inside a partially inflated hotair balloon and then lightened up in a graphics program. The heading was made the same way as in the F5000 site using WordArt.
A big improvement here was in the "roll over" effect in the navigation buttons - they are all done using only CSS, no Javascript here! These buttons took a while to sort, but I feel the effort was worthwhile.
If you haven't taken a balloon ride yet - put it on your Bucket List.
Click here to visit my Hotair Ballooning site
Cockington Green - Abingdon Computing Essentials, Rotorua
This site was a free choice but had to adhere to all the HTML, CSS and copyright rules we had been taught. Once completed the coding had to be checked by the online web site at http://validator.w3.org/ and http://jigsaw.w3.org/css-validator/ for full code compliance.
The browser backgound is of the roof tiles taken from one of the houses, straightend up and then lightened so as not to be overpowering. The heading was an attempt to match the sign writing used by Cockington Green - spot it on the side of the Mini Van on the Home page.
At the top of the Navigation section, I have used some Javascript to read the date and time from your computer and display these. This is static and will only update when you refresh the page - press F5 to make this happen. The small people images at the base of the Navigation section are just cropped from larger images. Nothing tricky here.
The Gallery is interesting in that I have used Javascript to display each of the images. By doing this each image is only loaded at the time it is called for, so the page loads reasonably fast even on dialup. The shaded border around the images has two different colours and these make the shading effect.
The Information page has a form with several parts to it. It has regular text fields into which you would type data. There is a drop down list box to select only one of the options and a further option using radio buttons to again select only one of the offered options.
The Links page initially could be a bit of a mystery - try moving your mouse around the house image and watch the mouse pointer turn to a hand. There are nine hotspots in the image and all take you to a different website.
Click here to visit my Cockington Green site
Semester 2, 2009 - Abingdon Computing Essentials, Rotorua
Millennium Architecture - Abingdon Computing Essentials, Rotorua
This was a group project with three of us involved. The brief was to create a site using a commercial client that met all the standards taught during the year. The idea was that eventually the site could go live. A great deal of work went into the creation of the site and we surely learnt the meaning of time management.
Angela dealt to the admin and client contact work, Espie concentrated on the design and layout of the site and I had the task of coding from the design prototype images. Hence the "Design by AWE Productions".
To keep the site down to a manageable size, we restricted ourselves to only four images per client. Using a feature know as Lightbox, the images can easily be scrolled through without the distraction of other images and text visible in the background.
The site went live in January 2011.
Click here to visit our Millennium Archeitecture site
Real Commercial Work - Abingdon Computing Essentials, Rotorua
Screw Productions - Abingdon Computing Essentials, Rotorua
This work initially involved converting a live commercial site built several years ago using tables into a site using current techniques, CSS and meeting todays standards. Paul also needed the abilty to add or amend data on his site. This was achieved by taking his usual in-house Word documents, converting them to PDF format and using links to them.
The site currently has 16 pages and with each page having a Menu, so any change to the menu had meant altering all 16 pages. This work has been radically reduced by using the web function of Includes. The short answer here is that the menu is now on its own page and is called into the page currently seen in the browser. Any changes to the menu now only need to be made on the menu page.
The work also involved copying images of each screw into a graphics program and saving them to be used as illustrations on the 10 Products pages.
Click here to visit the Screw Productions site
Anmacalro Worm Farm - Abingdon Computing Essentials, Rotorua
Hamish has had his worm farm going for a bit over 20 years and decided it was time to let folks know of the benifits of using worms and their organic by-products.
Included on the website are many great tips on how to get started, things to do and a section on things not to do with worms. Take a wander through the site and who knows, you may get interested in starting your own backyard recylcing.
This website went live at the beginning of 2010.
Click here to visit the Anmacalro Worm Farm site
