HTML to XHTML

1
HTML to XHTML

• Making the Transition

2
What is XHTML?

• XHTML -Extensible Hypertext Markup Language (XML
  HTML)
• XML Extensible Markup Language used for
  creating other languages.
• Aimed to replace HTML
• Almost identical to HTML 4.01
• Is a stricter and cleaner version of HTML

3

• XHTML is HTML defined as an XML (Extensible
  Markup Language) application
• XHTML became a W3C recommendation as of January
  2000
• A recommendation means that the specifications
  are stable, it has been reviewed and the
  specification is now a Web standard.

4
Backward Compatibility

• XHTML is compatible with HTML 4.01
• All new browsers have support for XHTML
• SGMLgtHTMLgtHTML 2.0gtHTML 3.2gtHTML 4.0gtXHTML 1.0

5
What You Should Already Know

• HTML Hypertext Markup Language
• Having a basic knowledge of HTML and web page
  construction will make the transition to XHTML
  easier.

6
Why XHTML?

• XHTML consists of all the elements in HTML 4.01
  combined with the syntax of XML.
• Many web pages contain bad HTML
• XML designed to describe data and HTML designed
  to display data
• New browser technologies (cell phones, PDAs)
  unable to interpret a bad markup language.
• XHTML pages can be read by all XML enabled
  devices.

7
What Are The Differences?

• The lt!DOCTYPEgt is Mandatory
• on each XHTML web page

An XHTML Document Type Definition describes in
precise, computer readable language, the allowed
syntax and grammar of XHTML markup. There are 3
flavors of DOCTYPE declaration statements that
you may choose to use.
8
DOCTYPE -Transitional

• lt!DOCTYPE html
• PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
• "http//www.w3.org/TR/xhtml1/DTD/xhtml1-transition
  al.dtd"gt
• Use this when you need to take advantage of
  HTML's presentational features and when you want
  to support browsers that don't understand
  Cascading Style Sheets. This DTD allows the use
  of deprecated (considered to be obsolete) tags.

9
DOCTYPE - Strict

• lt!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0
  Strict//EN" "http//www.w3.org/TR/xhtml1/DTD/xhtm
  l1-strict.dtd"gt
• Use this when you want really clean markup, free
  of presentational clutter. Use this together with
  Cascading Style Sheets.

10
DOCTYPE - Frameset

• lt!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0
  Frameset//EN" "http//www.w3.org/TR/xhtml1/DTD/xht
  ml1-frameset.dtd"gt
• Use this when you want to use HTML Frames to
  partition the browser window into two or more
  frames.

11

• XHTML documents must be well-formed (The basic
  page tags must be present and complete)
• lthtmlgt
• ltheadgt. . .lthead /gt
• ltbodygt. . .ltbody /gt
• lt/htmlgt

12

• XHTML tag names must be in lowercase
• incorrect
• ltPgtThis is a paragraphlt/Pgt
• correct
• ltpgtThis is a paragraphlt/pgt

13

• XHTML tags must be closed
• incorrect
• ltpgtThis is a paragraph
• correct
• ltpgtThis is a paragraphlt/pgt

14

• XHTML tags that normally do not have closing tags
  (empty tags) must now end with a space and a
  forward slash before the ending angle bracket.
• This affects tags such as ltbr /gt,
• lthr /gt, ltbase /, ltimg /gt, ltframe /gt, and
  others. This allows for browser backward
  compatibility.
• incorrect
• ltimg srccomputer.gif altcomputergt
• correct
• ltimg srccomputer.gif altcomputer /gt

15

• XHTML tags must be properly nested
• incorrect
• ltbgtltigtE-Commerce is excitinglt/bgtlt/igt
• correct
• ltbgtltigtE-commerce is excitinglt/igtlt/bgt

16

• Attribute names must be in lowercase
• incorrect
• lttable WIDTH100gt
• correct
• lttable width100gt

17

• Attribute values must be quoted
• incorrect
• lttable width100gt
• correct
• lttable width100gt

18

• Attribute minimization is forbidden
• incorrect
• ltinput checkedgt
• ltoption selectedgt
• correct
• ltinput checkedchecked /gt
• ltoption selectedselected /gt

19

• The id attribute replaces the name attribute
• It is suggested that both be used for backward
  compatibility.
• ltimg srcpicture.gif
• idpicture1 namepicture1 /gt