Website design

Website design

1. Task requirements

   • Prescribed criteria
     • My website must include TWO aspects styled using CSS E.g. Background colour / Background image / font type / font colour
       • In my HTML code I will use 2 aspects of CSS to style my website
       • I will use 2 aspects of CSS to style my website to engage the audience in my website design
     • You must use HTML to organise appropriate information on your webpages using FIVE of the following: Image Table showing information/Hyperlink to an external website/Ordered list or Unordered list/Button/Different heading sizes/Paragraphs Video or moving image
       • I will at least 5 of the appropriate information from the list to use in my HTML code
       • I will use at least 5 of the appropriate information from the list to use in my HTML code to make the website easy to navigate
       • I will use more then one font size and type to make the important information stand out more. E.G like how I will use a bigger font size for the title.
       • I will use all of the things on the list to make my website don’t look boring. This will make the user disengaged and make them want to leave.
     • • Your website must have an aesthetic that suits/aligns with your User Persona
       • I will use the aesthetic features that align with my user persona to meet their needs.
       • My website will have everything that fits my user persona. E.g information on the website like how my user likes playing Minecraft.
   • Self-determined Criteria
     • My website must align with all three of the prescribed criteria
       • My website must align with all three of the prescribed criteria
       • In my HTML code I will use all of the prescribed criteria to make the website engaging and easy to navigate for the user
     • My website must be easily navigable
       • My website has to be easily navigable for my user because he doesn't like it when there is to much link and button he can potentially click
       • My website must not have unwanted links and ads

2. User Interface

   • User interface components
   • Features
   • Aesthetics
     • Colours
       • #29A1F0
       • #9D29F0
       • #53DBCF2
       • #8C73FF
       • #A234F7

3. User persona

   • Needs and expectations
     • I want a website that he can look up thing about the game without getting bored and actively wants to read in his free time to decrease the number of time I needs to look at the wiki when playing Minecraft and increase and expand his Minecraft knowledge. It also has to be easily navigable so that I don’t accidentally click on a link that interrupts my focus.
   • Goal
     • I want to be able to built up apple up to a quadrillion dollar company and to be able to find everything related to Minecraft in one place and the website has to be engaging and filled with his favourite colours like blue and purple in the website.
   • About them
     • Occupation
       • He is the CEO of the famous tech firm APPLE
     • Age
       • 34 year 7 months and 24 days old
     • Location
       • LA, USA
     • Name
       • John Terus
     • Education
       • Harvard University
   • Frustration
     • I finds that the Minecraft wiki is boring and want something else that engage him so that he does want to click off the website the second that he finds the information. I also think that the Minecraft wiki is very hard to navigate with button and links everywhere I feel like that I can click anything at anytime.
   • Interests
     • I likes playing Minecraft as a hobby but I is bad at it.
   • Summary
     • As a hobby I likes to play Minecraft but I am bad at it so I has to always go to the Minecraft wiki for help as he frequently does not know what I am doing. I doesn’t like the Minecraft wiki because the website is not engaging for me, I want something that can engage me and doesn’t make ,me want to click off the website the second I finds his information that I wants. I want a website with colour that I likes for example blue and purple and I want to read in his free time to increase his Minecraft knowledge without getting bored.

4. Existing solutions

   • Apple.com
     • Pros
       • Easy to navigate through
       • Includes lots of important imformation
       • fast and easy way to pay
     • Cons
       • The background is very bland with mostly the only colour white
       • it has lots of links every where make it easier to click on to a scamm website
   • minecraftwiki.com
     • Pros
       • It has a lot of good and helpful information
     • Cons
       • The website is not engaging for my user
       • I has to much words making it confusing for the reader

5. Analysis

   • What is HTML?
     • HTML is a coding language found in the code of websites.
   • What is HTML used for?
     • HTML is used by many people around the world to built up there website
   • What types of documents are constructed as the outcome of writing HTML?
     • When you write in HTML the outcome is a HTML document.
   • What are tags?
     • In HTML code tags each has a specific purpose and is used to format a website
   • What do Tags look like?
     • Tag are enclosed within angle bracket and they usually come in a pair, a opening tag and a closing tag. For example, some commonly used tag are ‘<html>.’
   • Who sees the tags that are used in website design?
     • Usually only the website owner and the website developer can see the tags.
   • Give some examples of Tags and explain them.
     • An example of a tag will be ‘<p>’ this is the tag for creating a paragraph, and another example of a tag will be ‘<title>’this is the tag for making a title in your website.
   • What is CSS?
     • CSS is a coding language that is also found in many websites
   • What is CSS used for?
     • CSS is used with HTML to set the appearance of the website.
   • How are CSS and HTML different?
     • CSS needs HTML for it to work, CSS is what makes the website look pretty while HTML is the coding for the website to operate.
   • Why do websites need aesthetic features?
     • So the users doesn’t get bored of the website and so that the website doesn’t look bland.
   • Give some examples of aesthetic features and explain why they might be useful in a website?
     • Some links and image are useful for the website so that the website doesn’t just have a white background.