HOLMES
INSTITUTE
FACULTY OF
HIGHER
EDUCATION
UNDERGRADUATE
PROGRAM
Assessment Details and Submission Guidelines
Trimester T2 2019
Unit Code HS1021
Unit Title Web Design
Assessment Type Individual Assignment
Assessment Title Web Site Project
Purpose of the
assessment (with ULO Mapping) You are a member of a design team at Holmes Media Design, a premier web design and multimedia design firm in Melbourne area. Recently, several local firms have approached Holmes Media Design with requests for websites. Students will be able to:
1. Understand basic concepts and principles underlying the Internet, World Wide Web, and Web design
2. Define, interpret and evaluate different Internet, web architecture, standards and applications
3. Apply web-programming skills to develop web systems.
4. Solve business problems related to World Wide Web, and Web design
5. Design a web system by considering business need and context of the systems.
Weight 10% of the total assessments
Total Marks 10
Word limit 1000-1500 words
Due Date Week 07
Submission Guidelines • All work must be submitted on Blackboard by the due date along with a completed Assignment Cover Page.
• The assignment must be in MS Word format, 1.5 spacing, 11-pt Calibri (Body) font and 2 cm margins on all four sides of your page with appropriate section headings.
• Reference sources must be cited in the text of the report, and listed appropriately at the end in a reference list using Harvard or IEEE referencing style.
Assignment 1 Specification
Purpose: this individual assignment provides students with an opportunity to practice techniques and skills involved in designing webpages using HTML5 and CSS. To design, develop, and publish a web site using recommended design practices. Your Project will demonstrate mastery of the web development skills and concepts learned in this course. You are a member of a design team at Holmes Media Design, a premier web design and multimedia design firm in Melbourne area. Recently, several local firms have approached Holmes Media Design with requests for websites development. The new clients are:
• Le Expensziv -- a new gourmet French restaurant offering wonderfully delicious food and extravagant prices
• A Pet’s Life -- a company that offers animal grooming, training, daycare, and vacation boarding services to the greater Melbourne area
• Coffee Cafe -- a locally owned coffee bar similar to Hudson located in the Melbourne CBD neighborhood
• Baby Time -- a small, upscale shop in Chadstone shopping center specializing in clothes, toys, and accessories for infants and toddlers
• CDA -- a new accounting firm just formed by three recent accounting major graduates with CPAs, specializing in small business and tax accounting
PLEASE NOTE:
You are required to publish your web on the Internet. Start looking NOW for your Ad Free host (project must be hosted on a Ad Free host). There are many sites on the web that offer ad free web site hosting. Try searching for some on your own or check out Ad Free Web Site Hosting (Resources Ad Free Web Site Hosting) to get you started.
The project must be your own design and be completed by you — the use of free or purchased web site templates are not permitted (for example, those found in Dreamweaver, purchased or free, blog or social networking templates such as Drupal, WordPress, Blogger, Facebook as well as the textbook's Case Study Lab). If it is perceived that a web template has been used, the project grade will be no higher than -below average- (D).
Students sometimes wonder about what a -page- should contain. The answer is that to count as a -page- in your web project, a web document must be designed in a manner consistent with your site and contain content of value that includes text and images. Web page documents that have little or no content of value to your intended audience or consist only of an image or a PDF will NOT be counted as a -page-.
Assignment Requirements:
The assignment requires that you develop a website for one of the listed clients. The director of the chosen business is interested in developing a website that effectively communicate to a target audience. You will build a website with content of your client choosing. You must have the elements listed in the assignment in order to receive good marks for this project.
Milestones
• Topic Approval (must be approved before moving on to other milestones)
• Planning Analysis Sheet
• Site Map
• Wireframe
• Project Update Meeting (weeks 4 & 6)
• Publish Project
Web Site Topic Approval: Your instructor must approve the topic of your web site. Once approved, prepare a one-word document page discussing the following:
• What is the purpose of the site?
• What do you want the web site to accomplish?
• Who is your intended audience?
• What opportunity, problem, or issue is your site addressing?
• What type of content might be included in your site?
• List at least two related or similar sites found on the Web.
Planning Analysis Sheet: Using a word processor, write a one-page Planning Analysis Sheet that includes the following:
• Web Site Goal o Describe the goal of your web site in one or two sentences.
• What results do I want to see? o List the working title of each page on your web.
• What information do I need?
o List where you will obtain the content (facts, text, graphics, sounds, video) for the web pages you listed above.
• How will your project use a form?
o Describe how you plan to use a form in your project to collect information — examples of using a form might be to offer feedback, provide a survey or poll, offer subscriptions to a newsletter, etc.
Site Map: Using a word processor, PowerPoint, or ruler and pencil, draw a flowchart (storyboard) of your web site that shows the hierarchy of pages and relationships between the pages.
Project Update Meetings: You should have at least three pages of your site completed by week 4. If you have not done so already, your instructor will help you to publish your pages to your web site. Unless prior arrangements to meet are made, the Project Update Meetings will be held during class lab time. Bring the following items to discuss with and hand in to your instructor:
• The URL of your web site.
• The source files of your web pages and images • A sketch of your page(s) that will utilize a table. • Your Site Map (revise as needed).
Publish & Discuss Project: Finish publishing your project to your web site. Be prepared to show your web site to the class, explaining the purpose behind each page / group of pages.
Required Website Contents
Project MUST contain (at minimum)
• One (1) home page and four (4) content pages
• Each page must contain appropriate text and images that provide information and value to the target audience
• Each page must contain appropriate page titles
• One (1) video (you are not required to create the video, there are many sharable videos on the Web – chose one that is relevant to your project
• One (1) e-mail link
• One (1) external link
• Each page must contain appropriate meta tags
• One (1) external style sheet (CSS) which contains a minimum of six (6) styles
Home Page: A homepage is the introductory page of a website that usually acts as a table of contents for the site, its history, menu, location, available types of products, etc. Feel free to refer to real-world stores websites for example. Information about at least three types of products must be provided; with at least three original or explicitly referenced images. On this page, you should have access to the basic information that is found on your site.
Webpage Layout:
You need to design an appropriate webpage layout for your client. Following structural elements must be used, Include the following elements:
• Header & footer
• Navigation, list (ordered or unordered), links
• Section, headings, paragraphs, DIVs
• Images
FOUR HTML5 pages, include the following elements:
• Header & footer
• Navigation, list (ordered or unordered), links (internal & external including “mailto”)
• Section, headings, paragraphs, DIVs, id, class
• Images, font, colour, background
• Block, inline, sizing, border, padding, margin
• table, form, nested navigation, background image
• CSS 3 syntax and styles
• Position (include absolute), float
• Design the necessary dynamic component on the pages
CSS Files
At least one CSS file is to be created to style all HTML pages. Use any CSS properties you deem necessary and appropriate for the presentation. The following CSS properties can be used:
• color
• font-family
• background-color
• background-image
• border • text-shadow
• box-shadow
• margin
• padding
• float
The following types of CSS selectors must be used:
• element e.g., h1 {}, p {}
• class, e.g., .image {}, .highlighted {}
• id e.g., #tbName {}
• grouping e.g., h1, h2, h3 {}
• contextual e.g., ul li {}
• pseudo-classes e.g., :hover {}
Popular browsers and mobile devices must render each page. Your web site project will be evaluated on the following criteria:
• Project Milestones,
• Including all required web page elements,
• Following recommended web site design practices,
• Visual appeal of site, and
• Accomplishment of project's objectives.
Submission Requirements:
Please submit the following:
• A topic approval (submitted in week 2 as well as included in the final submission)
• A one-page planning analysis sheet (included in the final submission only)
• Site map (submitted in class in week 4 as well as included in the final submission)
• Please submit a web site that contains a home page and at least four content pages. A URL is preferred. A zipped folder is also acceptable.
Marking Rubric
Marking Criteria
Outstanding 2 Average 1 Needs Improvement
0 Score
Publish to the
Web Required pages are published to the Web and provide content of value to target audience. Published but required pages only partially provide content of value the target audience. Not Published or many required pages do not provide content of value to target audience.
Purpose Clearly stated Unclear Missing
Target Audience Demographics clearly described (age, gender, education, socio-economic) Generally described adequately Missing
Visual Appeal Use of color, contrast, text, graphics is appealing to target audience Appealing to target audience in all but one area. Not appealing to target audience in more than one area
Class Presentation:
Organization Presentation is coherent and organized Presentation could be more organized Presentation is not well organized
Class Presentation:
Purpose &
Design Clearly and completely described purpose and design issues (color, layout, etc.) of the pages. Description of purpose and design issues could have been more complete or more clear.. Description of purpose and design issues was missing or the student read pages aloud word-for-word.
Class Presentation:
Project
Challenges Clearly and completely discussed challenges encountered and overcome Incompletely or unclearly described challenges encountered and overcome Did not discuss challenges encountered and overcome
Class Presentation:
Participation The student was actively engaged during the discussion of each project — noted web design best practices, suggested areas for improvement, and/or asked pertinent questions. -- The student did not attend class or was not actively engaged during the discussion of each project.
Navigation Easy to use, consistent Inconsistent or difficult to use Missing
Accessibility W3C Guidelines followed Two or fewer instances where W3C guidelines are not followed Three or more instances where W3C guidelines are not followed
Page Titles/ Logo Area -- Descriptive and include the site/company name Missing or do not include the site/company name
Table -- Correct syntax Missing or incorrect syntax
Graphics -- Correct syntax Missing or incorrect syntax
Video -- Correct syntax Missing or incorrect syntax
E-mail Link -- Correct syntax Missing or incorrect syntax
Outside Link -- Correct syntax Missing or incorrect syntax
Meta tag Correct syntax (description meta tags), excellent selection of keywords and meaningful description Correct syntax (description meta tags), adequate selection of keywords and description Missing or incorrect syntax
Form Coding Correct syntax, meaningful form element names Correct syntax Missing
XHTML
Validation Required number of pages pass Less than the required number of pages pass No pages pass
CSS Validation External CSS file is present and passes validation External CSS file is present but does not pass validation External CSS file is not present or does not pass validation
TOTAL /40
/10
GET ANSWERS / LIVE CHAT