XHTML - Guida rapida
XHTML sta per EXtensibile HyperText Markup Langoscia. È il passo successivo nell'evoluzione di Internet. L'XHTML 1.0 è il primo tipo di documento nella famiglia XHTML.
XHTML è quasi identico a HTML 4.01 con solo poche differenze. Questa è una versione più pulita e rigorosa di HTML 4.01. Se conosci già l'HTML, devi prestare poca attenzione per imparare l'ultima versione dell'HTML.
XHTML è stato sviluppato dal World Wide Web Consortium (W3C) per aiutare gli sviluppatori web a fare la transizione da HTML a XML. Migrando a XHTML oggi, gli sviluppatori web possono entrare nel mondo XML con tutti i suoi vantaggi, pur rimanendo fiduciosi nella compatibilità con le versioni precedenti e future del contenuto.
Perché utilizzare XHTML?
Gli sviluppatori che migrano i propri contenuti a XHTML 1.0 ottengono i seguenti vantaggi:
I documenti XHTML sono conformi all'XML poiché possono essere facilmente visualizzati, modificati e convalidati con strumenti XML standard.
I documenti XHTML possono essere scritti per funzionare meglio di prima nei browser esistenti così come nei nuovi browser.
I documenti XHTML possono utilizzare applicazioni come script e applet che si basano su HTML Document Object Model o XML Document Object Model.
XHTML ti offre un formato più coerente e ben strutturato in modo che le tue pagine web possano essere facilmente analizzate ed elaborate dai browser web presenti e futuri.
Puoi facilmente mantenere, modificare, convertire e formattare il tuo documento a lungo termine.
Poiché XHTML è uno standard ufficiale del W3C, il tuo sito web diventa più compatibile con molti browser e viene visualizzato in modo più accurato.
XHTML combina la forza di HTML e XML. Inoltre, le pagine XHTML possono essere visualizzate da tutti i browser abilitati per XML.
XHTML definisce lo standard di qualità per le tue pagine web e se lo segui, le tue pagine web vengono conteggiate come pagine web di qualità. Il W3C certifica quelle pagine con il loro timbro di qualità.
Gli sviluppatori Web ei progettisti di browser Web sono alla continua scoperta di nuovi modi per esprimere le proprie idee attraverso nuovi linguaggi di markup. In XML, è relativamente facile introdurre nuovi elementi o attributi di elementi aggiuntivi. La famiglia XHTML è progettata per accogliere queste estensioni tramite moduli XHTML e tecniche per lo sviluppo di nuovi moduli conformi a XHTML. Questi moduli consentono la combinazione di funzionalità esistenti e nuove al momento dello sviluppo di contenuti e della progettazione di nuovi programmi utente.
Comprensione di base
Prima di procedere oltre, diamo una rapida visione di cosa sono HTML, XML e SGML.
Cos'è l'SGML?
Questo è Sstandard Generalizzato Markup Lapplicazione anguage (SGML) conforme allo standard internazionale ISO 8879. HTML è ampiamente considerato il linguaggio di pubblicazione standard del World Wide Web.
Questo è un linguaggio per descrivere i linguaggi di markup, in particolare quelli utilizzati nello scambio di documenti elettronici, nella gestione dei documenti e nella pubblicazione di documenti. HTML è un esempio di un linguaggio definito in SGML.
Cos'è l'XML?
XML sta per EXtensibile Markup Langoscia. XML è un linguaggio di markup molto simile all'HTML ed è stato progettato per descrivere i dati. I tag XML non sono predefiniti. È necessario definire i propri tag in base alle proprie esigenze.
La sintassi XHTML è molto simile alla sintassi HTML e quasi tutti gli elementi HTML validi sono validi anche in XHTML. Ma quando scrivi un documento XHTML, devi prestare un po 'più di attenzione per rendere il tuo documento HTML conforme a XHTML.
Ecco i punti importanti da ricordare durante la scrittura di un nuovo documento XHTML o la conversione di un documento HTML esistente in un documento XHTML:
Scrivi una dichiarazione DOCTYPE all'inizio del documento XHTML.
Scrivi tutti i tag e gli attributi XHTML solo in minuscolo.
Chiudi correttamente tutti i tag XHTML.
Nidifica correttamente tutti i tag.
Cita tutti i valori degli attributi.
Vieta la minimizzazione degli attributi.
Sostituisci il name attributo con il id attributo.
Deprecare il language attributo del tag script.
Ecco la spiegazione dettagliata delle regole XHTML di cui sopra:
Dichiarazione DOCTYPE
Tutti i documenti XHTML devono avere una dichiarazione DOCTYPE all'inizio. Ci sono tre tipi di dichiarazioni DOCTYPE, che sono discusse in dettaglio nel capitolo XHTML Doctypes. Ecco un esempio di utilizzo di DOCTYPE:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">Maiuscole / minuscole
XHTML è un linguaggio di markup case sensitive. Tutti i tag e gli attributi XHTML devono essere scritti solo in minuscolo.
<!-- This is invalid in XHTML -->
<A Href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</A>
<!-- Correct XHTML way of writing this is as follows -->
<a href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</a>Nell'esempio, Href e tag di ancoraggio A non sono in minuscolo, quindi non è corretto.
Chiusura dei tag
Ogni tag XHTML dovrebbe avere un tag di chiusura equivalente, anche gli elementi vuoti dovrebbero avere tag di chiusura. Ecco un esempio che mostra modi validi e non validi di utilizzare i tag:
<!-- This is invalid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.
<!-- This is also invalid in XHTML -->
<img src="/images/xhtml.gif" >La sintassi seguente mostra il modo corretto di scrivere i tag sopra in XHTML. La differenza è che qui abbiamo chiuso correttamente entrambi i tag.
<!-- This is valid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.</p>
<!-- This is also valid now -->
<img src="/images/xhtml.gif" />Citazioni sugli attributi
Tutti i valori degli attributi XHTML devono essere citati. Altrimenti, il tuo documento XHTML viene considerato come un documento non valido. Ecco l'esempio che mostra la sintassi:
<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" width=250 height=50 />
<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" width="250" height="50" />Minimizzazione degli attributi
XHTML non consente la minimizzazione degli attributi. Significa che devi dichiarare esplicitamente l'attributo e il suo valore. L'esempio seguente mostra la differenza:
<!-- This is invalid in XHTML -->
<option selected>
<!-- Correct XHTML way of writing this is as follows -->
<option selected="selected">Ecco un elenco degli attributi ridotti a icona in HTML e il modo in cui devi scriverli in XHTML:
| Stile HTML | Stile XHTML |
|---|---|
| compatto | compact = "compatto" |
| controllato | controllato = "verificato" |
| dichiarare | declare = "declare" |
| sola lettura | readonly = "readonly" |
| Disabilitato | disabled = "disabled" |
| selezionato | selected = "selezionato" |
| differire | defer = "defer" |
| ismap | ismap = "ismap" |
| nohref | nohref = "nohref" |
| noshade | noshade = "noshade" |
| nowrap | nowrap = "nowrap" |
| multiple | multiple = "multiple" |
| noresize | noresize = "noresize" |
L' attributo id
L'attributo id sostituisce l'attributo name. Invece di usare name = "name", XHTML preferisce usare id = "id". L'esempio seguente mostra come:
<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" name="xhtml_logo" />
<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" id="xhtml_logo" />L' attributo della lingua
L'attributo della lingua del tag script è obsoleto. L'esempio seguente mostra questa differenza:
<!-- This is invalid in XHTML -->
<script language="JavaScript" type="text/JavaScript">
document.write("Hello XHTML!");
</script>
<!-- Correct XHTML way of writing this is as follows -->
<script type="text/JavaScript">
document.write("Hello XHTML!");
</script>Tag annidati
Devi nidificare correttamente tutti i tag XHTML. Altrimenti il tuo documento viene considerato come un documento XHTML errato. L'esempio seguente mostra la sintassi:
<!-- This is invalid in XHTML -->
<b><i> This text is bold and italic</b></i>
<!-- Correct XHTML way of writing this is as follows -->
<b><i> This text is bold and italic</i></b>Divieti di elementi
I seguenti elementi non possono contenere altri elementi al loro interno. Questo divieto si applica a tutte le profondità di nidificazione. Significa che include tutti gli elementi discendenti.
| Elemento | Divieto |
|---|---|
| <a> | Non deve contenere altri <a> elementi. |
| <pre> | Non deve contenere gli elementi <img>, <object>, <big>, <small>, <sub> o <sup>. |
| <button> | Non deve contenere gli elementi <input>, <select>, <textarea>, <label>, <button>, <form>, <fieldset>, <iframe> o <isindex>. |
| <etichetta> | Non deve contenere altri elementi <label>. |
| <form> | Non deve contenere altri elementi <form>. |
Un documento XHTML minimo
Il seguente esempio mostra un contenuto minimo di un documento XHTML 1.0 -
<?xml version="1.0" encoding="UTF-8"?>
<!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/TR/xhtml1" xml:lang="en" lang="en">
<head>
<title>Every document must have a title</title>
</head>
<body>
...your content goes here...
</body>
</html>A causa del fatto che XHTML è un'applicazione XML, alcune pratiche che erano perfettamente legali nell'HTML 4 basato su SGML devono essere cambiate. Hai già visto la sintassi XHTML nel capitolo precedente, quindi le differenze tra XHTML e HTML sono molto evidenti. Di seguito è riportato il confronto tra XHTML e HTML.
I documenti XHTML devono essere ben formati
La buona formazione è un nuovo concetto introdotto da XML. In sostanza, questo significa che tutti gli elementi devono avere tag di chiusura e devi nidificarli correttamente.
CORRECT: Nested Elements
<p>Here is an emphasized <em>paragraph</em>.</p>INCORRECT: Overlapping Elements
<p>Here is an emphasized <em>paragraph.</p></em>Gli elementi e gli attributi devono essere in minuscolo
I documenti XHTML devono utilizzare lettere minuscole per tutti gli elementi HTML e i nomi degli attributi. Questa differenza è necessaria perché si presume che il documento XHTML sia un documento XML e XML fa distinzione tra maiuscole e minuscole. Ad esempio, <li> e <LI> sono tag diversi.
I tag finali sono obbligatori per tutti gli elementi
In HTML, alcuni elementi possono omettere il tag di fine. Ma XML non consente l'omissione dei tag di fine.
CORRECT: Terminated Elements
<p>Here is a paragraph.</p><p>here is another paragraph.</p>
<br><hr/>INCORRECT: Unterminated Elements
<p>Here is a paragraph.<p>here is another paragraph.
<br><hr>I valori degli attributi devono essere sempre quotati
Tutti i valori degli attributi, compresi i valori numerici, devono essere citati.
CORRECT: Quoted Attribute Values
<td rowspan="3">INCORRECT: Unquoted Attribute Values
<td rowspan=3>Minimizzazione degli attributi
XML non supporta la minimizzazione degli attributi. Le coppie valore-attributo devono essere scritte per intero. I nomi degli attributi come compatto e verificato non possono essere presenti negli elementi senza che venga specificato il loro valore.
CORRECT: Non Minimized Attributes
<dl compact="compact">INCORRECT: Minimized Attributes
<dl compact>Gestione degli spazi vuoti nei valori degli attributi
Quando un browser elabora gli attributi, esegue le seguenti operazioni:
Strisce iniziali e finali di spazi bianchi.
Associa le sequenze di uno o più caratteri di spazio bianco (comprese le interruzioni di riga) a un singolo spazio tra le parole.
Script ed elementi di stile
In XHTML, lo script e gli elementi di stile non dovrebbero avere direttamente i caratteri "<" e "&", se esistono; quindi vengono trattati come l'inizio del markup. Le entità come "<" e "&" sono riconosciute come riferimenti di entità dal processore XML per la visualizzazione rispettivamente dei caratteri "<" e "&".
Il wrapping del contenuto dello script o dell'elemento di stile all'interno di una sezione contrassegnata da CDATA evita l'espansione di queste entità.
<script type="text/JavaScript">
<![CDATA[
... unescaped VB or Java Script here... ...
]]>
</script>Un'alternativa è usare script e documenti di stile esterni.
Gli elementi con attributi id e name
XHTML consiglia la sostituzione dell'attributo name con l' attributo id . Si noti che in XHTML 1.0, l' attributo name di questi elementi è formalmente deprecato e verrà rimosso nelle versioni successive di XHTML.
Attributi con set di valori predefiniti
HTML e XHTML hanno entrambi alcuni attributi con set di valori predefiniti e limitati. Per esempio,type attributo del inputelemento. In HTML e XML, questi vengono chiamatienumerated attributes. In HTML 4, l'interpretazione di questi valori non faceva distinzione tra maiuscole e minuscole, quindi un valore diTEXT era equivalente a un valore di text.
In XHTML, l'interpretazione di questi valori fa distinzione tra maiuscole e minuscole, quindi tutti questi valori sono definiti in minuscolo.
Riferimenti di entità come valori esadecimali
Sia HTML che XML consentono riferimenti a caratteri utilizzando un valore esadecimale. In HTML questi riferimenti potrebbero essere fatti usando entrambi&#Xnn; o &#xnn; e sono validi ma nei documenti XHTML, è necessario utilizzare solo la versione minuscola come &#xnn;.
L'elemento <html> è un must
Tutti gli elementi XHTML devono essere nidificati all'interno dell'elemento radice <html>. Tutti gli altri elementi possono avere sottoelementi che devono essere in coppia e correttamente annidati all'interno del loro elemento genitore. La struttura di base del documento è:
<!DOCTYPE html....>
<html>
<head> ... </head>
<body> ... </body>
</html>Lo standard XHTML definisce tre DTD (Document Type Definitions). Quello più comunemente usato e facile è il documento XHTML Transitional.
Le definizioni del tipo di documento XHTML 1.0 corrispondono a tre DTD:
- Strict
- Transitional
- Frameset
Ci sono pochi elementi e attributi XHTML, che sono disponibili in una DTD ma non disponibili in un'altra DTD. Pertanto, mentre scrivi il tuo documento XHTML, devi selezionare attentamente i tuoi elementi o attributi XHTML. Tuttavia, il validatore XHTML ti aiuta a identificare elementi e attributi validi e non validi.
Si prega di controllare le convalide XHTML per maggiori dettagli su questo.
XHTML 1.0 Strict
Se si prevede di utilizzare rigorosamente Cascading Style Sheet (CSS) ed evitare di scrivere la maggior parte degli attributi XHTML, si consiglia di utilizzare questo DTD. Un documento conforme a questo DTD è della migliore qualità.
Se vuoi usare XHTML 1.0 Strict DTD, devi includere la seguente riga all'inizio del tuo documento XHTML.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">XHTML 1.0 Transitional
Se stai pianificando di utilizzare molti attributi XHTML e poche proprietà Cascading Style Sheet, allora dovresti adottare questo DTD e dovresti scrivere il tuo documento XHTML di conseguenza.
Se vuoi usare XHTML 1.0 Transitional DTD, allora devi includere la seguente riga nella parte superiore del tuo documento XHTML.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">Set di frame XHTML 1.0
È possibile utilizzarlo quando si desidera utilizzare i frame HTML per partizionare la finestra del browser in due o più frame.
Se vuoi usare XHTML 1.0 Frameset DTD, allora devi includere la seguente riga nella parte superiore del tuo documento XHTML.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">Note- Non importa quale DTD stai usando per scrivere il tuo documento XHTML; se è un documento XHTML valido, il tuo documento è considerato come un documento di buona qualità.
Ci sono alcuni attributi XHTML / HTML che sono standard e associati a tutti i tag XHTML / HTML. Questi attributi sono elencati qui con una breve descrizione:
Attributi fondamentali
Non valido negli elementi base, head, html, meta, param, script, style e title.
| Attributo | Valore | Descrizione |
|---|---|---|
| classe | class_rule o style_rule | La classe dell'elemento. |
| Id | id_name | Un ID univoco per l'elemento. |
| stile | style_definition | Una definizione di stile in linea. |
| Titolo | tooltip_text | Un testo da visualizzare in un suggerimento del mouse. |
Attributi della lingua
Il langattributo indica la lingua utilizzata per il contenuto allegato. La lingua viene identificata utilizzando le abbreviazioni della lingua standard ISO, comefr per il francese, enper l'inglese e così via. Ulteriori codici e relativi formati sono descritti su www.ietf.org .
Non valido negli elementi base, br, frame, frameset, hr, iframe, param e script.
| Attributo | Valore | Descrizione |
|---|---|---|
| dir | ltr | rtl | Imposta la direzione del testo. |
| lang | language_code | Imposta il codice della lingua. |
Attributi proprietari di Microsoft
Microsoft ha introdotto una serie di nuovi attributi proprietari con Internet Explorer 4 e versioni successive.
| Attributo | Valore | Descrizione |
|---|---|---|
| chiave di accesso | personaggio | Imposta una scorciatoia da tastiera per accedere a un elemento. |
| linguaggio | corda | Questo attributo specifica il linguaggio di scripting da utilizzare con uno script associato associato all'elemento, in genere tramite un attributo del gestore eventi. I valori possibili potrebbero includere JavaScript, jScript, VBS e VBScript. |
| tabindex | numero | Imposta l'ordine di tabulazione di un elemento. |
| contenteditable | booleano | Consente agli utenti di modificare il contenuto visualizzato in Internet Explorer 5.5 o versioni successive. I valori possibili sono veri o falsi. |
| Disabilitato | booleano | Gli elementi con l'attributo disabilitato potrebbero apparire sbiaditi e non rispondere all'input dell'utente. I valori possibili sono veri o falsi. |
| hidefocus | acceso o spento | Questo attributo proprietario, introdotto con Internet Explorer 5.5, nasconde il focus sul contenuto di un elemento. Il focus deve essere applicato all'elemento utilizzando l'attributo tabindex. |
| non selezionabile | acceso o spento | Utilizzato per impedire la selezione del contenuto visualizzato in Internet Explorer 5.5. |
Quando gli utenti visitano un sito web, fanno cose come fare clic su testo, immagini e collegamenti ipertestuali, passare il mouse sopra le cose, ecc. Questi sono esempi di ciò che JavaScript chiama eventi.
Possiamo scrivere i nostri gestori di eventi in JavaScript o VBScript e possiamo specificare questi gestori di eventi come valore dell'attributo del tag di evento. L'XHTML 1.0 ha un insieme simile di eventi che è disponibile nella specifica HTML 4.01.
Gli eventi di livello <body> e <frameset>
Ci sono solo due attributi che possono essere utilizzati per attivare qualsiasi codice JavaScript o VBScript, quando si verifica un evento a livello di documento.
| Attributo | Valore | Descrizione |
|---|---|---|
| onload | Script | Lo script viene eseguito quando viene caricato un documento XHTML. |
| onunload | Script | Lo script viene eseguito quando viene scaricato un documento XHTML. |
Note - Qui, lo script si riferisce a qualsiasi funzione o parte di codice di VBScript o JavaScript.
Gli eventi di livello <form>
Ci sono i seguenti sei attributi che possono essere utilizzati per attivare qualsiasi codice JavaScript o VBScript quando si verifica un evento a livello di modulo.
| Attributo | Valore | Descrizione |
|---|---|---|
| onchange | Script | Lo script viene eseguito quando l'elemento cambia. |
| onsubmit | Script | Lo script viene eseguito quando il modulo viene inviato. |
| onreset | Script | Lo script viene eseguito quando il modulo viene reimpostato. |
| onselect | Script | Lo script viene eseguito quando l'elemento è selezionato. |
| sfocato | Script | Lo script viene eseguito quando l'elemento perde il focus. |
| onfocus | Script | Lo script viene eseguito quando l'elemento viene attivato. |
Eventi di tastiera
I seguenti tre eventi sono generati dalla tastiera. Questi eventi non sono validi negli elementi base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style e title.
| Attributo | Valore | Descrizione |
|---|---|---|
| onkeydown | Script | Lo script viene eseguito alla pressione del tasto. |
| onkeypress | Script | Lo script viene eseguito alla pressione e al rilascio del tasto. |
| onkeyup | Script | Lo script esegue il rilascio della chiave. |
Altri eventi
I seguenti sette eventi vengono generati dal mouse quando entra in contatto con qualsiasi tag HTML. Questi eventi non sono validi negli elementi base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style e title.
| Attributo | Valore | Descrizione |
|---|---|---|
| al clic | Script | Lo script viene eseguito con un clic del mouse. |
| ondblclick | Script | Lo script viene eseguito con un doppio clic del mouse. |
| onmousedown | Script | Lo script viene eseguito quando viene premuto il pulsante del mouse. |
| onmousemove | Script | Lo script viene eseguito quando il puntatore del mouse si sposta. |
| onmouseout | Script | Lo script viene eseguito quando il puntatore del mouse esce da un elemento. |
| onmouseover | Script | Lo script viene eseguito quando il puntatore del mouse si sposta su un elemento. |
| onmouseup | Script | Lo script viene eseguito quando viene rilasciato il pulsante del mouse. |
Il W3C ha aiutato a spostare la comunità di sviluppo di contenuti Internet dai giorni di markup non standard e malformato al mondo valido e ben formato dell'XML. In XHTML 1.0, questa mossa è stata moderata dall'obiettivo di fornire una facile migrazione dei contenuti esistenti basati su HTML 4 (o precedenti) a XHTML e XML.
Il W3C ha rimosso il supporto per elementi e attributi deprecati dalla famiglia XHTML. Questi elementi e attributi avevano funzionalità in gran parte orientate alla presentazione che è meglio gestita tramite fogli di stile o comportamenti predefiniti specifici del cliente.
Ora l'HTML Working Group del W3C ha definito un tipo di documento iniziale basato esclusivamente su moduli che sono XHTML 1.1. Questo tipo di documento è progettato per essere trasferibile su un'ampia raccolta di dispositivi client e applicabile alla maggior parte dei contenuti Internet.
Conformità del documento
L'XHTML 1.1 fornisce una definizione di documenti XHTML strettamente conformi che DEVONO soddisfare tutti i seguenti criteri:
Il documento DEVE essere conforme ai vincoli espressi in XHTML 1.1 Document Type Definition.
L'elemento radice del documento DEVE essere <html>.
L'elemento radice del documento DEVE designare lo spazio dei nomi XHTML utilizzando l' attributo xmlns .
L'elemento radice PU contenere anche un attributo di posizione dello schema come definito nello schema XML.
Ci DEVE essere una dichiarazione DOCTYPE nel documento prima dell'elemento radice. Se è presente, l'identificativo pubblico incluso nella dichiarazione DOCTYPE DEVE fare riferimento alla DTD trovata in XHTML 1.1 Document Type Definition.
Ecco un esempio di un documento XHTML 1.1:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.w3.org/MarkUp/SCHEMA/xhtml11.xsd" xml:lang="en">
<head>
<title>This is the document title</title>
</head>
<body>
<p>Moved to <a href="http://example.org/">example.org</a>.</p>
</body>
</html>Note- In questo esempio, è inclusa la dichiarazione XML. Una dichiarazione XML come quella sopra non è richiesta in tutti i documenti XML. Gli autori di documenti XHTML sono fortemente incoraggiati a usare dichiarazioni XML in tutti i loro documenti. Tale dichiarazione è richiesta quando la codifica dei caratteri del documento è diversa da quella predefinita UTF-8 o UTF-16.
Moduli XHTML 1.1
Il tipo di documento XHTML 1.1 è costituito dai seguenti moduli XHTML.
Structure Module- Il Modulo Struttura definisce i principali elementi strutturali per XHTML. Questi elementi agiscono efficacemente come base per il modello di contenuto di molti tipi di documenti della famiglia XHTML. Gli elementi e gli attributi inclusi in questo modulo sono: body, head, html e title.
Text Module - Questo modulo definisce tutti gli elementi di base del contenitore di testo, gli attributi e il relativo modello di contenuto: abbr, acronym, address, blockquote, br, cite, code, dfn, div, em, h1, h2, h3, h4, h5, h6 , kbd, p, pre, q, samp, span, strong e var.
Hypertext Module- Il modulo ipertestuale fornisce l'elemento utilizzato per definire i collegamenti ipertestuali ad altre risorse. Questo modulo supporta l'elemento a.
List Module- Come suggerisce il nome, il modulo List fornisce elementi orientati agli elenchi. In particolare, il modulo List supporta i seguenti elementi e attributi: dl, dt, dd, ol, ul e li.
Object Module- Il modulo oggetti fornisce elementi per l'inclusione di oggetti di uso generale. In particolare, il modulo Object supporta - object e param.
Presentation Module - Questo modulo definisce elementi, attributi e un modello di contenuto minimo per un semplice markup relativo alla presentazione: b, big, hr, i, small, sub, sup e tt.
Edit Module - Questo modulo definisce elementi e attributi da utilizzare nel markup relativo alla modifica: del e ins.
Bidirectional Text Module - Il modulo Testo bidirezionale definisce un elemento che può essere utilizzato per dichiarare le regole bidirezionali per il contenuto dell'elemento - bdo.
Forms Module- Fornisce tutte le funzionalità del modulo trovate in HTML 4.0. In particolare, supporta: pulsante, fieldset, modulo, input, etichetta, legenda, selezione, gruppo ottico, opzione e area di testo.
Table Module - Supporta i seguenti elementi, attributi e modello di contenuto: caption, col, colgroup, table, tbody, td, tfoot, th, thead e tr.
Image Module- Fornisce l'incorporamento di immagini di base e può essere utilizzato in alcune implementazioni di mappe di immagini lato client in modo indipendente. Supporta l'elemento - img.
Client-side Image Map Module - Fornisce elementi per mappe immagine lato client - area e mappa.
Server-side Image Map Module- Fornisce supporto per la selezione delle immagini e la trasmissione delle coordinate di selezione. Il modulo di mappa immagine lato server supporta - l'attributo ismap su img.
Intrinsic Events Module - Supporta tutti gli eventi discussi in XHTML Events.
Meta information Module- Il modulo Meta information definisce un elemento che descrive le informazioni all'interno della parte dichiarativa di un documento. Include meta elemento.
Scripting Module- Definisce gli elementi utilizzati per contenere le informazioni relative agli script eseguibili o alla mancanza di supporto per gli script eseguibili. Gli elementi e gli attributi inclusi in questo modulo sono: noscript e script.
Style Sheet Module- Definisce un elemento da usare quando si dichiarano i fogli di stile interni. L'elemento e l'attributo definiti da questo modulo è - style.
Style Attribute Module (Deprecated) - Definisce l'attributo di stile.
Link Module- Definisce un elemento che può essere utilizzato per definire collegamenti a risorse esterne. Supporta l' elemento di collegamento .
Base Module- Definisce un elemento che può essere utilizzato per definire un URI di base rispetto al quale vengono risolti gli URI relativi nel documento. L'elemento e l'attributo inclusi in questo modulo è - base .
Ruby Annotation Module - XHTML utilizza anche il modulo Annotazione Ruby come definito in RUBY e supporta - ruby, rbc, rtc, rb, rt e rp.
Modifiche rispetto a XHTML 1.0 Strict
Questa sezione descrive le differenze tra XHTML 1.1 e XHTML 1.0 Strict. XHTML 1.1 rappresenta una deviazione sia da HTML 4 che da XHTML 1.0.
La più significativa è la rimozione di funzionalità obsolete.
Le modifiche possono essere riassunte come segue:
Su ogni elemento, l'attributo lang è stato rimosso a favore dell'attributo xml: lang .
Sugli elementi <a> e <map>, l'attributo name è stato rimosso a favore dell'attributo id.
È stata aggiunta la raccolta di elementi rubino .
Questo capitolo elenca vari suggerimenti e trucchi di cui dovresti essere a conoscenza mentre scrivi un documento XHTML. Questi suggerimenti e trucchi possono aiutarti a creare documenti efficaci.
Suggerimenti per la progettazione di documenti XHTML
Ecco alcune linee guida di base per la progettazione di documenti XHTML:
Progettare per servire e coinvolgere il tuo pubblico
Quando pensi di soddisfare ciò che il tuo pubblico desidera, devi progettare documenti efficaci e accattivanti per servire allo scopo. Il tuo documento dovrebbe essere facile per trovare le informazioni richieste e fornire un ambiente familiare.
Ad esempio, gli accademici o i medici sono a proprio agio con documenti simili a giornali con frasi lunghe, diagrammi complessi, terminologie specifiche, ecc., Mentre il documento a cui accedono i bambini in età scolare deve essere semplice e informativo.
Riutilizza il tuo documento
Riutilizza i tuoi documenti di successo creati in precedenza invece di ricominciare da zero ogni volta che raccogli un nuovo progetto.
All'interno del documento XHTML
Ecco alcuni suggerimenti riguardanti gli elementi all'interno del documento XHTML:
La dichiarazione XML
Una dichiarazione XML non è richiesta in tutti i documenti XHTML, ma gli autori di documenti XHTML sono fortemente incoraggiati a usare dichiarazioni XML in tutti i loro documenti. Tale dichiarazione è richiesta quando la codifica dei caratteri del documento è diversa da quella predefinita UTF-8 o UTF-16.
Elementi vuoti
Includono uno spazio prima del finale / e> di elementi vuoti. Ad esempio, <br />, <hr /> e <img src = "/ html / xhtml.gif" alt = "xhtml" />.
Fogli di stile e script incorporati
Usa fogli di stile esterni se il tuo foglio di stile utilizza "<", "&", "]]>" o "-".
Utilizza script esterni se lo script utilizza "<", "&" o "]]>" o "-".
Interruzioni di riga all'interno dei valori degli attributi
Evita interruzioni di riga e più caratteri di spazi bianchi all'interno dei valori degli attributi. Questi vengono gestiti in modo incoerente da browser diversi.
Elemento Isindex
Non includere più di un elemento isindex nell'intestazione del documento. L' elemento isindex è deprecato a favore dell'elemento input.
Gli attributi lang e xml: lang
Usa gli attributi lang e xml: lang mentre specifichi la lingua di un elemento. Il valore dell'attributo xml: lang ha la precedenza.
Identificatori di elementi
XHTML 1.0 ha deprecato gli attributi name di elementi a, applet, form, frame, iframe, img e map . Verranno rimossi da XHTML nelle versioni successive. Pertanto, inizia a utilizzare l' elemento id per l'identificazione degli elementi.
Utilizzo di e commerciali nei valori degli attributi
Il carattere e commerciale ("&") deve essere presentato come riferimento di entità &.
Esempio
<!-- This is invalid in XHTML -->
http://my.site.dom/cgi-bin/myscript.pl?class=guest&name=user.
<!-- Correct XHTML way of writing this is as follows -->
http://my.site.dom/cgi-bin/myscript.pl?class=guest&name=userCaratteri di spazi bianchi in HTML e XML
Alcuni caratteri che sono legali nei documenti HTML sono illegali nel documento XML. Ad esempio, in HTML, il carattere form-feed (U + 000C) viene trattato come uno spazio bianco, in XHTML, a causa della definizione dei caratteri di XML, è illegale.
Riferimento ai personaggi con nome & Apos;
Il riferimento al carattere denominato '(l'apostrofo, U + 0027) è stato introdotto in XML 1.0 ma non appare in HTML. Gli sviluppatori web dovrebbero quindi utilizzare & # 39; invece di 'funzionare come previsto nei browser Web HTML 4.
Ogni documento XHTML viene convalidato rispetto a una definizione del tipo di documento. Prima di convalidare correttamente un file XHTML, è necessario aggiungere un DTD corretto come prima o seconda riga del file.
Una volta che sei pronto per convalidare il tuo documento XHTML, puoi utilizzare W3C Validator per convalidare il tuo documento. Questo strumento è molto utile e ti aiuta a risolvere i problemi con il tuo documento. Questo strumento non richiede alcuna competenza per eseguire la convalida.
La seguente dichiarazione nella casella di testo mostra i dettagli. È necessario fornire l'URL completo della pagina, che si desidera convalidare, quindi fare clicValidate Page pulsante.
Inserisci l'indirizzo della tua pagina nella casella sottostante -
Questo validatore controlla la validità del markup dei documenti web con vari formati specialmente in HTML, XHTML, SMIL, MathML, ecc.
Esistono altri strumenti per eseguire diverse altre convalide.
Partiamo dal presupposto che abbiate compreso tutti i concetti relativi a XHTML. Pertanto, dovresti essere in grado di scrivere il tuo documento HTML in un documento XHTML ben formato e ottenere una versione più pulita del tuo sito web.
Conversione da HTML a XHTML
Puoi convertire il tuo sito web HTML esistente in un sito web XHTML.
Esaminiamo alcuni passaggi importanti. Per convertire il documento esistente, è necessario prima decidere a quale DTD aderire e includere la definizione del tipo di documento nella parte superiore del documento.
Assicurati di avere tutti gli altri elementi richiesti. Questi includono un elemento radice <html> che indica uno spazio dei nomi XML, un elemento <head>, un elemento <title> contenuto all'interno dell'elemento <head> e un elemento <body>.
Converti tutte le parole chiave degli elementi e i nomi degli attributi in minuscolo.
Assicurati che tutti gli attributi siano nel formato nome = "valore".
Assicurati che tutti gli elementi del contenitore abbiano tag di chiusura.
Posiziona una barra in avanti all'interno di tutti gli elementi indipendenti. Ad esempio, riscrivi tutti gli elementi <br> come <br />.
Designare il codice dello script lato client e il codice del foglio di stile come sezioni CDATA.
Versioni imminenti di XHTML
Ancora XHTML è in fase di miglioramento ed è stata redatta la sua prossima versione XHTML 1.1. Ne abbiamo discusso in dettaglio nel capitolo XHTML versione 1.1.
Tag, caratteri ed entità XHTML
I tag, i caratteri e le entità XHTML sono gli stessi dell'HTML, quindi se conosci già l'HTML, non è necessario fare uno sforzo extra per imparare questi argomenti, specialmente per XHTML. Abbiamo elencato tutto il materiale HTML insieme al tutorial XHTML, perché sono applicabili anche a XHTML.
Cosa c'è dopo?
Abbiamo elencato varie risorse per XHTML e HTML, quindi se sei interessato e hai tempo a disposizione, ti consigliamo di consultare queste risorse per migliorare la tua comprensione di XHTML. Altrimenti questo tutorial deve averti fornito conoscenze sufficienti per scrivere le tue pagine web utilizzando XHTML.
Il tuo feedback su questo tutorial è benvenuto a [email protected]