Anatomie d'un document XHTML

La transition de HTML à XHTML viendra avec un bon nombre de bosses. Tandis que les chapitres plus tard, présenter des outils pour vous aider à franchir ces bosses - et déterminer d'où ils proviennent - le présent chapitre examine ce qui se passe au changement et montre quelques stratégies pour gérer ces changements. En chemin, nous visitons les fantômes du passé et les navigateurs étudier les problèmes qui existent dans les navigateurs courants. En retour, vous découvrez comment préparé et différents outils sont mal préparés pour le XHTML.

NoteCertaines des solutions abordées dans le présent chapitre s'appliquent outils décrits plus en détail dans les chapitres suivants - en particulier les DTD XHTML et des feuilles de style en cascade. Si vous rencontrez des problèmes vous ne comprenez pas, les garder à l'esprit et d'étudier les chapitres décrivant ces questions de plus près quand vous arrivez à eux. Les étapes abordées dans ce chapitre sont plus importants pour établir le contexte dans lequel vous utilisez certaines techniques que pour les l'explication de ces technologies.

Un premier document HTMLLe document qui suit, que j'utilise comme un cas de test, n'est pas un document HTML ordinaire. Il est conçu pour contenir certains des «graves quiproquos que les conversions au format XHTML impliquer. C'est plus ou moins un scénario du pire, bien que son contenu n'est pas inhabituel. (C'est un peu plus de sens que d'habitude, mais assez ordinaire autrement.) Ce document unique produit cinq dérivés, représentant différentes voies vers la conformité XHTML. Le document suivant est assez petite, mais elle contient beaucoup de problèmes dans un petit espace:

 Non XHTML HTML  Non XHTML HTML 

Ce document sera ouvert dans la plupart des navigateurs HTML, mais ce n'est certainement pas XHTML.

