Web代写 | COSC2413 Assignment 1

这个作业是用HTML5和CSS3完成一个俱乐部网页
COSC2413 Assignment 1

Tasks
Note: in order to proceed to higher parts, you must attempt or make a reasonable attempt on all of the specifications in
the lower part, you must not cherry pick specifications from various parts. As an example, make a reasonable attempt on
all of specifications in PA part before proceeding to CR part and so on.
PA part [20 marks]
Create a single PDF document, call its HCI_Analysis.pdf. No other name and format (.txt,.doc, etc.) will be
accepted. You will get a ZERO for this part for changing the name and format. Answer the following (tasks a-c) :
a. (3 marks) What kind of content should be placed in the main content area of the website to facilitate online
training of clients? How can the use of HTML5 and CSS3 help in authoring these features? Justify your answer
by providing examples. Be realistic in your answer as you will have to program these features as a part of
website creation. Your answer should not exceed 2-3 pages.
b. (5 marks) Suggest an alternative (to the one shown on page 2) layout for the website. You will need to draw a
well-labelled diagram of the new layout. Consider the features of HTML5 and CSS3 that might help in creation
of this layout. Analyse the layout considering the points such as: ease of use of the website, how user-friendly
the layout is? and is the layout easily editable or extensible in future (this is important as clients change their
needs, requirements and thought process and website layout needs to be altered for future versions). Your
answer should not exceed 1-2 page(s).
c. (2 marks) Some of the club committee members want the use of Flash and/or Silverlight features on the
website. The use of such techniques can lead to all sorts of usability issues. How will you address such issues
with the use of HTML5 and CSS3? Differentiate between the use of plugins and HTML5. You answer should not
exceed a page.
Using HTML5, CSS3 and JavaScript author the client-side website features. At this stage, you are to test the website for
Chrome browser only. You must always the HTML5 DTD for web pages:
It is your responsibility to add password protection to your website. A website url not protected by username and
password is exposed to others. Anyone can copy your code and as such lead to plagiarism related scenario.
Use of Boostrap and jQuery is NOT ALLOWED.
d. (5 marks) Create the layout suggested by you in task b with HTML5 and external CSS. Use of HTML tables and
readymade online templates is not allowed. You may use inline and/or embedded CSS but no marks will be
awarded for their use.
e. (3 marks) Once the layout is created, you must think of some sensible website content. Use the following as a
guide:
Homepage for club, call it as index.html. Do not add dummy text (lorem ipsum) add meaningful content.
Services page- this page will detail all the activities/services which the club runs (be creative a google search
will give you some ideas). You will need to also incorporate the need for clients who want to only do online
training via this page.
Page 4 of 6
Contact us page- this page must have the address, email (necessary field and the correct format of email is
required) and user query (necessary field) . Some people may prefer to call, some people may enquire via the
enquiry form. The form must perform validation via HTML5 and upon successful validation all queries must be
submitted to the admin email (admin@abcgym.com.au)
Sitemap and Privacy pages are not required for this assignment. Just leave these as text placeholders in the
Footer. These will be implemented for assignment 2.
f. (2 marks) Design a logo for the website using HTML5 and CSS3 only. You are not allowed to use an image or a
simple text for the logo.
CR part [8 marks]
g. (8 marks) Create a registration form using HTML5 and CSS box/grid layout properties, use of tables is not
allowed. Use JavaScript to perform client-side validation on the Registration form.
None of the validation(s) are to be performed via HTML5- ZERO for using HTML5 validation for this part.
You must write JavaScript code to perform validation. The code must display error messages located next to
any fields in error. Do not use alert dialog box. Use of Boostrap and jQuery is NOT ALLOWED.
The business analyst comes up with the following details for registration form:
Field Type Values JavaScript Validation
required
Notes
First name Textbox a compulsory field
Second
name
Textbox a compulsory field
Email Textbox a compulsory field;
must be in proper email
format
Use a robust
regular
expression to
validate email
field
Address Textarea An optional field
Referral Checkbox Yes or no a compulsory field Referred by a gym
member
Membership
type
Drop down
box
Individual, family a compulsory field
Age Range slider Must be 16 years and
above
Duration of
membership
Drop down
box
Ongoing, 3 months, 6
months or yearly
a compulsory field Ongoing is on
month to month
basis
The form does not submit to a server-side script at this stage. It is only meant for client-side validation.