L’écriture des balises à fermeture automatique pour les éléments ne viderait-elle pas traditionnellement les mauvaises pratiques?

J’ai remarqué que jQuery (ou est-ce Firefox) transformera une partie de mes into

Maintenant, ma question est la suivante: est-ce que je peux écrire mon balisage comme ça? Est-ce que certains navigateurs vont s’étouffer?

Personnellement, je pense qu’il est plus propre de faire si cela doit être vide.

Je suppose que votre question concerne la barre oblique rouge sur les éléments à fermeture automatique lorsque vous affichez la source dans Firefox. Si oui, vous êtes tombé sur l’un des débats les plus véhéments, mais aussi passifs, agressifs dans le navigateur par rapport aux guerres de développeurs Web. XHTML ne concerne pas uniquement le balisage d’un document. Il s’agit également de savoir comment les documents doivent être diffusés sur le Web.

Avant que je commence; Je m’efforce de ne pas prendre parti ici.

La spécification XHTML 1.1 indique qu’un serveur Web doit servir XHTML avec un type de contenu d’application / xhtml + xml. Firefox considère que les barres obliques ne sont pas valides car votre document est diffusé sous la forme text / html plutôt qu’application / xhtml + xml. Prenez ces deux exemples; balisage identique, l’un servant d’application / xhtml + xml, l’autre de texte / html.

http://alanstorm.com/testbed/xhtml-as-html.php

http://alanstorm.com/testbed/xhtml-as-xhtml.php

Firefox marque la barre oblique de fin dans la balise META comme non valide pour le document servi avec text / html et valide pour le document servi avec application / xhtml + xml.

Pourquoi c’est controversé

Pour un développeur de navigateur, le but de XHTML est de traiter votre document comme XML, ce qui signifie que si quelqu’un vous envoie quelque chose qui n’est pas valide, la spécification indique que vous n’avez pas à l’parsingr. Ainsi, si un document est utilisé comme application / xhtml + xml et a un contenu non bien formé, le développeur est autorisé à dire “pas mon problème”. Vous pouvez voir cela en action ici

http://alanstorm.com/testbed/xhtml-not-valid.php

Lorsqu’un document est servi en tant que text / html, Firefox le traite comme un ancien document HTML simple et utilise les routines d’parsing,

http://alanstorm.com/testbed/xhtml-not-valid-as-html.php

Ainsi, pour un créateur de navigateur, XHTML servi de text / html est ridicule, car il n’est jamais traité comme XML par le moteur de rendu du navigateur.

Il y a quelques années, les développeurs Web cherchant à être plus que des singes tag (Disclaimer: je m’inclus comme l’un d’eux) ont commencé à chercher des moyens de développer des meilleures pratiques sans impliquer trois tables nestedes . Ils / Nous avons opté pour XHTML / CSS, car le W3C a déclaré que c’était l’avenir, et le seul autre choix était un monde où un seul fournisseur (Microsoft) contrôlait les spécifications de balisage de facto. Le vrai mal y est le vendeur unique , et pas tellement Microsoft. Je le jure.

Alors, où est la controverse? Il y a deux problèmes avec application / xhtml + xml. Le premier est Internet Explorer. Il y a un bug / une fonctionnalité hérité dans IE où le contenu servi comme application / xhtml + xml invitera l’utilisateur à télécharger le document. Si vous avez essayé de visiter le xhtml-as-xhtml.php répertorié ci-dessus avec IE, c’est probablement ce qui s’est passé. Cela signifie que si vous souhaitez utiliser application / xhtml + xml, vous devez naviguer dans le navigateur pour IE , vérifier l’en-tête Accepts et ne servir que l’application / xhtml + xml aux navigateurs qui l’acceptent. Ce n’est pas aussi sortingvial que cela puisse paraître, et cela va à l’encontre du principe “write once” que les développeurs Web recherchent.

Le second problème est la dureté de XML. Il s’agit là encore d’un de ces problèmes, mais certaines personnes pensent qu’une seule balise incorrecte ou un seul caractère mal encodé ne devrait pas avoir pour effet de ne pas voir le document souhaité. En d’autres termes, oui, la spécification indique que vous devez arrêter de traiter le XML s’il n’est pas bien formé, mais l’utilisateur ne se soucie pas de la spécification, il souhaite que le site Web de son chat soit cassé.

La spécification XHTML 1.0 (pas 1.1) stipule que les documents XHTML peuvent être utilisés en tant que text / html, à condition que certaines directives de compatibilité soient suivies. Des choses comme la balise img étant auto-fermée et similaire. Le mot clé ici est may . Dans RFC speak , peut signifier facultatif. Firefox a choisi de ne PAS traiter les documents servis avec un doctype XHTML, mais un type de contenu text / html en tant que XHTML. Cependant, le validateur du W3C se fera un plaisir de signaler ces documents comme étant valides.

