[SOLVED] SCC306 Internet Applications Engineering Workbook 2 Responsive and Accessible Web DesignR

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.

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].