Web Page With Static Page Layout
Assignment 2: Web page with static page layout
Unit: DGTL11005 Web Design, 2019 Term 1
Due date: 9:00 pm AEST, Friday of Week 9
This assessment item relates to the unit learning outcomes 1, 2, 3, 4 and 5, as stated in the unit profile.
You are required to design and build a single web page that provides information about a specific paid
occupation for school students who are seeking information about jobs. The web page must be
implemented using HTML5 and CSS code, and it must have a static layout with a fixed width of 960
pixels. No front-end web frameworks such as Bootstrap may be used to build your solution because
the web page should demonstrate your own mastery of HTML and CSS.
Purpose and target audience
The purpose of the web page is to provide information about a specific paid occupation for school
students who are seeking information about jobs. The particular occupation used as the theme of the
web page is your decision, but it must be a paid occupation—either full-time or part-time—and it
must be something specific. Unpaid occupations such as student, housewife, househusband, and
volunteer worker are not suitable occupations for this assignment. Here are some examples of
acceptable occupations: computer technician, chef, restaurant manager, taxi cab driver, engineer,
office administrator. Note that these are examples only. Consider building a web page about the
occupation of someone you know to make the process of gathering content more convenient.
The theme of the web page should not be a specific business or organization associated with your
chosen occupation. For example, the web page may be about accountants, but not about a particular
The content of the web page should address topics that will be of interest to school students who want
to learn more about that occupation. For example, a web page about computer technicians could
include descriptions and photos of necessary skills, desirable personal attributes, typical tasks that are
performed on the job, sources of education and training, employment opportunities, comments from
people in that position, and links to relevant web sites. Note that these are suggestions only. The
content of the web page should be genuine and accurate. Do not include fictitious information.
No word-limits apply to the information presented on the page, but try to ensure that the amount of
content is appropriate i.e. not too little and not too much.
The design of the web page should be appropriate for the chosen occupation. For example, a web page
about restaurant managers might use design elements that suit a restaurant theme. A web page about
office administrators might use design elements that suit an office theme. Think about the
distinguishing characteristics and work environment of your chosen occupation. Choose images,
fonts, colours, line, shapes, textures and other design elements that suit this theme.
The website should consist of a single page, not multiple pages, so no navigation menus are required.
Static page layout required
The web page must have a static layout with a fixed width of 960 pixels. The page layout should
conform to the 960 grid system, which is described in Study Guide module 3. The grid provides a
structure upon which blocks of text, images and other page elements can be positioned in an orderly
way. You may not use front-end web frameworks such as Bootstrap or Foundation in your solution
because the web page should demonstrate your own mastery of HTML and CSS.
Original content required
No content (text, photographs, illustrations, etc) will be supplied to you for this assignment. You must
produce your own content for the website, using the design brief as a guide. This may involve
activities such as conducting research, writing text, taking photographs, or editing images.
You must own the copyright in any images (photographs, illustrations, animations, etc) that you use in
your website. In others words, you are restricted to using images that you have created yourself from
scratch. You may not use clip-art or royalty-free images. You may not download someone else’s
image from the Web. You may not scan someone else’s image from a printed publication. You may
not capture a screenshot from software that someone else has created. You may not take someone
else’s image and alter it to create a new image.
The text in your website should be suitable for the intended purpose and target audience. You must
own the copyright in the text that you use in your website. In other words, you are required to write
the text yourself. If you need to quote, paraphrase or summaries the words of another author for some
reason (e.g. to substantiate your statements), references must be provided in small type at the foot of
the web page. The prescribed referencing system for this unit is the Harvard system, which is also
known as the author-date system or the name-year system. An Abridged Guide to the Harvard
Referencing Style can be downloaded from the following address:
The following technical constraints apply to this assignment.
• You are encouraged to build your website with Dreamweaver, but almost any plain text editor,
HTML editor or web authoring software may be used.
• You are encouraged to create your images with Photoshop, but almost any image-editing software
may be used.
• Your website should display correctly in the latest versions of Mozilla Firefox and Google
Chrome on a PC. Your target screen resolution is 1024 768 pixels, but ensure that your page
design also looks good on screens with a higher resolution (e.g. 1280 1024 pixels).
• Your website must be constructed with HTML5 and CSS, not other technologies.
• Your website must use a linked external CSS file to control the appearance of the text and the
layout of the pages.
• Your website must not be built from a template such as a Dreamweaver template. It is acceptable
to study existing web pages, templates and other sources for ideas, but the code and content in
your assignment solution must be your own. As a general guide, you should be able to explain the
https://www.cqu.edu.au/student-life/services-and-facilites/referencing workings of any HTML or CSS code that appears in your website. If you don’t know what an HTML tag or CSS property does, then you shouldn’t use it in your solution.
• Your website must not contain any audio clips, video clips or other elements that require browser
• You are not required to upload your website to a web server. Your website must not contain any
server-side scripts such as CGI, PHP, ASP or ColdFusion code. It should be possible for the
marker to view your website from the submitted files without connecting to the Internet.
• The files that make up your website must come to a total of no more than 3 MB, and may be
considerably smaller. If your files exceed that limit, you should reduce the size of your image
files. Use your image-editing software to reduce the bit depth or dimensions of your images while
preserving image quality.
After creating your web page, write a report that explains your design choices. The report should be
prepared as a Microsoft Word document with a professional appearance. Use left-justified alignment
for the text. Provide a heading for each section. Check your spelling. grammar and punctuation before
submitting the assignment. Ideally, have someone else proof-read your assignment.
The length of the report should be between 600 and 800 words. The word count is considered to be
from the first word of the introduction to the last word of the conclusion. It includes in-text citations
and direct quotations. It excludes any title page, abstract, table of contents, list of references or
appendices. No abstract, table of contents or appendices are required for this report.
The report should have a title page that displays the unit code, the unit name, the assignment number,
the assignment name, the assignment due date, your student number, your name, and the word count.
Microsoft Word has a feature for counting the number of words in a document.
The following outline explains how to structure your report. It lists the headings for each of the
sections of your report. Each section should answer the questions that are provided in a narrative
style, not a question-and-answer format. Do not include the questions in your report.
Tell the reader that this report will explain the design choices you made for the web page.
What fonts did you use in your web page, and how did your choices enhance the design?
What color scheme did you use in your web page, and how did your choices enhance the design?
What images did you use in your web page, and how did your choices enhance the design?
What page layout principles did you use in your web page, and how did your choices enhance the
Provide a list of references to any works that are cited in your report, such as books, journals,
periodicals, newspapers and websites. References must be provided whenever you quote, paraphrase
or summaries the work of another author. You might not have any references since this report is
primarily reflective and does not involve research. This section may be omitted if you have no
The prescribed referencing system for this unit is the Harvard system, which is also known as the
author-date system or the name-year system. An Abridged Guide to the Harvard Referencing Style
can be downloaded from the following address:
There are two parts to the Harvard system of referencing:
(1) citing the author and date in the text or main body of your writing; and
(2) referencing the source of the information in the reference list at the end of the assignment. Read the first part of the referencing guide carefully to ensure that you understand how to perform both of these steps correctly.