2. CM475 SENIOR SEMINAR IN COMM
HTML
HyperText Markup Language
The code or rules that browsers read
that defines the structure Web pages
3. CM475 SENIOR SEMINAR IN COMM
XHTML
eXtensible HTML
•“Cleaned up,” stricter HTML
•An application of XML
4. CM475 SENIOR SEMINAR IN COMM
Purpose of XHTML
Define the structure of the Web page
and its content
5. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
<div class=“first”>
This is content.
</div>
<img src= “pic.jpg” alt=“ ” />
6. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
Opening Tag
<div class=“first”>
This is content.
</div>
<img src= “pic.jpg” alt=“ ” />
7. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
Opening Tag
<div class=“first”>
This is content.
End Tag
</div>
<img src= “pic.jpg” alt=“ ” />
8. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
Opening Tag Attribute
<div class=“first”>
This is content.
End Tag
</div>
<img src= “pic.jpg” alt=“ ” />
9. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
Opening Tag Attribute Value
<div class=“first”>
This is content.
End Tag
</div>
<img src= “pic.jpg” alt=“ ” />
10. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
Opening Tag Attribute Value
<div class=“first”>
Nonreplaceable Element
This is content.
End Tag
</div>
<img src= “pic.jpg” alt=“ ” />
11. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
Opening Tag Attribute Value
<div class=“first”>
Nonreplaceable Element
This is content.
End Tag
</div>
<img src= “pic.jpg” alt=“ ” />
12. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
Opening Tag Attribute Value
<div class=“first”>
Nonreplaceable Element
This is content.
End Tag
</div>
<img src= “pic.jpg” alt=“ ” />
13. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
Opening Tag Attribute Value
<div class=“first”>
Nonreplaceable Element
This is content.
End Tag
</div>
<img src= “pic.jpg” alt=“ ” />
14. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
Opening Tag Attribute Value
<div class=“first”>
Nonreplaceable Element
This is content.
End Tag
</div>
<img src= “pic.jpg” alt=“ ” />
15. CM475 SENIOR SEMINAR IN COMM
XHTML Terminology
Opening Tag Attribute Value
<div class=“first”>
Nonreplaceable Element
This is content.
End Tag
</div> Replaceable Element
<img src= “pic.jpg” alt=“ ” />
16. CM475 SENIOR SEMINAR IN COMM
CSS
Cascading Style Sheets
The code or rules that browsers read
to display and structure Web pages
17. CM475 SENIOR SEMINAR IN COMM
Purpose of CSS
Control the appearance or presentation
of the Web page
18. CM475 SENIOR SEMINAR IN COMM
CSS Terminology
h1 { font-size: 2em; color: #66666; }
19. CM475 SENIOR SEMINAR IN COMM
CSS Terminology
h1 { font-size: 2em; color: #66666; }
Property Property
20. CM475 SENIOR SEMINAR IN COMM
CSS Terminology
h1 { font-size: 2em; color: #66666; }
Property Value Property Value
21. CM475 SENIOR SEMINAR IN COMM
CSS Terminology
Declaration Declaration
h1 { font-size: 2em; color: #66666; }
Property Value Property Value
22. CM475 SENIOR SEMINAR IN COMM
CSS Terminology
Declaration block
Declaration Declaration
h1 { font-size: 2em; color: #66666; }
Property Value Property Value
23. CM475 SENIOR SEMINAR IN COMM
CSS Terminology
Declaration block
Selector Declaration Declaration
h1 { font-size: 2em; color: #66666; }
Property Value Property Value
24. CM475 SENIOR SEMINAR IN COMM
CSS Terminology
Declaration block
Selector Declaration Declaration
h1 { font-size: 2em; color: #66666; }
Property Value Property Value
Rule
25. CM475 SENIOR SEMINAR IN COMM
Advantages of combining
XHTML and CSS
•presentation
Separates structure and content from
•Simplifies, speeds revisions, redesigns