Projet:Infobox/V2

Un article de Wikipédia, l'encyclopédie libre.

Raccourcis [+]
P:V2
WP:V2

Les infobox version 2 améliorent l'aspect, la simplicité et la flexibilité des infobox de Wikipédia. L'intérêt est d'harmoniser l'apparence par des feuilles de style en cascade, des pictogrammes thématiques, une simplification du code ainsi que la possibilité de généricité qui consiste à fusionner plusieurs modèles en un seul ; autrement dit, utiliser le moins de ressources possible et d'obtenir un produit harmonisé. Pour plus d'information ou pour faire une demande de fabrication, voir la page de discussion.

Aussi disponible pour aider, voir les quelques exemples d'infobox V2 déjà en ligne.

Charte graphique des Infobox V2 pour la musique, avec les fonctions du parseur
Charte graphique des Infobox V2 pour la musique, avec les fonctions du parseur
Charte graphique des infoboxs cinéma en V2
Charte graphique des infoboxs cinéma en V2
Charte graphique des Infobox V2 pour les jeux vidéo avec les fonctions du parseur
Charte graphique des Infobox V2 pour les jeux vidéo avec les fonctions du parseur

Sommaire

[modifier] Programmation des Infobox V2

Afin d'obtenir une certaine uniformité d'un modèle à l'autre, veuillez programmer les infobox V2 avec une attention particulière en utilisant les exemples ci-dessous.

[modifier] Conventions d'harmonisation

[modifier] Nommage et renommage

