2024-2025 ASSESSMENTS
Undergraduate
Workbook 2: Responsive and Accessible Web Design
SCC.306 Internet Applications Engineering
Recommended Completion Time [30 Hours]
Assessment Weighting [20%]
Learning Outcomes
Details of the Learning Outcomes of this module can be found in the Module Programmes catalogue: https://portal.lancaster.ac.uk/intranet/mpc/modules/016886/000123. This tables specifies which learning outcomes are assessed and in which way they are assessed.
|
Subject Specific Learning Outcomes: Knowledge, Understanding and Skills
|
|
Outcome
|
Covered
|
How is it covered
|
|
Understand web architectures, standards, and business practices.
|
Yes
|
Students need to understand the web standards that exist, how to explore what they standardise and then apply that knowledge.
|
|
Empirically assess the performance of a web site
|
No
|
|
|
Understand and alleviate potential performance bottlenecks.
|
No
|
|
|
Address issues and limitations of scale.
|
No
|
|
|
Accessibility and Internationalisation
|
Yes
|
Students need to develop websites that are accessible and broadly usable.
|
|
Design for Heterogeneous platforms (Responsive web design)
|
Yes
|
Students need to develop a website that is response.
|
|
Establish a quality process for web sites
|
Yes
|
Students need to understand how to ensure the quality of a website.
|
|
Security threats and hardening of web sites
|
No
|
|
|
General Learning Outcomes: Knowledge, Understanding and Skills
|
|
Outcome
|
Covered
|
How is it covered
|
|
Establish performance metrics
|
No
|
|
|
Interpret quantitative data to identify performance problems
|
No
|
|
|
Make informed choices about complex distributed and networked architectures
|
No
|
|
Feedback and Deadline
Feedback on this workbook will be provided continuously in the labs. Please ensure you attend them. The feedback on your submitted workbook will be a response to the entire cohort. If you wish to receive more detailed individual feedback, you will need to go through the cohort-wide feedback and identify and comment on which pieces of feedback do/do not apply to your work. You can then contact Phil and Matthew to discuss your comments on the feedback. The expected return of feedback is 4 weeks after the coursework deadline. The deadline for this work is Friday 4pm Week 9.
Introduction
In this workbook, you will be looking at both responsive and accessible web design. In Part 1, you will focus on how to build an accessible website, whilst Part 2 looks at how to approach responsive web design.
It is important that you read all instructions given in this coursework specification.
For both parts of the exercise, you will use and build upon the same template website. In other words, once you have completed Part 1, the same website will be used for Part 2 – there is no need to start again.
The template website is provided on Moodle. The template consists of these files:
· index.html
· style.css
· adysonbeneath-the-screen-638106667407073410.jpg
· the-lancaster-history-and-creative-writing-lecture-2024-638651199449566120.jpg
· location-map.svg
· lu-logo.svg
· pint-of-science-morecambe-637848439194681824.jpg
· qs-top-150.svg
Submission
Once you are finished with both parts of this workbook, please submit all of your code and this workbook (as a single zipped folder) using the submission point provided in Moodle.
You should not need to submit a copy of the website for both Part 1 and Part 2. A single copy of the website after Part 2 should be sufficient.
If during Part 2 you implement additional features that changes the layout away from the specified layout, then you should include a second copy of the website that contains those additional features.
References
This is an academic piece of work and you are expected to use correct academic citations. No specific style. is mandated; however, you should be consistent and use the same style. throughout this document. The library provides a guide on the Harvard style. (https://lancaster.libguides.com/harvard) and resources are available for SCC-specific tools (https://lancaster.libguides.com/computing/referencingtools).
If you use (or adapt from) code taken from third party sources (i.e., code that you have not written and code that we have not provided to you), then you must cite where this code has come from (use the same referencing style. as for this document). You should include references in your source files and explain how code has been adapted from its source.
Part 1: Accessible Web Design
The first part of this workbook is to examine the accessibility of the supplied website. This involves identifying the issues that are causing the web page to be poorly accessible to some audiences, and then fixing a subset of these by modifying the web page.
To begin with, we recommend you review the W3C web content accessibility guidelines https://www.w3.org/TR/WCAG22/ and the BBC’s Standards and Guidelines for Mobile Accessibility: http://www.bbc.co.uk/accessibility/forproducts/.
You may also find the following resources useful:
· http://wave.webaim.org/
· https://www.w3.org/WAI/standards-guidelines/
· https://www.w3.org/WAI/standards-guidelines/wcag/
· https://www.w3.org/WAI/standards-guidelines/wcag/faq/#start
· https://www.w3.org/WAI/fundamentals/accessibility-intro/#examples
· https://www.w3.org/WAI/fundamentals/accessibility-principles/
· https://www.w3.org/TR/WCAG22/
· https://developer.mozilla.org/en-US/docs/Web/Accessibility
Throughout this section you should refer to appropriate accessibility standards or guidelines by citing them. You may choose which citation style. you use, but should be consistent throughout the workbook. You must use academic reference styles, simply providing hyperlinks is insufficient.
An example entry in your bibliography might look like:
1. 1.4.3 Contrast (Minimum) - Level AA (2019) Web Content Accessibility Guidelines 2. W3C Web Accessibility Initiative. Available at: https://www.w3.org/WAI/WCAG21/quickref/#contrast-minimum (Accessed: October 1, 2023).
You can then cite this in-text like this (WCAG2 1.4.3). Typically, you would cite this as (WCAG2 2019a) and then other references from WCAG2 as (WCAG2 2019b) etc. However, we are happy for you to use the standard number in the in-text citation.
Alternatively, you could number each reference and cite it like so [1].