Le nettoyage ne devrait pas poser trop de problèmes, nous l'espérons.

  • Cliquez-moi pour un compte!
  • Cliquez ici pour une requête!
  • Cliquez ici pour une description de cette page

    Copyright 2000 par l'écrivain HTML Wacki
    Tous droits réservés.

  •   

    Deux voies de recoursAlors que le code HTML initial n'est pas en forme incroyablement mauvais, il utilise l'élément de police - un élément déprécié que le W3C cherche à éliminer et remplacer par des feuilles de style en cascade (CSS). Concepteurs Web ont deux choix pour faire face à cette évolution. La première approche utilise XHTML 1.0 's DTD transition afin d'éviter cette complication entièrement, tandis que la seconde mord la balle et fait quelques modifications structurelles pour adapter le document dans la DTD stricte. Alors que la première approche est plus simple dans le court terme, il mai signifie plus de travail plus tard. La deuxième approche a plus d'un coût initial - et mai signifie que vous passez beaucoup de temps laborieuses sur des documents complexes - mais il devrait se révéler plus stable et plus facile à gérer dans le long terme.

    Il existe également un certain nombre de cas dans lesquels XHTML offre de multiples approches pour résoudre le même problème. Nous allons profiter du fait que nous sommes de créer deux versions différentes du document XHTML. Les deux versions seront tester deux stratégies pour garder le signe <dans le script de causer des problèmes dans les navigateurs et les parseurs XML. (Ni fonctionne particulièrement bien dans les navigateurs HTML, il se trouve.) Nous allons aussi mettre chaque stratégie à travers deux phases de développement différents. La première phase conserve toutes les ressources utilisées par un document (tels que les scripts et les feuilles de style) à l'intérieur du document, tandis que la deuxième phase se déplace ces ressources vers des fichiers séparés.

    Solution 1: La DTD de transition et les sections CDATAEn utilisant la DTD de transition, vous pouvez conserver le formatage utilisés dans le document - le plus souvent la manchette, d'un bleu clair - sans avoir à modifier la structure d'ensemble du document de quelque manière significative. Bien que ce document est assez simple pour que les changements ne sont pas si difficiles (comme montré dans la seconde approche), des documents plus complexes nécessiteront un investissement énorme en temps de les convertir à la DTD stricte. Pour commencer, vous devez ajouter la déclaration DOCTYPE le début de votre document. (Vous pouvez ajouter la déclaration XML, mais laissons cela à la seconde approche. Pour la DTD de transition, cela signifie:

     

    Cela identifie le document que l'utilisation du XHTML 1.0 Transitional DTD du W3C, ce qui permet de valider les parseurs XML afin de vérifier le document en utilisant les déclarations officielles qu'elle contient. La balise d'ouverture HTML doit plusieurs changements. Premièrement, vous devez le changer en minuscules, en deuxième lieu, vous devez inclure un attribut de déclarer l'espace de noms XHTML pour son contenu (tel que décrit à l'article 4). La nouvelle version se présente comme suit:

     

    Vous avez besoin de changer les tags pour la tête et éléments du titre en minuscule, ainsi que de modifier le titre pour refléter la nouvelle identité du document:

     Transitional XHTML - Phase 1 

    L'élément de script présente un problème plus vaste. Il contient les caractères interdits <, qui doivent être échappés pour obtenir passé un parseur XML. Pour ce passage, utiliser une section CDATA pour délimiter le contenu de la (maintenant en minuscules) élément script. Cela permet les caractères <,>, et & d'apparaître n'importe où dans un script. (Si la séquence]]> apparaît, vous avez besoin afin de la casser avec un espace comme]]>.) L'élément script doit aussi avoir un type d'attribut ajouté. Le W3C soutient l'attribut de langue, mais insiste sur un attribut de type à un type de contenu MIME d'identifier le langage de script aussi bien.

    
     

    L'élément script est au coeur de l'élément de tête, si la section CDATA ne devrait pas causer des problèmes avec l'affichage - même si elle mai rendre navigateur moteurs de script dysfonctionnement.

    AstuceUn autre truc qui peut vous aider à éviter des problèmes avec <dans les scripts est d'expressions refonte like i <10 à 10> i. Parseurs XML mai soulever des avertissements quand ils rencontrent le symbole>, cependant. Le corps du document présente quelques problèmes plus compliqués. Parce que vous utilisez la DTD de transition, vous pouvez conserver l'attribut bgcolor (mettre en minuscules, bien sûr) sur l'élément body. Toutefois, vous devez ajouter des guillemets:

     

    Le titre est le prochain défi. La DTD transitoire prend en charge les polices et les éléments B, mais il vous faut les réorganiser afin qu'ils nid proprement. Vous avez aussi besoin de stocker ces éléments dans un élément higherlevel. L'élément p sert bien, mais vous pouvez également utiliser l'élément div. Nous allons également modifier la valeur de l'attribut size à 6, car elles sont censées être exprimé comme une gamme allant de 1 à 7, non pas comme une taille de point:

     

    Transitional XHTML - Phase 1

    Encore une fois, on change le titre afin qu'il reflète beaucoup mieux le contenu de la page. L'élément suivant, le premier alinéa, comprend une ancre fixée à un attribut name. Minuscules ce système et ensuite le compléter avec un attribut id. L'élément p également besoin d'une balise de fermeture à la fin du paragraphe.

     

    Ce document est XHTML de transition - nous allons voir comment elle le fait dans les navigateurs.

    (Oui, le texte modifié à nouveau.) Le paragraphe suivant, vous avez juste besoin de faire son élément P dans un p minuscule et lui donner une balise de fermeture:

    Le nettoyage ne devrait pas poser trop de problèmes, nous l'espérons.

    Vous avez besoin de mettre les éléments de la liste suivante en minuscules, leur donner une balise de fin, et enfermez-les dans une sorte de liste à un élément - UL, pour la liste non-ordonnée, semble la plus appropriée. L'élément br suivante l'élément première liste est inutile de sorte que vous pouvez le supprimer.

    L'utilisation de JavaScript dans les attributs href n'est pas recommandé, mais vous pouvez le laisser pour le moment car il n'est pas expressément interdit (bien que vous le changer dans la seconde approche). La ligne suivante contient également une URL, cette fois avec l'esperluette. Le processus de nettoyage a besoin de les remplacer par des &.

  • Cliquez ici pour une requête!
  • Le dernier élément liste n'est bien se passer, même si elle a besoin d'une balise de fin. Vous devez fermer l'élément ul ainsi:

  • Cliquez ici pour une description de cette page
  • À la fin, vous avez un paragraphe contenant un saut de ligne. Vous devez ajouter une balise de fermeture pour l'élément p et fabriquer l'élément br dans une balise vide plutôt que simplement une balise de début:

     

    Copyright 2000 par l'écrivain HTML Wacki
    Tous droits réservés.

    Enfin, vous devez convertir les balises de fermeture du corps et des éléments HTML en minuscules pour correspondre à la marque de début:

       

    Ceci termine la nettoyées version:

     Transitional XHTML - Phase 1  

    Transitional XHTML - Phase 1

    Ce document est XHTML de transition - nous allons voir comment elle le fait dans les navigateurs.

    Le nettoyage ne devrait pas poser trop de problèmes, nous l'espérons.

    Copyright 2000 par l'écrivain HTML Wacki
    Tous droits réservés.

    Pour le tester, envoyez-le au format HTML du W3C Service de validation sur http://validator.w3.org/. L'exemple un peu plus loin en supprimant le script à partir du document et à le stocker dans un fichier externe. Cela vous permet de se débarrasser de la section CDATA depuis des fichiers de script n'ont pas à être XML. Les références élément nouveau script le code du fichier en utilisant l'attribut src et qu'il ressemble à ceci:

    Bien qu'il soit acceptable la pratique XML à utiliser une balise vide au lieu des balises d'ouverture et de clôture, la plupart des navigateurs ne reconnaissent pas cette approche et d'essayer de traiter le reste du document comme un script. Le script va dans un fichier séparé nommé mycode.js:

    presentCount function () (counter = ""; for (i = 0; i <10; i + +) (counter = counter + "" + i;) alert (compteur);) Le document dans son ensemble se lit maintenant:  Transitional XHTML - Phase 2 

    Transitional XHTML - Phase 2

    Ce document est XHTML de transition - nous allons voir comment elle le fait dans les navigateurs.

    Le nettoyage ne devrait pas poser trop de problèmes, nous l'espérons.

    Copyright 2000 par l'écrivain HTML Wacki
    Tous droits réservés.

    Recours 2: DTD et les entités de la Stricte remplacementXHTML Alors que les fichiers produits en utilisant la première méthode sont en cours de validité, un peu plus de travail peut produire des documents qui sont plus faciles à gérer dans le long terme. Cela exige des modifications plus faire un peu de structure du document et en ajoutant quelques feuilles de style en cascade de l'information. Dans votre premier passage, vous convertissez le document à la DTD HTML 4.01 strict sans se soucier de XHTML. Ensuite, vous le convertir en XML de deux façons légèrement différentes. Vous essayez aussi une approche différente dans les scripts sur le premier passage XML - un qui fonctionne avec des processeurs XML, mais qui ne parvient toujours pas dans la plupart des processeurs HTML.

    un article présenté par Albert Lichtblau


    Disclaimer:Notre site n'est pas responsable du contenu de cet article. Webarticles est une ressource d'information gratuite.
    Important: Cet article «Anatomie d'un document XHTML" a été traduit par un logiciel automatique. Nous nous sentons désolés pour les fautes d'orthographe que mai ont eu lieu. Nous vous remercions de votre compréhension.


    Online: 264 users browsing the articles directory