Website design

Website design

1. task requirements

   • self-determined criteria
     • What my website is about and how am I going to present that information
       • My website will be about different cars and which ones are the best
       • I will make different pages for each brand
     • How many pages will I have in my website
       • I will have one page for each website and one page for a comparison of different cars
       • I will have 3-5 pages
   • Prescribed criteria
     • • Your website must include TWO aspects styled using CSS o E.g. Background colour / Background image / font type / font colour
       • I will have a neutral background colour so that you can still see the information without getting distracted
       • I will use a font colour that is easy to read
     • • 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, Paragraphs, Video or moving image
       • I will use pictures to get information across to the user
       • I will use a table to compare the differences between the cars
       • I will use a list to show all the information about the different cars
       • Different heading will show which parts are more important
     • • Your website must have an aesthetic that suits/aligns with your User Persona
       • My user is a young man so my colors will be bright but not distracting
       • The fonts will also be soft so that it is still easy to read but still pleasant to look at

2. coding enviroment

   • Developer tools
     • notepad++
     • html5 editor
     • visual studio
     • html, css
     • javascript
   • key algorithms
     • website navigation
     • other important algortihms

3. user interface

   • asthetics
     • colours
       • beige, light green, light yellow, dar blue, background-color: Medium Purple;
     • fonts
       • Arial, Helvetica, sans-serif
     • font size
       • 70px
   • user interface components
     • images
       • hyundai cars
         • Venue
         • i30
         • Kona
       • Toyota cars
         • Yarris
         • Camry
         • Corolla
       • BMW cars
         • BMW 3 Series
         • BMW X3
         • BMW M4
     • buttons
       • home page
       • next page
       • prev page
     • links
       • https://www.toyota.com.au/
       • https://www.hyundai.com/
       • https://www.bmw.com.au/
   • features
     • Different font colors
       • Dark Cyan
       • black
     • lists
       • about, cost, type of car
     • tables
       • Brand, car, cost

4. existing solutions

   • Toyota
     • pros
       • It shows more cars
       • constantly updates
     • cons
       • doesn't compare cars
   • Hyundai
     • pros
       • It shows a larger variety if cars
     • cons
       • it doesn't compare cars
   • BMW
     • pros
       • it shows more cars
     • cons
       • doesn't compare cars

5. user persona

   • needs
     • a website that compares cars
   • problems/frustrations
     • there aren't a lot of websites that compare cars really easily
   • goals
     • trying to buy a good cheap car
   • about them
     • name
       • Jack
     • age
       • 23
     • occupation
       • IT firm