9. h t t p : / / w w w. e x a m p l e . c o m / h e l l o / i n d e x . p h p ? c o u r s e = i c s & b l o c k = 1 # s y l l a b u s
DISSECTING THE URL
10. h t t p : / / w w w. e x a m p l e . c o m / h e l l o / i n d e x . p h p ? c o u r s e = i c s & b l o c k = 1 # s y l l a b u s
DISSECTING THE URL
UNIFORM RESOURCE LOCATOR
PROTOCOL!! ! !
FULLY-QUALIFIED DOMAIN NAME
DOMAIN NAME
TOP-LEVEL DOMAIN
SUBDIRECTORY(IES)
PAGE
QUERY STRING
HASH TAG
11. h t t p : / / w w w. e x a m p l e . c o m / h e l l o / i n d e x . p h p ? c o u r s e = i c s & b l o c k = 1 # s y l l a b u s
DISSECTING THE URL
UNIFORM RESOURCE LOCATOR
PROTOCOL!! ! ! http
FULLY-QUALIFIED DOMAIN NAME
DOMAIN NAME
TOP-LEVEL DOMAIN
SUBDIRECTORY(IES)
PAGE
QUERY STRING
HASH TAG
12. h t t p : / / w w w. e x a m p l e . c o m / h e l l o / i n d e x . p h p ? c o u r s e = i c s & b l o c k = 1 # s y l l a b u s
DISSECTING THE URL
UNIFORM RESOURCE LOCATOR
PROTOCOL!! ! ! http
FULLY-QUALIFIED DOMAIN NAME
DOMAIN NAME
example.com
TOP-LEVEL DOMAIN
SUBDIRECTORY(IES)
PAGE
QUERY STRING
HASH TAG
13. h t t p : / / w w w. e x a m p l e . c o m / h e l l o / i n d e x . p h p ? c o u r s e = i c s & b l o c k = 1 # s y l l a b u s
DISSECTING THE URL
UNIFORM RESOURCE LOCATOR
PROTOCOL!! ! ! http
FULLY-QUALIFIED DOMAIN NAME
DOMAIN NAME
example.com
TOP-LEVEL DOMAIN
SUBDIRECTORY(IES) /hello
PAGE
QUERY STRING
HASH TAG
14. h t t p : / / w w w. e x a m p l e . c o m / h e l l o / i n d e x . p h p ? c o u r s e = i c s & b l o c k = 1 # s y l l a b u s
DISSECTING THE URL
UNIFORM RESOURCE LOCATOR
PROTOCOL!! ! ! http
FULLY-QUALIFIED DOMAIN NAME
DOMAIN NAME
example.com
TOP-LEVEL DOMAIN
SUBDIRECTORY(IES) /hello
PAGE /index.php
QUERY STRING
HASH TAG
15. h t t p : / / w w w. e x a m p l e . c o m / h e l l o / i n d e x . p h p ? c o u r s e = i c s & b l o c k = 1 # s y l l a b u s
DISSECTING THE URL
UNIFORM RESOURCE LOCATOR
PROTOCOL!! ! ! http
FULLY-QUALIFIED DOMAIN NAME
DOMAIN NAME
example.com
TOP-LEVEL DOMAIN
SUBDIRECTORY(IES) /hello
PAGE /index.php
QUERY STRING ?course=ics&block=1
HASH TAG
16. h t t p : / / w w w. e x a m p l e . c o m / h e l l o / i n d e x . p h p ? c o u r s e = i c s & b l o c k = 1 # s y l l a b u s
DISSECTING THE URL
UNIFORM RESOURCE LOCATOR
PROTOCOL!! ! ! http
FULLY-QUALIFIED DOMAIN NAME
DOMAIN NAME
example.com
TOP-LEVEL DOMAIN
SUBDIRECTORY(IES) /hello
PAGE /index.php
QUERY STRING ?course=ics&block=1
HASH TAG #syllabus
20. WEB SERVER RESPONSE
HEADERS
CONTAIN INFORMATION FOR BROWSER USE
CAN SPECIFY CONTENT TYPE, RESPONSE CODE,
INSTRUCTIONS TO REDIRECT, ETC.
21. WEB SERVER RESPONSE
HEADERS
CONTAIN INFORMATION FOR BROWSER USE
CAN SPECIFY CONTENT TYPE, RESPONSE CODE,
INSTRUCTIONS TO REDIRECT, ETC.
CONTENT-TYPE: HTML, IMAGE DATA, VIDEO, AUDIO, PDF,
ETC. THIS TELLS THE BROWSER WHAT TO DO WITH THE
DATA THAT FOLLOWS
22. WEB SERVER RESPONSE
HEADERS
CONTAIN INFORMATION FOR BROWSER USE
CAN SPECIFY CONTENT TYPE, RESPONSE CODE,
INSTRUCTIONS TO REDIRECT, ETC.
CONTENT-TYPE: HTML, IMAGE DATA, VIDEO, AUDIO, PDF,
ETC. THIS TELLS THE BROWSER WHAT TO DO WITH THE
DATA THAT FOLLOWS
CONTENT
23. WEB SERVER RESPONSE
HEADERS
CONTAIN INFORMATION FOR BROWSER USE
CAN SPECIFY CONTENT TYPE, RESPONSE CODE,
INSTRUCTIONS TO REDIRECT, ETC.
CONTENT-TYPE: HTML, IMAGE DATA, VIDEO, AUDIO, PDF,
ETC. THIS TELLS THE BROWSER WHAT TO DO WITH THE
DATA THAT FOLLOWS
CONTENT
IF A WEB PAGE WAS REQUESTED, THE CONTENT IS
HTML!
28. HTML OVERVIEW
HYPER TEXT MARKUP LANGUAGE
CONSISTS OF STRUCTURED CONTENT (NO FORMATTING)
TAG-BASED LANGUAGE, E.G.
29. HTML OVERVIEW
HYPER TEXT MARKUP LANGUAGE
CONSISTS OF STRUCTURED CONTENT (NO FORMATTING)
TAG-BASED LANGUAGE, E.G.
! <tagname>Some content here</tagname>
30. HTML OVERVIEW
HYPER TEXT MARKUP LANGUAGE
CONSISTS OF STRUCTURED CONTENT (NO FORMATTING)
TAG-BASED LANGUAGE, E.G.
! <tagname>Some content here</tagname>
HTML IS HIERARCHICAL, E.G.
31. HTML OVERVIEW
HYPER TEXT MARKUP LANGUAGE
CONSISTS OF STRUCTURED CONTENT (NO FORMATTING)
TAG-BASED LANGUAGE, E.G.
! <tagname>Some content here</tagname>
HTML IS HIERARCHICAL, E.G.
! <div>
32. HTML OVERVIEW
HYPER TEXT MARKUP LANGUAGE
CONSISTS OF STRUCTURED CONTENT (NO FORMATTING)
TAG-BASED LANGUAGE, E.G.
! <tagname>Some content here</tagname>
HTML IS HIERARCHICAL, E.G.
! <div>
<h2>Some heading here</h2>
33. HTML OVERVIEW
HYPER TEXT MARKUP LANGUAGE
CONSISTS OF STRUCTURED CONTENT (NO FORMATTING)
TAG-BASED LANGUAGE, E.G.
! <tagname>Some content here</tagname>
HTML IS HIERARCHICAL, E.G.
! <div>
<h2>Some heading here</h2>
<p>Some content here</p>
34. HTML OVERVIEW
HYPER TEXT MARKUP LANGUAGE
CONSISTS OF STRUCTURED CONTENT (NO FORMATTING)
TAG-BASED LANGUAGE, E.G.
! <tagname>Some content here</tagname>
HTML IS HIERARCHICAL, E.G.
! <div>
<h2>Some heading here</h2>
<p>Some content here</p>
</div>
37. HTML ATTRIBUTES
ATTRIBUTES APPEAR IN OPENING TAGS AND ARE USED MAINLY
FOR ONE OF TWO PURPOSES:
1. TO PROVIDE REQUIRED INFORMATION TO THE BROWSER, E.G.
38. HTML ATTRIBUTES
ATTRIBUTES APPEAR IN OPENING TAGS AND ARE USED MAINLY
FOR ONE OF TWO PURPOSES:
1. TO PROVIDE REQUIRED INFORMATION TO THE BROWSER, E.G.
! <img src=”images/homer.jpg” alt=”Homer Simpson” />
39. HTML ATTRIBUTES
ATTRIBUTES APPEAR IN OPENING TAGS AND ARE USED MAINLY
FOR ONE OF TWO PURPOSES:
1. TO PROVIDE REQUIRED INFORMATION TO THE BROWSER, E.G.
! <img src=”images/homer.jpg” alt=”Homer Simpson” />
2. TO ALLOW FOR CUSTOM STYLING (FORMATTING) OF HTML
ELEMENTS, E.G.
40. HTML ATTRIBUTES
ATTRIBUTES APPEAR IN OPENING TAGS AND ARE USED MAINLY
FOR ONE OF TWO PURPOSES:
1. TO PROVIDE REQUIRED INFORMATION TO THE BROWSER, E.G.
! <img src=”images/homer.jpg” alt=”Homer Simpson” />
2. TO ALLOW FOR CUSTOM STYLING (FORMATTING) OF HTML
ELEMENTS, E.G.
! <span class=”highlight”>lorem ipsum</span>
41. HTML ATTRIBUTES
ATTRIBUTES APPEAR IN OPENING TAGS AND ARE USED MAINLY
FOR ONE OF TWO PURPOSES:
1. TO PROVIDE REQUIRED INFORMATION TO THE BROWSER, E.G.
! <img src=”images/homer.jpg” alt=”Homer Simpson” />
2. TO ALLOW FOR CUSTOM STYLING (FORMATTING) OF HTML
ELEMENTS, E.G.
! <span class=”highlight”>lorem ipsum</span>
46. WHITE SPACE
BROWSERS IGNORE MULTIPLE CONSECUTIVE WHITE SPACE
CHARACTERS
WHITE SPACE IS COLLAPSED
ONE EXCEPTION IS <pre> ELEMENT (SHORT FOR PRESERVE)
47. WHITE SPACE
BROWSERS IGNORE MULTIPLE CONSECUTIVE WHITE SPACE
CHARACTERS
WHITE SPACE IS COLLAPSED
ONE EXCEPTION IS <pre> ELEMENT (SHORT FOR PRESERVE)
<pre>Render all white space characters</pre>
52. XHTML
EXTENSIBLE HTML
IMPOSES THE STRICTEST AND MOST STRUCTURED
STANDARDS ON TRADITIONAL HTML, E.G.
EVERY OPENING TAG MUST BE CLOSED
53. XHTML
EXTENSIBLE HTML
IMPOSES THE STRICTEST AND MOST STRUCTURED
STANDARDS ON TRADITIONAL HTML, E.G.
EVERY OPENING TAG MUST BE CLOSED
SELF-CLOSING ELEMENTS USED WHERE
NECESSARY
54. XHTML
EXTENSIBLE HTML
IMPOSES THE STRICTEST AND MOST STRUCTURED
STANDARDS ON TRADITIONAL HTML, E.G.
EVERY OPENING TAG MUST BE CLOSED
SELF-CLOSING ELEMENTS USED WHERE
NECESSARY
ATTRIBUTE VALUES ENCLOSED IN QUOTES
55. XHTML
EXTENSIBLE HTML
IMPOSES THE STRICTEST AND MOST STRUCTURED
STANDARDS ON TRADITIONAL HTML, E.G.
EVERY OPENING TAG MUST BE CLOSED
SELF-CLOSING ELEMENTS USED WHERE
NECESSARY
ATTRIBUTE VALUES ENCLOSED IN QUOTES
TAG NAMES ARE LOWERCASE