Assignment - Version 2.1
e-Quals – Web site design – Level 3
Candidate Instructions Assignment -309 Version 2.1
Candidates are advised to read all instructions carefully before starting work and to check with your assessor, if necessary, to ensure that you have fully understood what is required.
You must, at all times, observe all relevant Health and Safety precautions.
Time allowed 8 hours
- Task A – 3 hours
- Task B – 4 hours
- Task C – 1 hour
Introduction
This assignment is broken down into 4 parts:
- A brief scenario is provided for candidates
- Task A requires candidates to produce a Terms of Reference document and plan for the development of a small web site
- Task B requires candidates to implement the web site from the Terms of Reference
- Task C requires candidates to test and evaluate the web site
Scenario
You work for Direct Computing a mail order company that sells computer equipment, games and applications software. As an employee of the company you have been asked to design a
web site to advertise the products.
The outline specification for the web site is listed below
- the web site must be frame based and consist of SEVEN web pages
- an index for the web site must remain on screen in the left frame. All other web pages to be displayed in the right frame
- the home page must contain information about the company its services, rollover buttons to link to each web page except the index page and an e-mail link for enquiries
- THREE web pages detailing information about computer equipment, games software and applications software. These web pages to contain appropriate graphical images and links to provide navigation to other web pages
- a search page linked to a supplied database with information presented in a dynamically generated response page
- a feedback page containing a form to collect data from the user
- every web page must have the same background image
- every web page presented in the right frame must have your name and the date the page was last updated at the bottom of the page, the company name, an animated GIF for the company logo at the top of the page and a link to the home page
The data in the supplied database is shown below.
| Stock Number |
Description |
Type |
Model Number |
Price |
In Stock |
| 125 |
Digitron Network Card |
Network Card |
D4533 |
£20.00 |
Yes |
| 142 |
Direct VM 403 21" Monitor |
Monitor |
F2367 |
£250.99 |
Yes |
| 153 |
Network Cable |
Cable |
R1382 |
£5.00 |
Yes |
| 155 |
Digitron Laser Printer |
Printer |
J8975 |
£159.99 |
Yes |
| 169 |
Datragrix Ink Jet Printer |
Printer |
H2315 |
£99.99 |
No |
| 176 |
Micra Computer |
Computer |
K8964 |
£799.99 |
Yes |
| 177 |
Empire Computer |
Computer |
H1735 |
£599.99 |
Yes |
| 198 |
Micra Network Card |
Network Card |
R6624 |
£15.99 |
No |
| 204 |
Micra Network Hub 4x100 Mb |
Hub |
M1457 |
£25.99 |
Yes |
| 259 |
ADC Network Card |
Network Card |
T6259 |
£25.99 |
No |
Task A
In this task you are required to produce the design and plan for the development of the web site.
- Produce a Terms of Reference document to include
- A statement of the problem
- A structure diagram to show the links between each page of the web site
- A style sheet detailing the properties/ attributes of headings, text and paragraphs and textual links (font, font style, font size, colour, paragraph indents, line spacing etc.) to be used throughout the web site.
- Sketches of each web page to include
- a brief explanation of the purpose of each page
- text required to be included for each page
- graphical images required specifying filenames and location
- link information
- production notes – background page colour and background image used
-
- Sketches of each rollover button annotated to show colours, captions, font, font style, font size and colour and the size of the buttons for the initial state and the rollover state
- Sketches for an animated GIF for the company logo, detailing the content of each frame within the animation and include animation settings such as looping and duration
- A list of the filenames, specifying the location and a brief description of the purpose of each file
- Produce a project plan for the incremental development of the web site detailing stages and timescales
- Ensure that your name is on all documentation and hand in the documentation for marking before continuing to the next task
Task B
In this task you are required to implement the web site you designed.
- Create a background effect to be used on all the web pages
- in a graphics editing package, load in the image that you have selected to use as the background
- manipulate the properties of the image so that it is suitable for this purpose
- save it in an appropriate file format
- open up a blank HTML page and use the image to set up the background
- test that the background will not make text difficult to read and modify the graphics as necessary
- use the background image on all the web pages
- Use graphic creation/ manipulation software to create
- TWO images for each rollover button, one for the initial state and one for the rollover state
- the images for each frame of the animated GIF for the company logo
- Using software appropriate for creating an animated GIF
- insert the images
- include an appropriate number of frames
- include appropriate animation settings to enable smooth transition between frames
- Use the defined style sheet to create a Cascading Style Sheet (CSS) file containing the styles to be used for all the web pages. Print out a copy of the CSS file.
- Use a Frameset with a vertical split so that the index for the site remains on screen in the left frame and all other web pages are displayed in the right frame.
- Create the home page containing information about the company, its services, rollover buttons to link to each web page except the index page and an e-mail link for enquiries.
- Create the THREE web pages detailing information about computer equipment, games software and applications software with graphical images and links to provide navigation
- Create the search page and link it to the supplied database with information presented in a dynamically generated response page.
- Create the feedback page containing a form to collect data from the user.
- Make sure each web page presented in the right frame has your name and the date the page was last updated at the bottom of the page, the company name, an animated GIF for the company logo at the top of the page and a link to the home page.
Task C
In this task you are required to test and evaluate the web site you created.
- Upload the web site to a web server
- Preview the web pages in TWO different browsers and check that all components appear as expected
- Check that all links work as specified in the design
- Check the response from the database is correct for the search criteria specified
- Check the form contents have been received in an appropriate format
- Print out the HTML code for all the web pages
- Produce an evaluation report to include the following
- an evaluation as to whether the web site satisfied the Terms of Reference
- any problems encountered when creating the web site and how they were resolved
- any improvements which could be made
- an outline plan for effective and periodic maintenance of the web site including implementing the improvements identified with an indication of timescales
Notes
- At the conclusion of this assignment, hand all paperwork and disks to the test supervisor
- Ensure that your name is on the disk (if using a floppy disk) and all documentation
- If the assignment is taken over more than one period, all floppy disks and paperwork must be returned to the test supervisor at the end of each sitting
|