Dans le cadre du Projet:Modèle/Harmonisation, il est fortement recommandé de nommer (ou renommer) votre infobox en respectant la nomenclature établie. Ceci relève des conventions sur les titres, aussi valables pour les noms de modèles. Voici quelques exemples de ce qu'il faut faire ou non :

  • Modèle:Infobox Nom de l'infobox (avec « Infobox » au début, et une majuscule au Nom de l'infobox. Ne pas tronquer de mots)
  • Modèle:Nom de l'infobox (Toujours commencer avec le mot « Infobox »)
  • Modèle:Infobox nom de l'infobox (Toujours débuter le nom de l'infobox avec une majuscule)
  • Modèle:Infobox Nom De L'InfoBox (Ne pas mettre d'autres majuscules dans le nom du modèle, sauf pour les noms propres)
  • Modèle:Infobox Nom infobox (Ne pas tronquer des mots, faire une phrase. Vaut mieux un nom de modèle clair, qu'un nom trop court)
  • Modèle:Infobox Name of the infobox (Éviter des mots anglophones. Ex: Comicbook, podcast, TV, etc.)
  • Modèle:Infobox Nom du modele (Toujours utiliser les accents pour un titre)

Aussi, les images qui habillent l'entête ont leurs propres conventions de nomenclature, à savoir le titre, les dimensions, l'apparence, etc. Voir les pictogrammes plus bas.

[modifier] Paramétrage

Il est important de bien nommer vos paramètres. En bref, pas de majuscules, pas d'acronymes, pas de diminutifs, pas de pluriel, pas de traits d'union (ou autres liaisons). Il est fortement conseillé aussi d'uniformiser l'emplacement des tubes "|" et des signes égal "="

À faire

{{Infobox Nom de l'infobox
 | nom     =  
 | image   = 
 | légende =
 | autre   = 
}}

À éviter

{{Infobox Nom de l'infobox|
nom     =|
image   =|
légende =|
autre   =|
}}
{{Infobox Nom de l'infobox
|nom= 
|img= 
|lég=
|aut= 
}}

[modifier] Générécité

[modifier] Créer une nouvelle infobox

Veuillez penser à créer des infoboxes génériques, qui incluent plusieurs autres infoboxes du même thème ayant les mêmes paramètres joints sous une charte graphique. Il existe plusieurs façons de programmer une infobox, mais nous vous conseillons tout de même quelques règles.

  • Tel que conseillé par le projet modèle et les programmeurs du logiciel MediaWiki, il est préférable d'éviter le code HTML lors de la programmation, mais plutôt d'utiliser du "code Wiki".
  • Pour éviter la prolifération d'infoboxes aux paramètres similaires, il est suggéré de créer des infoboxes génériques en utilisant la fonction du parseur {{#switch}} afin de contrôler la charte graphique des entêtes. Puis fusionnez les mêmes paramètres qui seront inclus d'une infobox à l'autre. (Voir {{Infobox Musique (artiste)}} pour un exemple de charte graphique générique)
  • Évitez de faire apparaître les paramètres non-renseignés. Il est possible de dissimuler les champs qui sont vides en utilisant les fonctions du parseurs, qui valent mieux que les classes "hiddenstructure" ou autres techniques de dissimulation.
  • Évitez les <includeonly> dans le codage ; ceci a une forte tendance à créer des erreurs ou briser la documentation du modèle. Il est préférable d'utiliser les modèles empêchant l'évaluation par MediaWiki en cas de besoin.

Exemple de programmation

{| class="infobox_v2" cellspacing="7" border="0"
| colspan="2" class="entete defaut" style="background-color:#8C8C8C;" | {{#if:{{{nom|}}} | {{{nom|}}} | {{PAGENAME}} }}
|-
{{#if:{{{image|}}} | 
{{!}} colspan="2" style="text-align:center;" {{!}} {{{image|}}}{{#if:{{{légende|}}}|<br /><small>{{{légende|}}}</small>}}<hr />
{{!-}}
}}
{{#if:{{{paramètre 1|}}} |
! [[Paramètre 1]] 
{{!}} {{{paramètre 1|}}}
{{!-}}
}}
{{#if:{{{paramètre 2|}}} |
! [[Paramètre 2]] 
{{!}} {{{paramètre 2|}}}
{{!-}}
}}
|}

[modifier] Mettre à jour une infobox

Afin de mettre à jour une ancienne infobox, il faut considérer trois aspects avec attention : la généricité de l'infobox (fusion), le(s) nouveau(x) nom(s) de(s) modèle(s) et les nouveaux paramètres.

Étape #1 - Considérer la générécité (la fusion)
  • Avant de mettre à jour une ancienne infobox, demandez-vous si d'autres infoboxes pourraient partager les mêmes paramètres et fusionner ensemble. Avec une charte, vous pourrez différencier les déclinaisons et imposer la charte voulue suivant le thème. Exemple des paramètres avec le cinéma (film)  : nom, titre, film peuvent tous partager le même paramètre : titre. Exemple de charte graphique du cinéma.
  • Une fois les infobox similaires identifiées, rassembler les paramètres fusionnés dans le codage. Ici, nous fusionnons titre et film sous "nom", photo sous "image", vieux et ancien sous "paramètre". Cette technique aura pour effet de rediriger toutes les anciennes infoboxes vers la nouvelle et que tous les paramètres puissent être pris en compte.
{| class="infobox_v2" cellspacing="7" border="0"
| colspan="2" class="entete defaut" style="background-color:rgb({{{charte}}});" | 
{{#if: {{{titre|{{{film|{{{nom|}}}}}}}}} | {{{titre|{{{film|{{{nom|}}}}}}}}} }}
|-
{{#if:{{{photo|{{{image|}}}}}} | 
! colspan="2" style="text-align:center;" {{!}} {{{photo|{{{image|}}}}}}
{{!-}}
}}
{{#if:{{{vieux 1|{{{ancien 1|{{{paramètre 1|}}}}}}}}} |
! [[Paramètre 1]] 
{{!}} {{{vieux 1|{{{ancien 1|{{{paramètre 1|}}}}}}}}}
{{!-}}
}}
<!------------------------------------------------------------------------------------
 Pour faciliter le repérage ultérieur par les robots, vous pouvez ajouter "déprécié"  
------------------------------------------------------------------------------------->
{{#if:<!--déprécié-->{{{vieux 2|{{{ancien 2|<!---->{{{paramètre 2|}}}}}}}}} | 
! [[Paramètre 2]] 
{{!}} <!--déprécié-->{{{vieux 2|{{{ancien 2|<!---->{{{paramètre 2|}}}}}}}}}
{{!-}}
}}
{{#if:<!--déprécié-->{{{ancien 3|<!---->{{{paramètre 3|}}}}}} | 
! [[Paramètre 3]] 
{{!}} <!--déprécié-->{{{ancien 3|<!---->{{{paramètre 3|}}}}}}
{{!-}}
}}
|}
Étape #2 - Considérer le(s) nouveau(x) nom(s) de(s) modèle(s)
  • Pour des raisons d'allégement et d'ordre alphabétique dans l'espace de noms Modèle, il est fortement conseillé de choisir des noms qui respectent non seulement les conventions d'harmonisation, mais aussi une logique alphabétique. Par exemple, pour remplacer les anciennes infoboxes Films, Métrages, Acteurs, Cinéma, Ciné-caméras, Ciné-projecteur :
Modèle:Infobox Cinéma (charte) (pour définir la charte des couleurs entre les infobox)
Modèle:Infobox Cinéma (film) (fusion des infobox Métrages, Films, Films documentaires, Films musicaux)
Modèle:Infobox Cinéma (personnalité) (fusion des infobox Acteurs, Actrices, Doublures, Producteurs, Réalisateurs, etc.)
Modèle:Infobox Cinéma (salle) (fusion des infobox Cinémas, Cinéparcs, Cinéplex, etc.)
Modèle:Infobox Cinéma (caméra)
Modèle:Infobox Cinéma (projecteur)
Étape #3 - Requête d'implantation par un robot
  • Lorsque les anciens paramètres ont été fusionnés dans les nouvelles infobox, il est possible de rediriger les modèles obsolètes vers la nouvelle infobox. Si tous les anciens paramètres ont bien été intégrés, l'implantation de la nouvelle infobox peut être faite sans erreurs de paramétrage.
  • Finalement, une requête à un robot peut être faite. Pour se faire, il faut fournir au dresseur de bot, les anciens/nouveaux paramètres et le nom des anciennes/nouvelles infobox. Pour cette étape, Educa33e est passé maître dans l'art d'implanter ces changements.

[modifier] Autres considérations

Voici d'autres conseils en rafale pour hamoniser les infobox V2.

  • Les images : les photos, logos et autres images devraient toujours apparaître sous la forme paramétrée {{{image|}}} et non pas [[Image:{{{image|}}}|{{{image_size|}}}|{{{légende}}}]]. Il est préférable de laisser la liberté aux contributeurs qui pourraient corriger une eventuelle photo trop haute, plutôt que d'avoir un paramètre "image_size" qui règle le format. Dans tous les cas, les images ne doivent pas dépasser 280 pixels de largeur (infobox a 300px, avec un padding de 0.1em et les bordures ont 7px chaque côtés).

[modifier] Charte graphique des Infobox V2

[modifier] Esthétique générale

Les infobox V2 se veulent modernes sans toutefois sombrer dans les dérives de l'esthétique du « web 2.0 » à savoir ombres, reflets, 3D... Ce sont des tableaux aérés sans autres bordures que le cadre gris général de la box. Elles se composent de deux parties :

  • L'entête (ou head), constitué d'un rectangle épais dont la couleur est modulable. L'entête contient le titre de l'infobox, qui est l'élément le plus important et que l'internaute doit repérer et appréhender d'un seul coup d'oeil. Ce rectangle contient un pictogramme personnalisé, fonction du domaine de l'infobox (des notes pour le domaine de la musique, une pellicule pour le domaine du cinéma...). La couleur de l'entête ainsi que le pictogramme servent à établir une charte graphique pour un domaine donné.
  • Le contenu, qui peut contenir des sous-titres éventuels (rectangles colorés moins denses que l'entête) et les informations à proprement parler. Pour un aspect moderne et sobre, le texte est ferré (aligné) à gauche et il est graissé (en gras) dans la colonne de gauche. Les traits de séparations sont restreints en n'étant utilisés que pour séparer les grandes classes d'informations.

Important : les infobox V2 est un projet d'harmonisation et uniformisation des infoboxes de Wikipédia. Veuillez respecter le style de base actuellement proposé, sans faire aucune modification personnalisée dans un modèle spécifique. Si vous avez des suggestions améliorant le style, veuillez d'abord les proposer sur la page de discussion.

[modifier] Pictogrammes

Initiés par JSDX (d · c · b), les pictogrammes permettent à l'internaute de repérer d'un coup d'œil sur quel type d'article l'utilisateur se trouve. Ils améliorent ainsi l'ergonomie générale de l'encyclopédie et délimitent les chartes graphiques à un domaine donné (par exemple, les notes de musiques scellent la charte graphique des articles musicaux). Ils répondent à plusieurs principes :

  • Hauteur fixe de 45 pixels ;
  • Semi-transparents ;
  • Encodés en .png 24 bits pour gérer les différents degrés de transparence ;
  • Conçus pour être alignés à droite de l'entête des infoboxes.

[modifier] Feuilles de style

Ils doivent être utilisés sur la feuille de style common.css. La nomenclature des pictogrammes doit respecter la convention des noms d'images pour les Infobox V2 : "Image:Picto_infobox_nom.png". Afin de créer de nouveaux pictogrammes pour votre projet, veuillez consulter JSDX (d · c · b) sur sa page de discussion, afin de préserver l'uniformité des nouvelles infoboxes.

Nom de la classe Code de la classe et rendu
musique : spectacle, chanteur, musicien, salle de concert, Album, chanson... entete musique
persofiction : personnage de fiction, rôle incarné... entete persofiction
jeuvideo : jeu vidéo, console, manette, matériel de jeu... entete jeuvideo
biere : marque de bière, brasserie, matériel de fabrication... entete biere
cinema : cinéma, salle de projection, auteur, acteur, scénariste, distributeur, monteur... entete cinema
bd : bande dessinée, dessin animé, comic book, manga... entete bd
communication : (classe à changer) télécommunication, téléphone, ondes radio, satellite... entete mobile
humain : relatif à l'humain, aux genres, à la sociologie, biologie... entete humain
sport : les sports en général, thèmes olympiques... entete sport
map : géographie, hydrographie, cartographie, voyage, transport... entete map
defaut : ce pictogramme est utilisé par défaut, dans le cas où ceux ci-dessus ne s'appliquent pas. entete defaut

[modifier] Documentation

Afin de préserver une uniformité dans les pages de documentation des infoboxes, voici quelques lignes conductrices pour monter une page explicative.

[modifier] Exemples

[modifier] Infobox simples

[modifier] Infobox Génériques

[modifier] Voir aussi