docVariantes de HTML Variantes de HTML - LabUnix
download 
Plainte Transcription
Variantes de HTML Variantes de HTML - LabUnix
23/01/2013 Variantes de HTML INF2005– Programmation web– A. Obaid Variantes de HTML • Trois variantes: strict, transitional, frameset • A chacune est associé un ensemble de règles décrites par une DTD (Document Type Definition): – Éléments permis, imbrications, attributs permis, valeurs d’attributs permises,… – Définies dans un élément <!DOCTYPE> • HTML 4.x possède trois DTD 2 INF2005– Programmation web– A. Obaid 1 23/01/2013 Variante strict • • • • • Version privilégiée par le W3C. HTML nettoyé – H 4.01 Moins d’éléments et d’attributs Se base beaucoup sur CSS Usage intensif des éléments de bloc (<div>, <p>,…) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd" > 3 INF2005– Programmation web– A. Obaid Variante transitional • Compromis entre HTML 3.2 et HTML 4.0. • Permet les éléments et attributs obsolètes dits deprecated: – align, bgcolor,… • Existe pour accommoder les sites web existants <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 4 INF2005– Programmation web– A. Obaid 2 23/01/2013 Variante frameset • Identique à la variante transitionalen HTML 4.01 mais permet d’utiliser des frames (cadres) avec l’élélemnt<frameset> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> html23.html 5 INF2005– Programmation web– A. Obaid Validation HTML 4 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Validation de site </title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> </head> <body> <p> Un exemple de site a valider</p> <p id=s1> Un deuxiemeparagraphe <!-- <font color=red> Un texte rouge ! </font> non valide --> <p id=s2> un troisemeparagraphe </body> </html> html22.html http://validator.w3.org 6 INF2005– Programmation web– A. Obaid 3 23/01/2013 XHTML • XHTML est une combinaison de HTML 4.0 et XML: – Inclut les éléments in HTML 4 avec les exigences de syntaxe de XML. • XML est utilisé pour décrire les données • HTML est utilisé pour le formatage • On combine la force de HTML et de XML 7 INF2005– Programmation web– A. Obaid XML-Exemple <?xml version="1.0" encoding="UTF-8"? <livres type="science"> <livre> <titre> Programmation des reseaux</titre> <auteur> Abdel Obaid</auteur> <editeur>Loze-Dion</editeur> <annee>2003 </annee> <contenu> <chapitre>Introduction aux reseaux IP</chapitre> <cahpitre>Les protocoles de transport</chapitre> </contenu> </livre> <livre> … </livre> titre </livres> Livres livre auteur editeur livre annee contenu chapitre chapitre Programmation des reseaux Introduction aux reseaux IP 8 INF2005– Programmation web– A. Obaid 4 23/01/2013 Traitement de documents XML • Mettre en relation la description, les données et l'affichage DTD ou Schéma Validation Données XML Présentation (X)HTML 9 INF2005– Programmation web– A. Obaid Traitement de documents XML <?xml version="1.0"?> <!DOCTYPE note [ <!ELEMENT note (to,from,heading,body)> <!ELEMENT dest(#PCDATA)> <!ELEMENT expediteur(#PCDATA)> <!ELEMENT entete(#PCDATA)> <!ELEMENT message(#PCDATA)> ]> To: Jean From: Alain Sujet: Rappel Je te rappelle la reunion de Lundi ! <?xml version="1.0" encoding="ISO-8859-1" ?> <xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema"> <xs:element name="note"> <xs:complexType> <xs:sequence> <xs:element name="dest" type="xs:string"/> <xs:element name="expediteur" type="xs:string"/> <xs:element name="entete" type="xs:string"/> <xs:element name="message="xs:string"/> </xs:sequence> </xs:complexType> </xs:element> </xs:schema> <?xml version="1.0" encoding="ISO-8859-1" ?> <!– Exemple simple de XML --> <note> < dest> Jean </dest> < expediteur> Alain </expediteu > < entete> Rappel </ entete> <message> Je te rappelle la reunion de Lundi !</ message > </note> 10 INF2005– Programmation web– A. Obaid 5 23/01/2013 Restrictions de XHTML • Un contenu doit être dans une container (<p>, <div>,…) • Respecter les emboitement des éléments. – <p>Mettrel'accentsur un <em>paragraphe</p></em>n’est pas correcte. • Chaque balise ouvrante doit avoir une fermante correspondante – Sauf les balise vides comme <br /> ou <img /> • • • • • Les éléments doivent être en minuscule. <html> est toujours présent : racine du document Les noms des attributs doivent être en minuscule La valeurs des attributs doivent être mis entre guillemets Certains éléments sont obligatoires: – DOCTYPE, <html>, <head>, <title> et <body> 11 INF2005– Programmation web– A. Obaid Structure d'un document XHTML <!DOCTYPE ...> <html> <head> <title>... </title> </head> <body> ... </body> </html> 12 INF2005– Programmation web– A. Obaid 6 23/01/2013 Les DTD de XHTML • Comme HTML4, XHTML a trois variantes • Strict: – <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> • Transitional: – Si on veut continuer à utiliser HTML – Pour la migration vers XHTML – <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> • Frameset: – <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> 13 INF2005– Programmation web– A. Obaid Validation XHTML !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" xml:lang="fr"> <!-- Fichier: xhtml.html (Valide) --> <head> <title> Un exemple de document en XHTML </title> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" /> </head> <body id="debut"> <p>Ceci est un paragraphe d'introduction </p> <div> … </div> <h1> Section 1 </h1> <div> … <a href="www.uqam.ca"> Aller voir a l'UQAM </a> </div> <div id="s1" > … xhtml1.html </body> </html> 14 INF2005– Programmation web– A. Obaid 7 23/01/2013 Internationalisation XHTML • Dans <html>, on peut spécifier un espace de nom – <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> • Ou bien au début du document XHTML – <?xml version="1.0" encoding="UTF-8"?> 15 INF2005– Programmation web– A. Obaid Attribut de langue XHTML • Dans <html>, on peut spécifier la langue. • L'attribut lang indique la langue utilisée dans le contenu de l'élément – Utilise les abréviations ISO-639 1 des langues • fr : Francais, en : English, ar: Arabe, pt : Portugais, tw : Twi, wo : Wolof. • L'attribut dir spécifie la direction de l'écriture: • ltr: gauche à droite ou rtl : droite à gauche 16 INF2005– Programmation web– A. Obaid 8
Documents pareils
!DOCTYPE et DTD
Cela a pour conséquence d'uniformiser la présentation des pages d'un site, cette "Déclaration Type de Document" indique les balises
utilisables, les attributs obligatoires ou optionnels ou encore l...
