CO1552 Web Application Development

1
CO1552 Web Application Development

• Week 02

2
Introduction

• This week we will look at,
• Background to the Internet
• Why web page design?
• Design precedents
• Users are important (vital!)

3
Background to the Internet

• Interconnected computers
• Protocols, machines, telephone wires all
  connected together

4
Background to the Internet

• Hyper Text Transfer Protocol (HTTP)
• File Transfer Protocol (FTP)

5
Background to the Internet

• Came about because of the cold war
• Arpanet 1969 (Advanced Research Project Agency)
• Academia took ideas on board
• UCL connected to ARPAnet in 1972
• 1982 ARPAnet released from military control
• Mid-1990s released from Academia
• Onwards the beast it is today!

6
Background to the Internet

• WWW created in 1989
• CERN (Conseil European pour la Recherche
  Nucleaire)
• Tim Berners Lee
• Created Hyper Text Markup Language
• Mosaic

7
Why web page design?

• To drive traffic to your website
• No point in creating a web page unless you have
  visitors
• Different ways of driving traffic
• Make users feel welcome
• Does what user wants to do
• Aesthetically pleasing

8
Why web page design?

• Any design task is subjective
• One person may like what another does not
• This module does NOT place marks on aesthetics
• You must consider your users
• Consider what they want from your website,
  whether that be functionality or usability

9
Why web page design?

• Create storyboards
• Draw your ideas on paper
• Annotate your paper with
• Colours
• Fonts
• Links
• As much information as possible to help others
  understand your ideas

10
Why web page design?

• Once you have created paper-based design
• You can assess whether it will meet your users
  expectation
• You can look for omissions
• You get a better idea of what you are doing
  before you do it
• Able to share your ideas with others and get
  their advice

11
Design precedents

• Make freestanding web pages
• Write the authors name
• Use clear and meaningful titles
• Page update date
• Corporate or academic institutions
• Keep a link to main page
• Meaningful hyperlinks

12
Design precedents

• Optimise download speeds
• Provide user feedback
• Use ALT tags
• Design for lower-spec machines
• Divide information in to logical chunks
• Build a hierarchy
• Ignore others ignorance

13
Design precedents

• Once you have assessed and fixed your paper-based
  designs
• Transfer them to graphics package
• Site concepts