What Is HTML used for and what it consists of? What is CSS used for? What are the benefits of using it? What is the best way to use it?

INSTRUCTIONS TO CANDIDATES

ANSWER ALL QUESTIONS

Web Technologies

Referred Coursework Assignment

The referred coursework is an individual assignment. It comes in two parts. Part one contains a set of questions and part 2 requires you to build a web application for the case study provided, mainly using HTML, CSS, PHP and JavaScript.

You need to submit a single report to Moodle and give a demonstration of the application to your tutor.

Part 1 (one page long) – it is worth 20%

1. What Is HTML used for and what it consists of?
2. What is CSS used for? What are the benefits of using it? What is the best way to use it?
3. What is Responsive design? What do we use to achieve it?
4. What is DOM? In what way can it be utilised?
5. What do we mean by ‘accessibility’ in relation to web development?

Part 2 – is worth 80%

This part consists of building, and documenting the process of building, a website/web application using the case study at the end of this document.

Assessed Elements

The web site/application must have at least 4 pages. In general, these pages will correspond to HTML files, although in certain advanced cases alternative structure will be considered. These pages must be linked together in a logical way with a well-designed navigational approach.  As you are developing a web application, in addition to appropriate content there has to be some interactive features / elements within your website/application. It is expected that…

• You develop a template, then use this template to develop pages for your site (main area of each page can be different in structure).
• Home page can be different in structure from the template (succinct introduction to the site; appealing appearance)
• There has to be a logical separation of the topic into pages
• Use JavaScript for appropriate features
• Use PHP for appropriate features

Where possible and appropriate, images, video and audio should be used.

Deliverables

1. Development report (60%)

The aim of the report is to detail the work you have done. This report should explain what and how you have achieved the required in your web application. The following sections are required and must be included in your report.

Part 1: Web site/application requirements (5%)

This section should also include brief explanation of what is going to be developed, what features will be included, a site map and appropriate sketches of your pages.

Part 2: HTML and Site Structure Documentation (20%)

You should describe the structure of your site including:

• how you have chosen to organise the information it contains and why
• how you have structured the actual data - typically the links between the various pages, but also any advanced structuring using dynamically loaded content or layers should also be described here
• how your files are organised on the server - where you store your images, styles and scripts, and why you chose to do it that way
• Semantic Mark-up - You should explicitly indicate where you have used semantic mark-up and in each case give your reasoning for the way you have used it.
• Included Media - You should indicate where you have included media files using HTML5 tags to embed them and explain how they work.

Describe the structure of the site, do not include styling as it should be in the second part of the report, however, some screen shots of html code of the site with no styling might be useful in describing the structure.

Part 3: CSS Documentation (20%)

You should describe your main look and feel, including:

• the reasoning behind your choices for layout, colors, fonts and backgrounds
• sensible screenshots to illustrate it
• explicit descriptions of how the various styles were implemented:
  • where you have styled HTML tags, say so and say why
  • where you have used styles for IDs, say so and say why
  • where you have used classes, say so and say why
  • explain any complex (nested) selectors you have used

You should include fragments from your CSS in all these explanations.

• Responsive Design - You should describe how you have made your web application responsive to different screen sizes.
• Browser compatibility notes - You should document any CSS features you have used which are not supported across all browsers and comment on your reasons for doing so. Illustrate these differences with screenshots if possible.

Part 4: JavaScript Documentation (5%)

You should document all uses you have made of JavaScript. Where you have used JavaScript in preference to using features of HTML5 and CSS3 which could have achieved the same results you should give your reasons for doing so; where you have taken advantage of HTML5/CSS3 features to make JavaScript unnecessary you should also mention that here, although those features will be documented elsewhere in your report.

Part 5: PHP Documentation (5%)

Your use of server side processing should be documented here. This includes php and database server.

Part 6: Accessibility Evaluation (5%)

You should document any specific design decisions you made in order to meet the needs of the W3C Web Accessibility Initiative Web Content Accessibility Guidelines, or any aspects of your design which you know do not meet these guidelines. It is more important to demonstrate your knowledge and understanding of the guidelines and that you know whether or not you have followed them than it is to have successfully achieved them.

Attachments:

Related Questions

. Introgramming & Unix Fall 2018, CRN 44882, Oakland University Homework Assignment 6 - Using Arrays and Functions in C

DescriptionIn this final assignment, the students will demonstrate their ability to apply two ma

. The standard path finding involves finding the (shortest) path from an origin to a destination, typically on a map. This is an

Path finding involves finding a path from A to B. Typically we want the path to have certain properties,such as being the shortest or to avoid going t

. Develop a program to emulate a purchase transaction at a retail store. This program will have two classes, a LineItem class and a Transaction class. The LineItem class will represent an individual

Develop a program to emulate a purchase transaction at a retail store. Thisprogram will have two classes, a LineItem class and a Transaction class. Th

. SeaPort Project series For this set of projects for the course, we wish to simulate some of the aspects of a number of Sea Ports. Here are the classes and their instance variables we wish to define:

1 Project 1 Introduction - the SeaPort Project series For this set of projects for the course, we wish to simulate some of the aspects of a number of

. Project 2 Introduction - the SeaPort Project series For this set of projects for the course, we wish to simulate some of the aspects of a number of Sea Ports. Here are the classes and their instance variables we wish to define:

1 Project 2 Introduction - the SeaPort Project series For this set of projects for the course, we wish to simulate some of the aspects of a number of