Je laisserai le lecteur réfléchir à la merveille / horreur simultanée d’une culture qui écrit un document pour définir ce qu’ils entendent par le mot may .

Avancer

Enfin, voici ce dont parle HTML 5 . XHTML est devenu une telle patate politique qu’un groupe de personnes qui souhaitaient faire progresser la langue ont décidé d’aller dans une autre direction. Ils ont produit une spécification pour HTML 5. Celle-ci est actuellement en préparation au W3C et devrait se terminer au cours de la prochaine décennie. En attendant, les fournisseurs de navigateurs sélectionnent et sélectionnent les fonctionnalités des spécifications en cours et les mettent en œuvre.

Mises à jour des commentaires

Dans les commentaires, Alex fait remarquer que si vous allez chercher quelque chose, vous devriez vérifier l’en-tête Accept pour voir si l’application / xhtml + xml est acceptée par l’agent utilisateur.

Ceci est absolument correct. En général, si vous allez sniffer, reniflez la fonctionnalité, pas pour le navigateur.

Un ajout aux autres réponses: dans IE, le fait d’avoir des éléments tels que dans votre balisage posera toutes sortes de problèmes avec les méthodes de traversée DOM en JavaScript . Consultez le document XHTML suivant:

     Test    

Paragraph containing some text followed by an empty span

Second paragraph just containing text

L’idée est que lorsque la page se charge, le JavaScript obtient une référence à la plage vide et affiche son contenu HTML. Ce sera une chaîne vide, non? Pas dans IE ça ne va pas. Dans IE, vous obtenez tout le contenu après l’intervalle dans le document entier:

  

Second paragraph just containing text

En outre, le second

apparaît dans la collection childNodes la childNodes . Ce même

est également dans la collection childNodes du corps, ce qui signifie qu’un nœud peut avoir plusieurs parents . Ce n’est pas une très bonne nouvelle pour les scripts qui traversent le DOM.

J’ai aussi blogué à ce sujet .

Oui. C’est. Cela posera des problèmes dans certains cas pour les anciens navigateurs.

  

Dans ce cas, l'ancien navigateur peut ne pas comprendre que la est terminée.

Servi comme application / xhtml + xml, signifie créer un élément span sans contenu.

Servi en tant que text / html, signifie créer un élément span où le contenu de l’élément suit cette balise jusqu’à ce que la balise soit rencontrée ou qu’une autre balise (ou EOF) ferme implicitement l’élément soit rencontrée. c’est-à-dire que signifie la même chose que .

Mis à part: HTML 5 définit à la fois les sérialisations HTML et XHTML, et n’affecte donc pas ce problème d’une manière ou d’une autre. Il nécessite, comme XHTML 1.1, que XHTML soit utilisé comme application / xhtml + xml, contrairement au XHTML 1.0. En réalité, cela ne change rien car tous les navigateurs traitent n’importe quelle version de XHTML servie comme text / html en tant que tag soupe.

Il convient également de noter qu’une déclaration Avant que le doctype ne lance IE en mode quirks.

Voir la note sur le sujet du groupe de travail XHMTL: http://www.w3.org/TR/xhtml-media-types/

En bref, cela va si votre XHTML va être traité comme XHTML. Si vous prétendez qu’il s’agit de HTML (ce que vous devez faire si vous voulez qu’il soit chargé par Internet Explorer (y compris la version 8, la plus récente au moment de la rédaction)), vous devez sauter à travers les cerceaux.

Les cerceaux sont assez agaçants que je recommanderais à la plupart des gens de respecter HTML 4.01.

En général, utiliser un raccourci pour des éléments vides n’est pas un problème, mais il existe des exceptions où cela peut causer des problèmes.

est un élément important qui doit être fermé avec pour éviter les problèmes.

Un autre est qui fonctionne beaucoup mieux avec des araignées écrites sous la forme au lieu de

Pas exactement la question, mais en ce qui concerne le formatage, les versions d'IE ont des problèmes avec des éléments vides tels que

ou

. Dans ce cas,

 

est nécessaire pour conserver le formatage.

Il devrait être explicitement dit qu’il n’y a pas de balises auto-fermées en HTML, donc chaque fois qu’un navigateur décide de traiter votre XHTML en HTML, il ne reconnaîtra pas que la balise est fermée. Ce n’est pas un problème pour les balises qui ne doivent pas être fermées en HTML, comme , mais évidemment avec des balises telles que .