Unit 2
Outcome 1:
Create structures and
styles for a webpage.
[Reading time: 3m 15s]
1.1: Describing the content and layout for each page.
- Homepage: There are two forms of navigation (one for the social media icons linking to these sites, and the other for the website navigation showing "About, Portfolio, Units, Contact"), there is a call to attention in the centre of the screen saying "Hi, I'm Chloë, nice to meet you!" in hot pink and off white signature fonts, with a button below saying "Enter" which directs to the 'About' page, the background is a Unsplash image referenced in the footer, the footer is an off-black colour at the bottom of the page outlining the copyright and referenced images and icons.
- About: The same navigation is used, the off-black background colour is used and the accent hot pink colour within the fonts, the text uses a hierarchy outlining my interests and background, there is a "Reading time" descriptor at the top of the text to inform the reader of their investment of time to read the passage, the same footer is used.
- Portfolio: This page is under construction, the same nav and footer are used, the background is the same image seen on the homepage, there are the words "under construction" "coming soon" written in the sam signature fonts and colour palette as the previous pages.
- Units Main: Same navs and footers used, same background images as the previous pages, same colour palette and fonts as before, there are a serious of animated buttons which are clickable and connect to the various assessments, they turn hot pink and are animated on hover.
- Units pages: Same navs/footers/fonts/colours/hierarchy, this page has the written assessments contained within white boxes with the font is black and in a legible 'sans-serif' font, the off-black background colour is used, there is a back button at the moment (the same styling at the rest of the site) which takes the user back to the 'Units main'. There are five of these pages showing the same layout.
- Contact: Same navs/footers/fonts/colours/hierarchy/background as homepage, there is an image taken from Unsplash of an old telephone, next to this is some text outlining the contact details.
1.5: Describing copyright and other constraints affecting websites.
"Copyright refers to the legal protection of original works of authorship. This includes literary, written, dramatic, artistic, musical, and other types of creative expression."
Written material, graphics, business logos, and other visual and sound elements, are firmly categorised as copyrightable material.
"The law in the U.K. is the 'Copyright, Designs and Patents Act 1988'. It is similar to the U.S. law in that it protects original creations involving literary work, music, art, film, and sound. A supplemental law, the 'Copyright (Computer Programs) Regulations 1992' extends protection to software, which is normally protected under laws and agencies unique from copyright.
Works are protected upon creation, meaning as soon as you post your website, you enjoy copyright protection. However, the U.K. Copyright Service highly recommends registration because websites are subject to abuse and that process allows a civil cause of action.
The U.K. law does not extend the same copyright protection to logos as the U.S. law. You will have to register any logos as a trademark."
Constraits which a developer could face when building a website would entail rights to usage over content, on reusing text or images, needing to reference the creator of content, etc.
References: Termsfeed.com, Copyright, Designs and Patents Act 1988, Copyright (Computer Programs) Regulations 1992
1.6: Describing access issues that need taking into account - describe issues that people with disabilities may face when using webpages and how we can overcome them.
When it comes to accessibility with digital project or webpages it is important to take into consideration the issues all people will face whilst using them. We do not want to be producing ableist websites or digital products which could alienate someone with disabilities. It is important to think "disability first".
- Designing and including elements which are picked up by text-speech or other AT applications: These will help someone with visual impairment to better understand the website.
- Use of the 'Alt' tag on images: Will inform someone about what a link does when clicked.
- Colour palette changes or good colour palette choices: Keeping contrast, colour choice and balance within the site to prevent over stimulus or distraction.
- Simplistic designs which aren't overcrowded: Keep it simple so its easy to understand.
- Strong heading structure: Using a proper hierarchy so that it is easy to discern the website.
- Use of sound signifies: Will help someone to know when things are loading, have been clicked or there is general progress or activity within the website.
- Ensure you know who you are building/designing for: It can be hard to design for all disabilities, as some with conflict with others, so being fully aware of who will be accessing your website is important. Alternatively offering other ways to view the site, for example, "dark and light mode" which could change the colour palette for people with autism to more muted etc.
Reference: Digital Arts Online
1.7: Describe which are the appropriate filetypes for websites.
The appropriate file types for websites are:
- index.html: the homepage of a website
- main.css: the stylesheet for the website
- .png: photo files
- .jpg: photo files
- .gif: moving images/animations
- .svg: a completely editable vector based file
To name a few.