1 xhtml محمد احمدی نیا [email protected]. 2 of 19 html vs xhtml xhtml is a stricter...

1

XHTML

محمد احمدی نیا[email protected]

2 Of 19

HTML vs XHTML

XHTML is a stricter and cleaner version of HTML. by combining the strengths of HTML and XML,

XHTML was developed XHTML is HTML 4.01 redesigned as XML.

correctly and "well-formed“

زبانهای برنامه سازی وب

3 Of 19

What Is XHTML?

XHTML stands for EXtensible HyperText Markup Language

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 of January

2000. XHTML is supported by all major browsers.


4 Of 19

Why XHTML?

Many pages on the internet contain "bad" HTML. <html>

<head><title>This is bad HTML</title>

<body><h1>Bad HTML<p>This is a paragraph

</body>

market consists of different browser technologies run on computers, mobile phones or other small devices. Smaller devices often lack the resources or power to interpret a "bad“

code


5 Of 19

Differences from HTML

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


6 Of 19

XHTML Syntax

XHTML Elements Must Be Properly Nested In XHTML, all elements must be properly nested

within each other, like this: <b><i>This text is bold and italic</i></b>


7 Of 19

XHTML Syntax

Non-empty elements must have a closing tag. This is wrong:

<p>This is a paragraph<p>This is another paragraph

This is correct: <p>This is a paragraph</p>

<p>This is another paragraph</p>

Empty Elements Must Also Be Closed A break: <br />

A horizontal rule: <hr />An image: <img src="happy.gif" alt="Happy face" />


8 Of 19

XHTML Syntax

XHTML Elements Must Be In Lower Case Tag names and attributes must be in lower case. This is wrong:

<BODY><P>This is a paragraph</P></BODY>

This is correct: <body>

<p>This is a paragraph</p></body>


9 Of 19

XHTML Syntax

XHTML Documents Must Have One Root Element XHTML elements must be nested within the <html>

root element Child elements must be in pairs and correctly nested

<html> <head> ... </head> <body> ... </body></html>


10 Of 19

XHTML Syntax

Attribute Values Must Be Quoted This is wrong:

<table width=100%>

This is correct: <table width="100%">


11 Of 19

XHTML Syntax

Attribute Minimization Is Forbidden This is wrong:

<input checked><input readonly><input disabled><option selected><frame noresize>

This is correct: <input checked="checked" />

<input readonly="readonly" /><input disabled="disabled" /><option selected="selected" />


12 Of 19

XHTML Syntax

Mandatory XHTML Elements An XHTML document must have a DOCTYPE

declaration. The html, head, title, and body elements must also be

present.


13 Of 19

XHTML Doctypes

refers to a Document Type Definition (DTD). A DTD specifies the rules for the markup language,

so that the browsers render the content correctly. The basic document structure is:

<!DOCTYPE ...>

<html>

<head><title>... </title></head>

<body> ... </body>

</html>


14 Of 19

An XHTML Example

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head><title>Title of document</title></head>

<body></body>

</html>

xmlns attribute in <html>, specifies the xml namespace for a document, and is required


15 Of 19

XHTML Different Doctypes

XHTML 1.0 Strict contains all HTML elements and attributes does NOT INCLUDE presentational or deprecated

elements (like font). Framesets are not allowed. The markup must also be written as well-formed

XML.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


16 Of 19


XHTML 1.0 Transitional contains all HTML elements and attributes INCLUDING presentational and deprecated elements

(like font) Framesets are not allowed The markup must also be written as well-formed XML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


17 Of 19


XHTML 1.0 Frameset This DTD is equal to XHTML 1.0 Transitional, but

allows the use of frameset content.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">


18 Of 19

XHTML HowTo

1. Add a <!DOCTYPE> Add an XHTML <!DOCTYPE> to the first line of

every page: 2. Add an xmlns Attribute

Add an xmlns attribute to the html element of every page:

<html xmlns="http://www.w3.org/1999/xhtml">

3. Change Tags And Attribute Names to Lowercase


19 Of 19

XHTML HowTo

4. Quote All Attribute Values Check every page to see that attribute values are

quoted. 5. Close all Empty Tags 6. Validate XHTML With The W3C Validator

using this url: http://validator.w3.org/
