FIT1050 Web Fundamentals 2024 Website Development and Report: Build a Website Homepage
FIT1050 Web Fundamentals
2024 Semester 1
Assignment 3 (30%, individual assessment)
Website Development and Report: Build a Website Homepage
Using the CodeStitch modular template system, develop a homepage for the Australian small business that your group selected for Assignment 2. The design of the webpage does not need to be identical to your group's redesign mockup - you have the opportunity to create and implement your own design ideas using what you have learned in Assignment 2.
You will also write a short report that explains 5 important decisions relating to key aspects of the homepage design you have implemented.
Build Your Website Using Free CodeStitch Template Modules
CodeStitch is a modular system of HTML, CSS and JavaScript components, known as "stitches", that can be combined and customised to quickly build complex webpages.
Only use CodeStitch stitches from the free demo library: https://codestitch.app/app
Browse the collection of free stitches on CodeStitch.app..
Get code to use in your own website's HTML, CSS and JS files.
1
FIT1050 Web Fundamentals
2024 Semester 1
Demonstrate your understanding of HTML and CSS techniques by combining and customising free stitches to produce a website homepage with 5-6 content sections.
● Combine HTML code in your website's index.html file
● Customise each module by editing the HTML and creating your own CSS styles.
● All CSS and JS code must be written in separate externally linked files.
● Other templates and frameworks are not allowed in this assignment.
Declare All CodeStitch Stitches Used in Your Website
You must accurately acknowledge all CodeStich stitches used in your website by providing annotated screenshots of your website. At the start of your report:
● Include screenshots of each section of your website.
● Annotate each screenshot with links to the CodeStitch stitches used.
Website Content and Technical Guidelines
Your homepage must have 5-6 content sections. A content section is a distinct area of awebpage that has information and purpose that is different to other areas. In this assignment:
● A header containing titles and featured content is counted as a content section.
● A footer with company information and links is counted as a content section.
● A navigation menu should be present but is not counted as a content section
Use a code editor and Chrome’s DevTools to customise your template modules. Develop a homepage only - no other pages are required. Navigation links do not need to be functional.
● Change all text and image content in the CodeStich modules.
● Customise colours, backgrounds, and fonts to change the visual design.
● Add, remove, and rearrange content within the modules.
During marking, your website will be tested at a desktop screen size of 1920 x 1080px.
You must also demonstrate a basic understanding of client-side scripting by researching and implementing at least 1 new JavaScript feature in your website. The feature must involve a user interaction that results in useful functionality in the website.
● You may write original code based on lab activities or further research.
● You may make use of research third-party scripts from online sources.
● Interactive features already implemented in CodeStitch modules are not counted.
2
FIT1050 Web Fundamentals
2024 Semester 1
The website must be uploaded to a web host for final testing (covered in week 12).
● The website must have a favicon that is appropriate for your website.
● Images must be optimised for web delivery
● Unnecessary files must be identified and removed.
Server-side scripting (i.e. PHP) is not required and will not be assessed in this assignment.
Report Guidelines
Write a short report between 750-1250 words justifying some important decisions you madewhen designing and developing the website.
Include the following information at the start of the report:
● The URL where your hosted website can be accessed online.
● An overview of your site topic and purpose.
● The specific target demographic that the site is designed to appeal to.
In your report, describe the single most important decision you made for each of the following key aspects of your website:
Site content or major features
Visualdesignstyle
Imageoptimisation
Accessibility
JavaScriptinteraction
Provide justifications for each decision that demonstrates how you have considered and applied theory covered in this unit and further supporting research. Research should include screenshot examples of similar features found in other websites.
Use of Online Resources
The report must include references for all non-original resources used in your website.
● All CodeStitch stitches used to construct your website.
● All non-original text content that you have researched.
● All download images and any other media content.
● Researched code, including downloaded scripts and online tutorials.
● Linked/embedded resources, including videos, webfonts and JavaScript code.
3
FIT1050 Web Fundamentals
2024 Semester 1
Downloaded images must have a licence that allows free commercial use.
● Public Domain or Creative Commons licensed images are preferred.
● Other licences that allow free commercial use are also allowed (check with your tutor
if you are unsure).
● Images that only contain a logo (website logo, social media icons) do not require a
free commercial use licence, but must still be referenced.
Formal referencing style is not required. References may be in the form of a title/filename and source URL. References are not included in the report’s word count.
Use of AI Content Generation Tools
Generative AI tools are restricted for certain functions in this assessment task
In this assignment, you can use generative artificial intelligence (AI) tools to create images to use as media content in your website. You must not use Generative AI tools for writing HTML, CSS or JavaScript code for your website, or for generating text in your report.
All use of generative artificial intelligence for website content must be acknowledged in your report's references. Declaration of generated materials must include:
● Clear identification of each image created using generative AI.
● Acknowledging and providing URLs for the specific generative AI tools used.
● Providing the prompts you used to generate each piece of content.
Deliverables and Submission
● A single ZIP file containing your website folder
○ Include all files required to view your website.
○ Remove files that are not required to view your website.
○ The total size of your website folder must be less than 25MB before
compressing as a ZIP file.
● Website development report as a PDF file
○ Upload your website to a web host and include a URL on the cover page of
your report that tutors can use to access your hosted website.
○ Include screenshots of each section of your finished website with annotations
to declare all CodeStitch stitches used.
○ Include references for your website and report at the end of the document.
Submission Due: Friday Week 12, 11:55PM
