Upload
meghan-osborne
View
219
Download
2
Embed Size (px)
Citation preview
Semantic markup
Library and Information Services
University of St Andrews
1. XHTML
a reformulation of HTML 4 in XML 1.0 Specification: http://www.w3.org/TR/xhtml1/
Some differences to HTML 4
Documents must be well-formed
Correct: <p>here is an emphasized <em>paragraph</em>.</p>
Incorrect: <p>here is an emphasized <em> paragraph.</p></em>
Element and attribute names must be in lower case
XHTML is case sensitive-> <h1> and <H1> are different tags
For non-empty elements, end tags are required
Correct: <p>This is the first paragraph.</p><p>This is the second paragraph.</p>
Incorrect:<p> This is the first paragraph.<p> This is the second paragraph.
Attribute values must always be quoted
Correct: <td rowspan=“3”>
Incorrect: <td rowspan=3>
Empty elements
Correct: <br />, <hr />, …
Incorrect: <br>, <hr>, …
The elements with 'id' and 'name' attributes
HTML 4: “name” attribute for a, applet, form, frame, iframe, img, and map
Introduction of “id” attribute XHTML 1.0:
“name” attribute is deprecated and will be removed in subsequent versions
Versions of XHTML
XHTML 1.0 Frameset For web sites using frames
XHTML 1.0 Transitional Takes advantage of XHTML features but ensures
backwards compatibility XHTML 1.0. Strict
Ensures clean structural markup free from markup associated with layout
XHMTL 1.1. (strict only) In preparation XHTML 2.0
Document Type Definitions (DTD)
XHTML 1.0 Strict<?xml version="1.0"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
HTML 3.02<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.02 Final//EN”>
XML namespaces
register a unique identifier for a particular XML vocabulary
provide a means of differentiation between tags from different XML vocabularies that happen to share the same name
The XHTML namespace<html xmlns="http://www.w3.org/1999/xhtml">
2. Semantic markup
Markup that is meaningful to the context of the document and its purpose
<poem> <title>At Lulworth Cove a Century Back</title>
<stanza> <line>HAD I but lived a hundred years ago</line> <line>I might have gone, as I have gone this year,</line> <line>By Warmwell Cross on to a Cove I know,</line> <line>And Time have placed his finger on me there:</line></stanza>
<!-- more stanzas -->
</poem>
Example: XML
<bibliography> <item>
<author><firstname>Thomas</firstname><name>Hardy</name> </author>
<title>Far from the Madding Crowd</title><place>London</place><publisher>Smith, Elder & Co.</publisher><year>1874</year><category>Fiction</category><description>2 vols.</description>
</item><!-- more items -->
</bibliography>
Example: XHTML
<div id=“bibliography”> <p id=“item”>
<span class=“author”><span class=“firstname”>Thomas</span><span class=“name”>Hardy</span>. </span>
<span class=“title”>Far from the Madding Crowd</span>.
<span class=“place”>London</span>:<span class=“publisher”>Smith, Elder & Co.</span>,<span class=“year”>1874</span>.<span class=“category”>Fiction</span>(<span class=“description”>2 vols.</span>)
</p><!-- more items -->
</div>
Cascading Style Sheets
Part 2
Library and Information Services
University of St Andrews
What’s next?
1. Convert the file wb.html into XHTML.2. Develop a markup that is similar to that in
the example given in the presentation and a corresponding style sheet.
3. Open the file wessex.html and develop your own semantic markup (e.g. real names, names of fictional characters, titles of Hardy’s works, real places, fictional places, etc.) and style sheet.