230 likes | 370 Views
Linguaggi di markup personalizzati. Caso di studio: XHTML. Linguaggi di markup personalizzati. XML è un metalinguaggio , cioè un linguaggio che permette di creare altri linguaggi. Nei prossimi lucidi verranno elencati alcuni dei più noti linguaggi di markup che sono stati creati con XML.
E N D
Linguaggi di markup personalizzati Caso di studio: XHTML
Linguaggi di markup personalizzati XML è un metalinguaggio, cioè un linguaggio che permette di creare altri linguaggi. Nei prossimi lucidi verranno elencati alcuni dei più noti linguaggi di markup che sono stati creati con XML. Poi vedremo, come esempio, uno di questi linguaggi (scelto perchè è uno dei più semplici): MathML.
EXtensible Hyper Text Markup Language (XHTML): www.w3.org/MarkUp Mathematical Markup Language (MathML): www.w3.org/Math Chemical Markup Language (CML): www.xml-cml.org Wireless Markup Language (WML): www.wapforum.org Geography Markup Language (GML): www.opengis.org Synchronized Multimedia Integration Language (SMIL): www.w3.org/AudioVideo Scalable Vector Graphics (SVG): www.w3.org/TR/SVG Bean Markup Language (BML): www.alphaworks.ibm.com/aw.nsf/techmain/bml Extensible 3D Language (X3D): www.web3d.org/x3d.html . . . Alcuni linguaggi di markup
Caso di studio: XHTML
XHTML sta per eXtensible Hyper Text Markup Language XHTML • XHTML è stato pensato per estendere (e sostituire) HTML • XHTML è molto simile a HTML 4.01 • XHTML è una versione più “rigida e pulita” di HTML • XHTML è la riformulazione di HTML definito come un’applicazione XML.
XHTML è uno standard Web XHTML 1.0 è diventato una Raccomandazione ufficiale del W3C nel Gennaio del 2000. Se una specifica diventa una Raccomandazione ufficiale W3C significa che tale specifica è ormai STABILE, cioè che è stata revisionata con successo dal W3C membership e che quindi può essere considerata uno standard Web (ha superato tutto il lungo processo di revisione). XHTML è considerato la nuova generazione di HTML, ma ci vorrà tempo perchè tutti i browsers e gli applicativi software siano in grado di leggerlo e processarlo. XHTML è una combinazione di HTML e XML: consiste di tutti gli elementi di HTML 4.01 (compatibilità con HTML 4.01) con la sintassi di XML.
Perchè XHTML? Si è ormai arrivati ad un punto nel quale molte pagine Web contengono “bad” HTML. Consideriamo ad esempio il seguente codice: <html> <head> <title>This is bad HTML</title> <body> <h1>Bad HTML </body> Visualizza Questo codice HTML viene visualizzato correttamente dal browser nonostante non sia “ben formato”. XHTML, integrando HTML e XML, permette di scrivere documenti HTML ben formati.
HTML XHTML Nei prossimi lucidi vedremo i 10 cambiamenti necessari per trasformare un documento HTML 4.01 in uno XHTML.
1. Documenti conformi alle regole XML • Gli elementi devono essere annidati in modo corretto. HTML: <b><i>This text is bold and italic</b></i> XHTML: <b><i>This text is bold and italic</i></b> • I documenti devono essere ben formati. Tutti gli elementi XHTML devono essere annidati all’interno dell’elemento root <html>. Tutti gli altri elementi possono avere sotto-elementi (figli). I figli devono essere in coppie e correttamente annidati all’interno del loro elemento padre. <html> <head> . . . </head> <body> . . . </body> </html> STRUTTURA BASE DI UN DOCUMENTO
I documenti XHTML sono applicazioni XML. XML è case-sensitive: tag come <br> e <BR> sono interpretati come elementi diversi! <BODY> <P>This is a paragraph.</P> </BODY> Questo è sbagliato! <body> <p>This is a paragraph.</p> </body> Questo è corretto! 2. Nomi elementi in minuscolo
<p>This is a paragraph. <li>This is a list item. Questo è sbagliato! <p>This is a paragraph.</p> <li>This is a list item.</li> Questo è corretto! 3. Elementi XHTML devono essere chiusi • Tutti gli elementi XHTML devono essere chiusi. Gli elementi non vuoti devono avere un tag di chiusura.
4. Anche gli elementi vuoti devono essere chiusi • Gli elementi vuoti devono avere un tag di fine oppure devono finire con />. This is a line break.<br> Check out this horizontal rule:<hr> What a cool image! <img src=“filename.gif”> Questo è sbagliato! This is a line break.<br></br> Check out this horizontal rule:<hr /> What a cool image! <img src=“filename.gif” /> Questo è corretto!
<table WIDTH=“100%”> <div ALIGN=“center”> Questo è sbagliato! <table width=“100%”> <div align=“center”> Questo è corretto! 5. Nomi attributi • I nomi degli attributi devono essere in minuscolo.
6. Valori attributi • I valori degli attributi devono essere tra virgolette. <table width=100%> <img height=200 width=250> Questo è sbagliato! <table width=“100%”> <img height=“200” width=“250” /> Questo è corretto!
<input checked> <option selected> Questo è sbagliato! <input checked=“checked” /> <option selected=“selected” /> Questo è corretto! 7. Gli attributi devono avere valori
<img src=“filename.gif” name=“picture1” /> <a name=“namedanchor”></a> Questo è sbagliato! <img src=“filename.gif” id=“picture1” /> <a id=“namedanchor”></a> Questo è corretto! 8. Attributo “name” sostituito con “id” • HTML 4.01 definisce un attributo “name” per gli elementi: a, applet, frame, iframe, img, map. In XHTML si usa l’attributo id al posto di “name”.
9. XHTML DTD definisce elementi obbligatori • Tutti i documenti XHTML devono avere una dichiarazione DOCTYPE. Gli elementi html, head e body devono essere presenti e l’elemento title deve essere presente all’interno di head. Modello di documento XHTML: <!DOCTYPE Indicare qui il tipo di documento> <html> <head> <title>Indicare qui il titolo</title> </head> <body> Corpo del documento </body> </html> Può non avere il tag di chiusura!
10. <!DOCTYPE> obbligatoria • La dichiarazione DOCTYPE deve essere sempre la prima linea in un documento XHTML. DOCTYPE definisce il tipo di documento. Il tipo di documento viene indicato con un XHTML DTD (Document Type Definition). Un XHTML DTD descrive, con un linguaggio preciso e computer-readable, la sintassi e la grammatica da rispettare per qualsiasi documento XHTML. Attualmente ci sono 3 differenti XHTML DTD.
Tipi di documento XHTML XHTML 1.0 Strict: questo DTD è consigliato quando la presentazione del documento è controllata da un CSS. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> XHTML 1.0 Transitional: questo DTD è consigliato quando si vuole supportare browsers che non gestiscono CSS. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> XHTML 1.0 Frameset: questo DTD è consigliato quando si vuole supportare i frames. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Namespace XHTML L’elemento radice <html> deve indicare la dichiarazione di un namespace XML usando l’attributo xmlns. Il namespace deve essere: “http://www.w3.org/1999/xhtml” <!DOCTYPE ... (Strict o Transitional o Frameset)> <html xmlns=“http://www.w3.org/1999/xhtml”> <head> <title>Indicare qui il titolo</title> </head> <body> Corpo del documento </body> </html> Nuovo modello di documento XHTML
Schema PROLOGO XHTML <?xml version=“1.0” ?> <!DOCTYPE ... (Strict o Transitional o Frameset)> Prologo • Il prologo di un documento XHTML è composto da due parti: • la dichiarazione XML • la definizione del DOCTYPE (vedi lucidi precedenti) La dichiarazione XML (<?xml version=“1.0”?>) rende esplicito il fatto che il documento è XML. Tale dichiarazione NON è obbligatoria, ma il suo uso è consigliato dal W3C per ogni documento XML.
Riepiloghiamo con un esempio PROLOGO <?xml version=“1.0”?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ELEMENTO RADICE <html xmlns=“http://www.w3.org/1999/xhtml”> <head> <title>Esempio di pagina XHTML</title> </head> TESTATA • <body> • <h1>Salve</h1> • <p>Questo è un primo esempio di pagina XHTML!</p> • </body> CORPO </html>
Validare un documento XHTML Un documento XHTML è valido se rispetta le regole definite nel DTD XHTML. Perchè un documento XHTML possa essere correttamente validato, deve contenere una dichiarazione di DTD al suo interno (vedi dichiarazione DOCTYPE). Per validare un documento XHTML rispetto a un certo DTD è necessario quindi un validatore. Per usare il validatore XHTML del W3C basta andare alla pagina Web http://validator.w3.org (provarlo per esercizio!)