Scribd
Upload
33 views

Web Programming 1

This document outlines the course details for a web programming class, including the distribution of marks, a history of the internet and world wide web, definitions of key concepts like URIs, client-server architecture, DTDs, and an introduction to HTML and XHTML with requirements for using them. The document provides foundational information on topics that will be covered in the course.

Uploaded by

bilbatori
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
33 views

Web Programming 1

This document outlines the course details for a web programming class, including the distribution of marks, a history of the internet and world wide web, definitions of key concepts like URIs, client-server architecture, DTDs, and an introduction to HTML and XHTML with requirements for using them. The document provides foundational information on topics that will be covered in the course.

Uploaded by

bilbatori
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 24

Web Programming

Lecture 1

Web Programming 1
This course is for people who…
Web Programming – Fall 2010

 … want to join the industry


 … want to work free lance
 … want to set up their own companies
 … want to know how things work

Web Programming 2
Marks Distribution
Web Programming – Fall 2010

 Assignments: 20%
 Quiz: 10%
 Midterms: 20%
 Project: 15%
 Final: 35%

Web Programming 3
History
Web Programming – Fall 2010

Internet WWW
 Internet Vs. Web
 Tim Berners-Lee is credited with having created
the World Wide Web while he was a researcher
at the European High-Energy Particle Physics lab
 Tim Berners-Lee wrote a proposal called
HyperText and CERN and circulated his proposal
for comments at CERN in 1989
 http://www.w3.org/History/1989/proposal.html
 First Web Server

Web Programming 4
History
Web Programming – Fall 2010

 First Browser: Mosaic


 In 1993 Marc Andreesen was an
undergraduate student at the University of
Illinois created the first ever browser called
Mosaic

Web Programming 5
URI
Web Programming – Fall 2010

 The World Wide Web (WWW, or simply the Web) is an


information space in which the items of interest
(resources) are identified by global identifiers called
Uniform Resource Identifiers (URI)
 URL?
 URI Vs. URL

URI URL

Web Programming 6
URI Scheme
Web Programming – Fall 2010

 http://user:[email protected]:8080/animal/bird?species=seagull#wings

http Protocol
user:pass Login:Password
www.foo.com Host
8080 Port
/animal/bird Path
Species=seagull Query
#wings Anchor

Web Programming 7
Client-Server Architecture
Web Programming – Fall 2010

 Client and server are different

Client Server
Sends requests Waits for requests
Waits for responses Processes requests
and serves responses
Active Passive

Web Programming 8
Client-Server Architecture
Web Programming – Fall 2010

Listen

Client Server

Web Programming 9
Client-Server Architecture
Web Programming – Fall 2010

Connect

Client Server

Web Programming 10
Client-Server Architecture
Web Programming – Fall 2010

Request Data

Client Server

Web Programming 11
Client-Server Architecture
Web Programming – Fall 2010

Response

Client Server

Web Programming 12
Client-Server Architecture
Web Programming – Fall 2010

Disconnect

Client Server

Web Programming 13
Client-Server Architecture
Web Programming – Fall 2010

Listen

Client Server

Web Programming 14
DTD
Web Programming – Fall 2010

 When performing HTML validation testing


on a web page it tells the HTML
(HyperText Markup Language) validator
which version of (X)HTML standard the
web page coding is supposed to comply
with
 It tells the browser how to render the page
in standards compliant mode
 Quirk Mode

15
Quirk Mode
Web Programming – Fall 2010

With DTD Without DTD

16
DTD
Web Programming – Fall 2010

 Types of DTD (HTML 4.01)


 Strict
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

 Loose/Transitional
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

 Frameset
 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
 List of DTDs
 http://www.w3.org/QA/2002/04/valid-dtd-list.html

17
HTML
Web Programming – Fall 2010

 For this course, you will


 Always use a DTD
 Always indent and document code
 Always validate written code and correct as
many things as possible
 Never use tables for specifying layout (Use
<div> instead)

http://www.decloak.com/Dev/CSSTables/CSS_Tables_01.aspx
XHTML
Web Programming – Fall 2010

 XHTML stands for EXtensible HyperText Markup


Language
 XHTML is aimed to replace HTML
 XHTML is almost identical to HTML 4.01
 XHTML is a stricter and cleaner version of
HTML
 XHTML is HTML defined as an XML application
 XHTML is a W3C Recommendation
XHTML vs HTML
Web Programming – Fall 2010

 XHTML elements must be properly


nested
 XHTML elements must always be closed
 XHTML elements must be in lowercase
 XHTML documents must have one root
element
 Standalone tags
XHTML
Web Programming – Fall 2010

 It must conform to the constraints expressed in one of


the three DTDs
 The root element of the document must be html
 The root element of the document must contain an xmlns
declaration for the XHTML namespace. The namespace
for XHTML is defined to be
http://www.w3.org/1999/xhtml. An example root element
might look like:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 There must be a DOCTYPE declaration in the document prior to the
root element

21
XHTML vs HTML Web Programming – Fall 2010

 Attribute names must be in lower case


 Attribute values must be quoted
 Attribute minimization is forbidden
 The id attribute replaces the name attribute
 The XHTML DTD defines mandatory elements
<!DOCTYPE Doctype goes here>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Title goes here</title>
</head>

<body>
body goes here
</body>

</html>
XHTML Resources
Web Programming – Fall 2010

 http://www.w3.org/People/Raggett/tidy/

<p>
<a href="http://validator.w3.org/check?uri=referer">
<img src="http://www.w3.org/Icons/valid-xhtml10“

alt="Valid XHTML 1.0 Transitional“


height="31" width="88" />
</a>
</p>
Home Work
Web Programming – Fall 2010

 Go to http://www.w3schools.com
 Complete the HTML tutorial
 Complete the XHTML tutorial
 Try a WYSIWYG HTML editor like
FrontPage or DreamWeaver

You might also like