Utilisation de balises HTML personnalisées

Dans mon fichier HTML, j’étais curieux de savoir s’il était sémantiquement correct d’utiliser des identifiants uniques tels que pour contenir une image plutôt que

. Par exemple:

Est-il préférable d’avoir: &nbsp

avec le css:

  toys { background: url("toys.png") no-repeat scroll 0 0 transparent; width: 181px; height: 93px; margin-top: -8px; } 

au lieu de: j’ai actuellement:

&nbsp

avec le css:

  h1 { background: url("toys.png") no-repeat scroll 0 0 transparent; width: 181px; height: 93px; margin-top: -8px; } 

L’utilisation d’identifiants uniques tels que correcte sémantiquement?

Il est préférable d’éviter d’utiliser des balises personnalisées, car vous ne savez jamais quand ces balises peuvent être normalisées et utilisées à l’avenir.

La meilleure chose à faire pour votre exemple, si vous voulez éviter d’utiliser les balises d’en-tête, est la suivante:

 
&nbsp
.toys { background: url("toys.png") no-repeat scroll 0 0 transparent; width: 181px; height: 93px; margin-top: -8px; }

En outre:

Si vous n’utilisez pas de balises HTML standard lors de la conception de pages, elles n’apparaîtront pas de manière organisée lorsque les styles sont désactivés. Ce n’est pas un problème, mais si pour une raison quelconque vous deviez afficher une liste de “jouets” sans styles, vous n’auriez pas eu de chance à moins d’utiliser

    ou

      avec les balises

    1. .

      METTRE À JOUR:

      Comme Flimzy l’a souligné dans les commentaires, les éléments HTML personnalisés ont désormais leur propre spécification W3C. Cependant, ils ne sont pas encore totalement pris en charge.

      La plupart de ces réponses sont de bons conseils généraux, mais pas des réponses correctes à la question, ce qui, à mon avis, est parfaitement légitime.

      HTML5 est déjà une cible mobile; Les navigateurs implémentent les spécifications et innovent à des rythmes différents. Il n’y a pas une seule chose appelée “HTML valide”, du moins pas qui mérite d’être utilisée. Si vous construisez une page publique pour chaque personne et chaque robot / robot sur la planète, vous devez déjà A) détecter le client et le personnaliser en conséquence, pour les pages complexes / avancées ou B) le rendre vraiment simple et clair. Si, par contre, vous le mettez sur un réseau local ou que vous le cachez derrière un mur de connexion ou que vous vous développez à la pointe de la technologie et que vous prévoyez des mises à jour fréquentes, alors vous pouvez innover un peu avec discrétion. Les développeurs et les rédacteurs de navigateurs répondent à leurs besoins, vous pouvez faire la même chose.

      Donc, si vous voulez une balise personnalisée, choisissez avec soin (ici, je vous signale que les cotes qui feraient jamais partie d’une spécification formelle d’implémentation du navigateur sont totalement négligeables), alors allez-y. Pour que votre CSS fonctionne dans IE, il vous faudra faire comme le fait html5shim et appeler document.createElement («toys») dans votre javascript.

      Je devrais également append que les éléments personnalisés obtiennent leurs propres normes et leur support, mais le consensus actuel est qu’ils devraient tous avoir un «-» dans le nom. Je recommanderais donc quelque chose comme «x-toys» ou «mes jouets» au lieu de «jouets». Personnellement, je ne suis pas ravi de la convention, mais je comprends les raisons.

      Vous pouvez certainement Cependant, ce n’est généralement pas une bonne idée de le faire. À bien des égards, HTML5 évolue vers quelque chose comme ça, mais générique; avoir des balises spécifiques, bien que supscopes, peut avoir des résultats très différents selon les navigateurs.

      UPDATE (parce que toutes les réponses sont anciennes):

      En ce qui concerne les composants Web, l’API est implémentée dans tous les principaux navigateurs, à mon avis, vous ne pouvez pas éviter d’utiliser des balises personnalisées à l’avenir. Je pense que les composants Web deviendront facilement courants. La théorie entière est construite dessus: balises personnalisées, atsortingbuts personnalisés personnalisés JS attachés à ces éléments.

      Donc, ce que je dis: ce n’est pas une mauvaise chose d’utiliser vos propres balises de nos jours, mais vous devez quand même envisager de créer des liens avec le SEO.

      Oui, ce serait sémantiquement correct.

      Cependant, sa syntaxe est invalide car HTML possède un ensemble défini de balises.

      Vous pouvez contourner cela dans certains navigateurs.

      Cela dit, quel est l’avantage de faire cela? Cela ne profiterait vraiment qu’à la personne qui doit maintenir le code source.

      Pour votre information, ce que vous proposez est à peu près ce que XML est.

      Je suis d’accord avec @superUntiled, vous devriez faire bon usage des sélecteurs CSS (classes et identifiants). Donc, si vous avez un object de type “toy”, vous devriez créer une classe pour cet object. Ensuite, vous pouvez sélectionner toutes vos cars utilisant CSS simplement en utilisant le sélecteur .toy .

      Quelque chose comme ça:

        

      My little car

      Si vous définissez une balise et que vous définissez également dans votre feuille de style ce qu’elle devrait faire, cela devrait le lier? Même si votre nouvelle balise deviendra plus tard standardisée, votre feuille de style remplacera la norme – après tout, c’est ce que sont les feuilles de style.

      Par exemple, je dois souvent contrôler les sauts de ligne sur mes pages. Plutôt que d’utiliser une maladresse

       bla bla bla 

      à chaque fois, je joins mon texte non brisé dans mes propres balises et définissez dans ma feuille de style:

       nbr { white-space:nowrap; } 

      alors

       

      This is some text. This is some more text.

      apparaîtra sur une ligne s’il y a de la place, sinon la deuxième phrase apparaîtra sur la ligne suivante. Ou, pour être précis, dans tous les navigateurs, sauf les anciennes versions d’IE. Pour être en fonte, j’ai ajouté ce qui suit à chaque page [head] de la page (dans WordPress, il suffit d’append au header.php du thème): –

        

      Ou est-ce que je manque quelque chose?

      Si votre doctype est défini sur XHTML, ça devrait aller. Mais ce n’est généralement pas valable pour les doctypes HTML.

      Vous ne voulez pas créer vos propres tags.

      Les balises HTML sont définies dans la spécification HTML.

      Au lieu de:

       

      &nbsp

      Vous devriez faire quelque chose comme:

       

      &nbsp

      Cependant, vous pouvez créer vos propres balises si XML.

      Mais veuillez noter que tous les navigateurs ne prennent pas en charge votre tag et que vous ne pourrez pas les utiliser avec CSS.

      La même chose se produit avec les nouvelles balises HTML5