/GCD-IA-Web

MSc. Applied Digital Media - Internet Authoring assignment: Static website web analysis

Primary LanguageHTML

GCD - Internet Authoring assignment

Internet Authoring assignment: static website about my hero - Charlie Chaplin

Live Example

URL: http://lukap2211.github.io/GCD-IA-Web/

Website Analysis

When I started planing a static HTML5/CSS website as a part of GCD - Internet Authoring class assignment about my hero, my starting point was defining the goals what i want to achieve.

Goals

I wanted to make a simple, easy to navigate website that will be targeting Charlie Chaplin fans. My main goals were:

  • define targeting audience
  • organize the structure of the website
  • define layout of the website
  • define “mood” of the site
  • provide relevant content and images
  • prepare the assets
  • use HTML5/CSS3 and build the site
  • make user friendly website following best practices and usability principles • make website cross browser compatible

Tasks

Each of defined goals was then broken down into specific tasks:

  • Targeted audience
    • Targeted audience was defined as a general fan page that would provide details about the protagonist life and work with related multimedia assets.
  • Website structure
    • build the structure of the website
    • define pages
  • Website layout
    • build the layout of the website
    • define container for the content
  • Mood of the website
    • style up feel and look end users are going to experience
    • define container for the content
  • Provide content
    • search and find the website content and assets resources
  • Prepare assets
    • prepare the assets to match the website layout
    • define file structure
  • HTML5/CSS3
    • write HTML5/CSS3 code
  • Best practice and usability
    • write code using best practice with usability on mind to meet standard requirements
  • Cross browser compatibility
    • make sure the site is looking the same in various modern browsers

src

.
├── README.md
├── author.html
├── css
│   └── style.css
├── gallery.html
├── images
│   ├── charlie-and-me.gif
│   ├── charlie-chaplin-3x.jpg
│   ├── charlie-chaplin-camera.jpg
│   ├── charlie-chaplin-roles.jpg
│   ├── footer-silhouette.gif
│   ├── header_bg.jpg
│   ├── home.png
│   ├── main-page-filmrole.jpg
│   └── star.png
├── index.html
├── js
│   ├── libs
│   │   ├── jquery-1.7.1.js
│   │   ├── jquery-1.7.1.min.js
│   │   └── modernizr-2.5.3.min.js
│   └── script.js
├── life.html
├── links.html
├── news.html
└── work.html