QUICK COURSE LINKS: Add blog post - Read latest group posts - Course Moodle site (2024 and earlier starts) - Course Brightspace site (2025 and later starts)
FAQs: Course process : Site design : HTML : CSS : JavaScript : JQuery : AJAX : Misc : Accessing your web space at AU : Podcasts for each unit
Updated resource pages: Unit 1 - Unit 2 - Unit 3 - Units 4 & 5 - Unit 6 - Unit 7
Important notice: the student web server is unavailable. Until this is fixed, we do not require you to upload your site to the student server. See Running a web server on your local machine for details of how to meet the requirements for the final unit, and my posts on the subject in the discussion forum for further information about the problem.
Testing of a new server is in progress: if you would like to get early access and you are unafraid of working with command lines, network settings, and conf files, please contact Gerald Abshez, asking to be part of the trial.
Unit 3 - Reflection
Brief Description of Work:
I concentrated on using Cascading Style Sheets (CSS) in Unit 3 to improve the usability and aesthetic appeal of the web pages created in Unit 2. I made distinct CSS files and connected them to the HTML pages to make sure that the styling was organized and easily maintained.
Rationale and Alignment with Personas and Scenarios:
The target audience's varied wants and preferences were insightfully shown by the personalities and situations created in Unit 1. As an illustration, Persona A, a user who is blind, emphasized the value of accessible design and intuitive navigation. Consequently, I made sure that the CSS styles I used adhered to accessibility guidelines, such as employing suitable contrast ratios and offering alternate text for pictures.
Meeting Learning Outcomes:
- HTML id and class attributes: I applied customized styles to particular components in the HTML structure by using the HTML id and class attributes. For instance, I gave the webpage's important sections distinct IDs so that I could style them precisely without changing the underlying HTML meaning.
- CSS selectors, properties, and values: To effectively target items according to their attributes, relationships, and hierarchy, I used a range of CSS selectors. In order to accomplish the intended visual effects while preserving consistency between pages, properties and values were carefully chosen.
- Importing a style sheet: I followed excellent practices for keeping content and presentation separate, which encourages scalability and simplicity of maintenance, by adding external CSS files to the HTML pages.
Analysis of Successes and Challenges:
Achievements:
Clearly defined separation of concerns: By keeping distinct CSS files, I made sure that style was modular and well-organized, which made maintenance and teamwork simpler.
Considerations for responsive design: By putting responsive design ideas into practice, the webpages were able to smoothly adjust to different screen sizes and devices, improving the user experience on all platforms.
Problems:
Complexity of CSS cascading: Handling competing styles across various selectors and specificity levels presented difficulties in efficiently managing the cascade.