Web Development

Lecture Objectives

• learn why web development is important
• learn about design-for-all
• appreciate some of the challenges

"Why Are We Doing This?"

"I learned this already in Leaving Cert Computer Science."

"AI can do it all for me."

"Why Are We Doing This?"

Design-for-All

Can everyone easily achieve their goals?

Web Sites Should Be Usable…

• …no matter who is visiting them
  • people with visual, auditory, physical, speech, cognitive, and neurological disabilities
  • people whose capabilities are modified by a medical condition
  • people of different ages
  • people with different first languages

Web Sites Should Be Usable…

• …no matter when users visit and where they are
  • whether stationary or on the move
  • no matter the environmental conditions (bright/dark, quiet/noisy)
  • no matter where in the world (developed/developing, rural/urban, …)

  

Web Sites Should Be Usable…

• …no matter what network connection, device or client software visitors are using
  • connections of different bandwidths and speeds (cable, wireless, mobile, …)
  • different screens (resolution, dimensions, colour)
  • different I/O modalities (keyboard/ mouse/ stylus/ touchpad/ touchscreen/ speech for input; screen/ print/ speech & other audio/ etc. for output)
  • different web browsers, different versions of browsers, different OS, client software other than browsers

Web Sites Should Be Usable…

• …now and in the future

Simple Advice

Don't assume anything!

Example Challenges

We'll look at some examples of the challenges we face.

(Not exhaustive and not in depth)

Visually-Impaired Users

a regular browser or special browser
+
a screen reader,
which sends the information from the web page to a speech synthesizer

Solution

Information conveyed exclusively in images is inaccessible to these users

Where images convey info, we must always provide an alternative

Different Screen/Window Sizes

Fixed-width layouts (based on pixels) work only for a handful of devices

Solution

Instead, use liquid layouts (based on percentages)

And, better still, use responsive web design (which adapt to the dimensions)

Serving Media Over Slow Connections

Typically, images in web pages are external resources
— stored separately, in their own files, and fetched separately

Image files are often large

Solution

Reduce! Reduce! Reduce!

Can you eliminate images?
Can you merge images?
Can you compress images?

Browsers Are Not The Only Clients!

Email Harvesters

list_of_urls = [www.example.org]
list_of_emails = []
while list_of_urls is not empty:
    remove a URL from list_of_urls
    send HTTP GET request to the URL
    receive HTTP response
    find all email addresses within the response
    insert the email addresses into list_of_emails
    find all hyperlinks within the response
    insert the URLs of the hyperlinks into list_of_urls
    

Now sell the list of email addresses to spammers!

Web Search Engines

Indexes

Search Engine Crawlers

list_of_urls = [www.example.org]
while list_of_urls is not empty:
    remove a URL from list_of_urls
    send HTTP GET request to the URL
    receive HTTP response
    find all important words within the response
    for each important word:
        in the index entry for that word, insert the URL
    find all hyperlinks within the response
    insert the URLs of the hyperlinks into list_of_urls    
    

Solutions

Disguise email addresses to make life difficult for email harvesters

Make it obvious what a web page is about to make life easier for search engine crawlers

G'luck!