View source for class-design-pattern-fr

= Class design pattern =
== Intention ==
Utiliser le [[class-design-pattern-fr|class-design-pattern]] pour indiquer le sens sémantique à propos des éléments XHTML. Voir la discussion des [[semantic-class-names-fr|noms de classes sémantiques]] pour l'historique.

== Comment l'utiliser ==
* toujours utiliser l'élément [[semantic-xhtml-fr|semantique (X)HTML]] le plus approprié pour le contenu. Si un élément sémantique approprié n'est pas disponible, utilisez  <code>span</code> ou <code>div</code>. Evitez toujours le [[presentational-xhtml-fr|(X)HTML "présentationnel"]]. 
* ajoutez de la sémantique au (X)HTML en utilisant les [[semantic-class-names|noms de classe sémantiques]]. L'attribut  <code>class</code> est une liste séparée par des espaces de noms de classe.
* choisir toujours des noms en suivant les [[naming-principles|principes de nommage des microformats]].

== Description ==
C'est l'un des design patterns apparaissant le plus souvent dans les microformats. Le sens sémantique peut être indiqué sur le contenu XHTML en utilisant l'attribut <code>class</code> d'un élément l'entourant. Par exemple, [[hcard-fr|hCard]] ajoute de l'information indiquant que certains éléments représentent une vCard personne ou organisation, un Nom Formaté par le "class design pattern" :

<pre><nowiki>
<div class="vcard">
 <a class="url fn" href="http://tantek.com/">Tantek Çelik</a>,
 <span class="org">Technorati</span>
</div>
</nowiki></pre>

Remarquez tout particulièrement : 

* la section du document XHTML sur laquelle s'applique le microformat est définie par <code>class="vcard"</code>. Ceci est très commun parmi les microformats non triviaux.
* l'utilisation à la fois dans la ligne (&lt;a> et &lt;span>) et des éléments de niveau bloc  (&lt;div>). Ceci fournit au designer de microformat une gamme d'options pour insérer de l'information sémantique sans inférer la présentation existante
* l'utilisation de plusieurs noms de classe sur un élément unique (comme <code>"url fn"</code>). Ceci permet :
** des éléments uniques ont plusieurs sens
** permet d'ajouter de la sémantique à une présentation existante

==En rapport ==
* [[semantic-xhtml-fr|xhtml sémantique]]
* [[semantic-class-names-fr|noms de classes sémantiques]]

== Voir aussi ==
* [[Main_Page-fr#Design_Patterns|Tous les design patterns microformat]]
* John Udell [http://weblog.infoworld.com/udell/2004/02/09.html écrit] à propos de plusieurs noms de classe
* [http://www.la-grange.net/w3c/html4.01/struct/global.html#adef-class HTML 4.0 définition de 'class'], comprend des notes sur plusieurs noms de classe