Jump to content

Modifications des titres HTML

From mediawiki.org
This page is a translated version of the page Heading HTML changes and the translation is 100% complete.

Le balisage HTML des titres sur les pages de wikicode a été modifié en 2024 comme partie de MediaWiki 1.43 . Un conteneur a été ajouté autour de chaque titre, et les éléments autres que le texte (comme les liens de modification des sections) ont été déplacés du titre lui même vers l'intérieur du conteneur. Cette modification est suivie dans T13555.

Qu'est-ce qui a changé ?

Il n'y a pas de changement visuel pour les éditeurs et les lecteurs. Cependant, les mainteneurs d'habillages, d'extensions et de gadgets qui modifient les titres doivent faire les mises à jour pour éviter les problèmes liés à leur utilisation.

Exemple de source HTML ancien et nouveau pour les balises d'entête
Wikicode Ancien HTML Nouveau HTML
== Heading ==
<h2>
    <span class="mw-headline" id="...">Heading</span>
    <span class="mw-editsection">...</span>
</h2>
<div class="mw-heading mw-heading2">
    <h2 id="...">Heading</h2>
    <span class="mw-editsection">...</span>
</div>
<h2 class="myclass">
  Heading
</h2>
<h2 class="myclass">
    <span class="mw-headline" id="...">Heading</span>
</h2>
<h2 id="..." class="myclass">Heading</h2>
Depuis MediaWiki 1.44 (T68637)
<h2 id="..." class="myclass mw-html-heading">Heading</h2>

La modification ne s'applique pas à la plupart des pages spéciales ni au contenu en mode édition de Parsoid qui continuent à utiliser le balisage simple <h2>...</h2>.

Pourquoi ces changements

Cette modification améliorera l'accessibilité des personnes qui utilisent les lecteurs d'écran. C'est un flux de travail commun pour naviguer autour d'une page à l'aide des titres présents, comme une table de contenu générée automatiquement. Avec l'ancien marquage, les éléments d'interface comme les liens de modification des sections faisaient partie de chaque titre, ce qui les faisait relire avec le texte de chaque titre. Le problème a été exacerbé par les extensions qui ont ajouté d'autres éléments d'interface aux titres, tels que les liens Modifier la source de l'Editeur visuel et les boutons S'abonner des outils de discussion.

Désabonnement

Il n'y a pas de préférence utilisateur disponible pour contrôler ce comportement.

Dans MediaWiki 1.43 et 1.44, les propriétaires des sites peuvent utiliser l'option de configuration $wgParserEnableLegacyHeadingDOM pour contrôler quel balisage est à utiliser. Cette option a été supprimée dans MediaWiki 1.45.

Les développeurs d'habillages ciblant MediaWiki 1.43 et 1.44 peuvent utiliser l'option d'habillage supportsMwHeading pour contrôler le balisage utilisé. Cette option a été supprimée dans MediaWiki 1.45.

Lorsque vous utilisez Parsoid pour afficher les pages, le nouveau balisage est utilisé inconditionnellement.

Calendrier

Wikis Wikimedia

  • janvier 2023 – A titre d'essai pour cette modification un type hybride de marquage avec des conteneurs est introduit pour les titres de niveau 2 sur les pages de discussion en utilisant DiscussionTools (T314714)
  • décembre 2023 – Implémentation corrigée des conteneurs (T353489)
  • février 2024 – Le nouveau balisage est disponible pour les utilisateurs qui testent le nouvel analyseur syntaxique Parsoid (T269630)
  • du 21 au 23 mai 2024 – Le nouveau balisage est disponible pous les habillages suivants : MonoBook, Timeless, Modern, CologneBlue, Nostalgia. (T365078)
  • du 4 au 6 juin 2024 – Le nouveau balisage est disponible pour les utilisateurs de l'ancien habillage Vector (T365736)
  • du 11 au 13 juin 2024 – Le nouveau balisage est disponible pour les utilisateurs de l'habillage MinervaNeue (T365736)
  • du 16 au 18juillet 2024 – Le nouveau balisage est activé pour les utilisateurs de l'habillage Vector 2022. À ce stade, tous les habillages principaux ont été réalignés. (T367601)

