Website Design

Website Design

1. User Interface

   • Features
     • Call to action: learn how to do ___ today
     • High quality pictures
   • User interface components
     • Buttons
     • images
     • links
   • Aesthetics
     • colour and contrast
     • typography

2. Existing Solutions

   • RSPCA
     • Pros.
       • Looks aesthetically pleasing with images.
       • Includes the process of adopting VIA the RSPCA website.
     • Cons.
       • The HOME button is small and hard to notice.
       • There are not a lot of directions: it is more of a 'look for yourself' website.
   • AWLQ
     • Pros.
       • Advertises donating to help the pets out a lot.
       • Includes alot of information about each different pet.
     • Cons.
       • Isn't too aesthetically pleaseing(The colour theme doesn't look right)
       • Doesn't mention why you should adopt pets instead of buying.

3. User Persona

   • Most websites sell pets, don't include enough information about the animals, and the website pages aren’t attractive or fun to look through.
   • A website that advertises cats/dogs that need adopting, includes background information and is a fun website to look through.
   • I want to be able to browse an interesting website that has cats and dogs up for adoption and includes background information about the animals.
   • Name is Nikki Baxter. She is 22 years old and lives in Brisbane, QLD. She is interested in animals, teaching, adopting a pet that needs a home. She is in Uni and is a helper teacher at a high school.
   • I want to adopt, not buy but adopt, a cat or dog that needs a home.

4. Task Requirements

   • Prescribed Criteria
     • Your website must include TWO aspects styled using CSS
       • Font colour
       • Background colour
       • Background image
     • You must use HTML to organise appropriate information on your webpages
       • Button
       • Image
       • Table
     • Your website must have an aesthetic that suits/aligns with your User Persona
       • Clear layout
       • Typography
       • Images+graphics
   • Self Determined Criteria
     • Website must have an interesting topic

5. Coding environment

   • Developer Tools
     • Notepad++
       • It is used for programming, scripting and mark up languages.
     • Coding Language
       • HTML
         • HTML is used to develop the structure and content of a web page, including text, images, links, and other elements.
           • <!DOCTYPE html>
       • CSS
         • CSS is a stylesheet language used in web development to control the presentation and layout of HTML documents.
           • body { background-color: lightblue;}
   • Key Algorithim
     • Website Navigation
       • Button
         • Page 2
         • Homepage
       • Hyper.