XHTML: diferenças entre revisões
Conteúdo apagado Conteúdo adicionado
maioridade pena no brasil e a Etiquetas: Remoção considerável de conteúdo Editor Visual |
m Foram revertidas as edições de 189.127.0.197 (usando Huggle) (3.1.16) |
||
Linha 21:
|url =
}}
O '''XHTML''', ou '''eXtensible Hypertext Markup Language''', é uma reformulação da [[linguagem de marcação]] [[HTML]], baseada em [[XML]]. Combina as [[tag]]s de marcação HTML com regras da XML. Este processo de padronização provê a exibição de uma página [[Web]] neste formato por diversos dispositivos ([[televisão]], [[palm]], [[celular]], etc), além da
Para verificar se uma página foi construída corretamente no padrão XHTML, existem diversos validadores; a [[W3C]] disponibiliza um validador online.<ref>{{citar web
Linha 214:
; XHTML 1.0 Strict
:<code><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"<br />"<nowiki>http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd</nowiki>"></code>
; XHTML 1.0 Transitional
:<code><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"<br />"<nowiki>http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</nowiki>"></code>
; XHTML 1.0 Frameset
:<code><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"<br />"<nowiki>http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd</nowiki>"></code>
; XHTML 1.1
:<code><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"<br />"<nowiki>http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd</nowiki>"></code>
; XHTML5
XHTML5 does not require a doctype, and XHTML5 validation is not DTD-based.
; XHTML 2.0
XHTML 2.0, [[As of August 2006]], is in a draft phase. If an XHTML 2.0 Recommendation is published with the same document type declaration as in the current Working Draft, the declaration will appear as:
:<code><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 2.0//EN"<br
/>"<nowiki>http://www.w3.org/MarkUp/DTD/xhtml2.dtd</nowiki>"></code>
A placeholder DTD schema exists at the corresponding URI, though it currently only includes the character reference entities from previous recommendations. XHTML 2 contemplates both a<code>version</code> attribute and an<code>xsi:schemalocation</code> attribute on the root HTML element that could possibly serve as a substitute for any DOCTYPE declaration.
==== XML namespaces and schemas ====
In addition to the DOCTYPE, all XHTML elements must be in the appropriate [[XML namespace]] for the version being used. This is usually done by declaring a default namespace on the root element using<code>xmlns="namespace"</code> as in the example below.
For XHTML 1.0, XHTML 1.1 and XHTML5, this is
:<code><<nowiki>html xmlns="http://www.w3.org/1999/xhtml"</nowiki>></code>
XHTML 2.0 requires both a namespace and an [[XML Schema]] instance declaration. These might be declared as
:<code><html xmlns="<nowiki>http://www.w3.org/2002/06/xhtml2/</nowiki>"<br
/>xmlns:xsi="<nowiki>http://www.w3.org/2001/XMLSchema-instance</nowiki>"<br
/>xsi:schemaLocation="<nowiki>http://www.w3.org/2002/06/xhtml2/ http://www.w3.org/MarkUp/SCHEMA/xhtml2.xsd</nowiki>"></code>
This example for XHTML 2.0 also demonstrates the use of multiple namespaces within a document. The first<code>xmlns</code> default namespace declaration indicates that elements and attributes whose names have no XML namespace prefix fall within the XHTML 2.0 namespace. The second namespace prefix declaration<code>xmlns:xsi</code> indicates that any elements or attributes prefixed with the<code>xsi:</code> refer to the XMLSchema-Instance namespace. Through this namespace mechanism XML documents allow the use of a mixture of elements and attributes taken from various XML vocabularies while avoiding the potential for clashes of naming between items from independently developed vocabularies.
Similar to the case of DOCTYPE above, the actual URL to the [[XML Schema]] file can be changed, as long as the [[Universal Resource Identifier]] (URI) before it (which indicates the XHTML 2.0 namespace) remains the same. The namespace URI is intended to be a persistent and universally unique identifier for the particular version of the specification. If treated as a URL, the actual content located at the site is of no significance.
==== XML Declaration ====
A [[character encoding]] may be specified at the beginning of an XHTML document in the XML declaration when the document is served using the<code>application/xhtml+xml</code> MIME type. (If an XML document lacks encoding specification, an XML parser assumes that the encoding is [[UTF-8]] or [[UTF-16]], unless the encoding has already been determined by a higher protocol.)
For example:
:<code><?xml version="1.0" encoding="UTF-8"?></code>
The declaration may be optionally omitted because it declares as its encoding the default encoding. However, if the document instead makes use of XML 1.1 or another character encoding, a declaration is necessary. [[Internet Explorer]] prior to version 7 enters [[quirks mode]] if it encounters an XML declaration in a document served as<code>text/html</code>.
=== Common errors ===
Some of the most common errors in the usage of XHTML are:
* Failing to realize that documents won’t be treated as XHTML unless they are served with an appropriate XML [[Internet media type|MIME type]]
* Not closing empty elements (elements without closing tags in HTML4)
** Incorrect:<code><nowiki><br /></nowiki></code>
** Correct:<code><nowiki><br /></nowiki></code><br />Note that any of these are acceptable in XHTML:<code><br></br></code>,<code><br/></code> and<code><br /></code>. Older HTML-only browsers will generally accept<code><br></code> and<code><br /></code>. Using<code><br /></code> gives some degree of backward and forward compatibility.
* Not closing non-empty elements
** Incorrect:<code><nowiki>
This is a paragraph.
This is another paragraph.</nowiki></code>
** Correct:<code><nowiki>
This is a paragraph.
This is another paragraph.
</nowiki></code>
* Improperly nesting elements (elements must be closed in reverse order)
** Incorrect:<code><nowiki><em>'''This is some text.</em>'''</nowiki></code>
** Correct:<code><nowiki><em>'''This is some text.'''</em></nowiki></code>
* Not putting quotation marks around attribute values
** Incorrect:<code><nowiki><td rowspan=3></nowiki></code>
** Correct:<code><nowiki><td rowspan="3"></nowiki></code>
** Correct:<code><nowiki><td rowspan='3'></nowiki></code>
* Using the ampersand outside of entities (use<code>&amp;</code> to display the ampersand character)
** Incorrect:<code><nowiki><title>Cars & Trucks</title></nowiki></code>
** Correct:<code><nowiki><title>Cars &amp; Trucks</title></nowiki></code>
* Using the ampersand outside of entities in [[Uniform Resource Locator|URL]]s (use<code>&amp;</code> instead of<code>&</code> in links also)
** Incorrect:<code><nowiki><a href="index.php?page=news&style=5">News</a></nowiki></code>
** Correct:<code><nowiki><a href="index.php?page=news&amp;style=5">News</a></nowiki></code>
* Failing to recognize that XHTML elements and attributes are case sensitive
** Incorrect:<code><nowiki><BODY><P ID="ONE">The Best Page Ever
</BODY></nowiki></code>
** Correct:<code><nowiki><body><p id="ONE">The Best Page Ever
</body></nowiki></code>
* Using attribute minimization
** Incorrect:<code><nowiki><textarea readonly>READ-ONLY</textarea></nowiki></code>
** Correct:<code><nowiki><textarea readonly="readonly">READ-ONLY</textarea></nowiki></code>
* Mis-using CDATA, script-comments and xml-comments when embedding scripts and stylesheets.
** This problem can be avoided altogether by putting all script and stylesheet information into separate files and referring to them as follows in the XHTML<code>head</code> element.
<pre>
<link rel="stylesheet" href="/style/screen.css" type="text/css" />
<script type="text/javascript" src="/script/site.js"></script>
</pre>
:: Note: The format<code><script …></script></code>, rather than the more concise<code><script … /></code>, is required for HTML compatibility when served as MIME type<code>text/html</code>.
** If an author chooses to include script or style data inline within an XHTML document, different approaches are recommended depending whether the author intends to serve the page as<code>application/xhtml+xml</code> and target only fully conformant browsers, or serve the page as<code>text/html</code> and try to obtain usability in Internet Explorer 6 and other non-conformant browsers.
:: In the fully conformant<code>application/xhtml+xml</code> case, the non-XML code is wrapped in a CDATA section as follows [http://www.w3.org/TR/xhtml1/#h-4.8]:
<pre><nowiki>
<style type="text/css">
<![CDATA[
p { color: green; }
]]>
</style>
<script type="text/javascript">
<![CDATA[
function nothing() { }
]]>
</script>
</nowiki></pre>
:: If the same file may be served or processed as both XML (<code>application/xhtml+xml</code>) and HTML compatible<code>text/html</code> to target Internet Explorer 6 and as many other historic and non-conforming browsers as possible, constructs as complex as the following may be necessary[http://hixie.ch/advocacy/xhtml]:
<pre><nowiki>
<style type="text/css">
<!--/*-- ><![CDATA[/*><!--*/
p { color: green; }
/*]]>*/-- >
</style>
<script type="text/javascript">
<!--//-- ><![CDATA[//><!--
function nothing() { }
//-- ><!]]>
</script>
</nowiki></pre>
However, the following is sufficient for the relatively modern browsers (from 2000 onwards):
<pre><nowiki>
<style type="text/css">
/*<![CDATA[*/
p { color: green; }
/*]]>*/
</style>
<script type="text/javascript">
//<![CDATA[
function nothing() { }
//]]>
</script>
</nowiki></pre>
== Backward compatibility ==
XHTML 1.0 documents are mostly backward compatible with HTML — that is, processible as HTML by a web browser that does not know how to properly handle XHTML — when authored according to certain guidelines given in the specification and served as<tt>text/html</tt>. Authors who follow the compatibility guidelines essentially create HTML documents that, while technically invalid, are processible by all modern web browsers.
Documents following the compatibility guidelines are still not truly compatible with HTML user agents that support the [[SGML]] ''NET'' (Null End Tag) construct, although very few user agents support it in practice. [[OpenSP]] is one such user agent.
XHTML 1.1's modularity features prevent it from being backward compatible with XHTML 1.0 and HTML. XHTML 2.0, likewise, is not backward compatible with its predecessors.
=== Examples ===
The followings are examples of XHTML 1.0 Strict. Both of them have the same visual output. The former one follows the [http://www.w3.org/TR/xhtml1/#guidelines HTML Compatibility Guidelines] in Appendix C of the XHTML 1.0 Specification while the latter one breaks backward compatibility but provides cleaner codes.
{| class="wikitable"
|+ style="text-align: left;" | Media type recommendation for the examples:
|-----
! width="250" height="28" | Media type
! width="100" height="28" | Example 1
! width="100" height="28" | Example 2
|-----
! width="250" height="25" | application/xhtml+xml
| width="100" height="25" | SHOULD || width="100" height="25" | SHOULD
|-----
! width="250" height="25" | application/xml
| width="100" height="25" | MAY || width="100" height="25" | MAY
|-----
! width="250" height="25" | text/xml
| width="100" height="25" | MAY || width="100" height="25" | MAY
|-----
! width="250" height="25" | text/html
| width="100" height="25" | MAY
| width="100" height="25" | SHOULD NOT
|}
Example 1.
<source lang="xml">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>XHTML 1.0 Example</title>
<script type="text/javascript">
<!--//-- ><![CDATA[//><!--
function loadpdf() {
document.getElementById("pdf-object").src="http://www.w3.org/TR/xhtml1/xhtml1.pdf";
}
//-- ><!]]>
</script>
</head>
<body onload="loadpdf()">
This is an example of an
<abbr title="Extensible HyperText Markup Language">XHTML</abbr> 1.0 Strict document.<br />
<img id="validation-icon"
src="http://www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0 Strict" /><br />
<object id="pdf-object"
name="pdf-object"
type="application/pdf"
data="http://www.w3.org/TR/xhtml1/xhtml1.pdf"
width="100%"
height="500">
</object>
</body>
</html>
</source>
Example 2.
<source lang="xml">
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>XHTML 1.0 Example</title>
<script type="text/javascript">
<![CDATA[
function loadpdf() {
document.getElementById("pdf-object").src="http://www.w3.org/TR/xhtml1/xhtml1.pdf";
}
]]>
</script>
</head>
<body onload="loadpdf()">
This is an example of an
<abbr title="Extensible HyperText Markup Language">XHTML</abbr> 1.0 Strict document.<br />
<img id="validation-icon"
src="http://www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0 Strict"/><br />
<object id="pdf-object"
name="pdf-object"
type="application/pdf"
data="http://www.w3.org/TR/xhtml1/xhtml1.pdf"
width="100%"
height="500"/>
</body>
</html>
</source>
Notes:
# For further information on the media type recommendation, please refer to [http://www.w3.org/TR/2002/NOTE-xhtml-media-types-20020801/ XHTML Media Types], a W3C Note issued on 2002-08-01.
# The "loadpdf" function is actually a workaround for Internet Explorer. It can be replaced by adding<code><nowiki><param name="src" value="http://www.w3.org/TR/xhtml1/xhtml1.pdf" /></nowiki></code> within<code><nowiki><object></nowiki></code>.
# The<code>img</code> element does not get a<code>name</code> attribute in the [http://www.w3.org/TR/xhtml1/dtds.html#a_dtd_XHTML-1.0-Strict XHTML 1.0 Strict DTD]. Use<code>id</code> instead.
-->
== Editores de HTML que suportam XHTML ==
| |||