Versions de MediaWiki

Instructions pour la mise à jour du code

Habillages et styles globaux

Les habillages qui utilisent ResourceLoaderSkinModule configuré avec "features": { "elements": true } ne doivent pas obligatoirement être modifiés puisque les styles intégrés des titres ont été mis à jour.

Vos styles doivent être compatibles avec trois types de balisage simultanément : le nouveau type, l'ancien type (parce que les propriétaires de sites peuvent choisir de l'utiliser) et le balisage simple sans enveloppe (utilisé par la plupart des pages spéciales et par le contenu en mode édition de Parsoid).

Comme règle générale, les styles des blocs de titre (par exemple le fond, les bords...) doivent s'appliquer à la fois pour .mw-heading et h1-h6 (sauf s'ils sont imbriqués dans .mw-heading), alors que les styles pour les titres de type texte (comme les fontes, la couleur du texte...) doivent s'appliqer à h1-h6 et .mw-headline.

Depuis MediaWiki 1.44 le sélecteur .mw-html-heading peut être utilisé pour correspondre aux titres écrits à l'aide de la syntaxe HTML du wikicode (par exemple <h2 class="myclass">Heading</h2>). Un sélecteur tel que .mw-heading, .mw-html-heading peut être utilisé pour correspondre à tous les titres du wikicode de la page.

Vous pouvez suivre ces règles pour mettre à jour votre code :

  1. Là où vous utilisez un sélecteur tel que h1, h2, h3, h4, h5, h6, ajoutez .mw-heading.
  2. Là où vous utilisez un sélecteur tel que hN, ajoutez .mw-headingN.
  3. Là où vous utilisez un sélecteur tel que .mw-headline, ajoutez h1, h2, h3, h4, h5, h6.
  4. Annulez les styles appliqués à la fois à hN et à .mw-headingN lorsque le titre se trouve inclus dans le conteneur, en utilisant un sélecteur comme .mw-heading hN.

Une fois que l'option de configuration pour les propriétaires de sites est supprimée dans une version future de MediaWiki, vous pourrez supprimer les sélecteurs qui étaient seulement nécessaires pour prendre en charge l'ancien balisage (comme .mw-headline ou hN .mw-editsection).

Exemples de modification
Ancien CSS Nouveau CSS CSS mis à jour Depuis MediaWiki 1.44
h2 {
    border: 1px solid black;
    background-color: red;
    color: white;
    font-size: 2em;
}
.mw-heading2, h2 {
    border: 1px solid black;
    background-color: red;
    color: white;
    font-size: 2em;
}
.mw-heading2 h2 {
    border: none;
    font-size: inherit;
}
.mw-heading2,
h2.mw-html-heading {
    border: 1px solid black;
    background-color: red;
    color: white;
    font-size: 2em;
}

Exemples de modifications :

Extensions et gadgets

Il n'y a pas de modèle simple comme pour les styles, mais en général, vous devrez mettre à jour votre code pour travailler avec l'une ou l'autre des structures HTML. Parfois, c'est aussi facile que de changer les sélecteurs, comme dans la section ci-dessus.

Exemples de modifications :

Contenu du Wiki

Les TemplateStyles ciblant les sélecteurs h2 etc. bruts doivent être mis à jour de manière similaire aux habillages, voir ci-dessus. Dès que tous vos habillages de votre wiki utilisent la nouvelle balise, vous pourrez supprimer les sélecteurs qui n'étaient nécessaires que pour prendre en charge l'ancien balisage (comme .mw-headline ou hN .mw-editsection).

Les styles en ligne, et les TemplateStyles ciblant les classes CSS personnalisées ne nécessitent pas de modification parce que les conteneurs ne sont pas ajoutés aux titres écrits avec le balisage de style HTML <h2> quand il y a des attributs. Faire ainsi a causé trop de problèmes avec le balisage existant, et la motivation pour changer ne s'applique pas, car ces titres ne contiennent pas d'éléments d'interface comme les liens de modification des sections (T353489#9416500).

Exemples de modifications :