Wikipédia:Linter
Linter est une extension (voir la page de l'extension), qui vise à identifier les balises cassées et problématiques sur toutes les pages.
Plusieurs catégories existent afin de trier les différents problèmes et les catégories hautement prioritaires doivent être corrigées pour permettre la migration en juillet 2018 de Tidy (un outil basé sur HTML4) à RemexHtml (un outil basé sur HTML5). Tous les deux sont des analyseurs synthatique prévus pour réparer le code HTML cassé.
Actuellement, le logiciel Mediawiki gère le code source des pages selon le standard HTML4 grâce à Tidy. Cependant, la plupart des navigateurs récents utilisent le standard HTML5 et la migration sans corrections manuelles de la part des contributeurs ne peut être faite, car cela introduirait des erreurs dans le rendu des pages et la présentation de celles-ci pourra être cassée. L'extension Linter permet d'identifier les pages contenant des erreurs et les liste pour que les contributeurs et les robots puissent les nettoyer. La migration vers un rendu HTML 5 des pages ne pourra être fait que correctement en corrigeant ces erreurs.
La page spéciale Spécial:LintErrors liste les pages contenant ces problèmes, classées par ordre de gravité.
Corriger une erreur modifier
Problèmes catégorie par catégorie modifier
Balise de tableau qui devrait être supprimée modifier
Balise mal incluse avec des rendus différents en HTML5 et HTML4 modifier
Scénario modifier
Ce sont des balises incorrectement imbriquées qui se comporteront différemment dans HTML5 par rapport à HTML4. Ce sont des erreurs de haute gravité, car elles peuvent facilement créer des erreurs d'affichage.
Un scénario revient souvent et peut être utilisé comme cas général, prenons le wikicode suivant :
<span>a
b</span>
Quand le logiciel Tidy traite ce code, il génère le code HTML4 suivant après un nettoyage :
<p><span>a</span></p>
<p><span>b</span></p>
Un outil basé sur HTML5 comme RemexHtml nettoie le code façon différente afin de générer :
<p><span>a</span></p>
<p>b</p>
Solution modifier
Pour corriger les erreurs de cette catégorie, il faut changer le wikicode de la manière suivante :
| Wikicode | Résultat avec Tidy | Résultat avec Remex | Wikicode corrigé |
|---|---|---|---|
<span>a
b</span>
|
<p><span>a</span></p>
<p><span>b</span></p>
|
<p><span>a</span></p>
<p>b</p>
|
<span>a</span>
<span>b</span>
|
Autres conseils modifier
Le plus souvent, les pages wiki contiennent des erreurs de cette lorsqu'une balise span (ou toute autre balise dans la liste des balises affectées ci-dessous) est utilisée pour encapsuler une liste. En raison des interactions entre un bogue dans l'analyseur et les spécifications autour de l'analyse du code HTML5, lorsque Tidy sera desactivé, ces encapsuleurs ne s'appliqueront plus aux listes.
Lorsqu'une balise span est utilisée pour encapsuler une liste, utilisez plutôt une balise div. C'est la bonne façon de faire puisqu'une liste est une structure de blocs et qu'une div est plus appropriée au lieu d'une balise span, utilisée pour les contenus phrasés, des lignes de texte. C'est le correctif recommandé. Voir ce diff sur Wikipédia en italien pour exemple.
Balises affectées modifier
Les balises suivantes sont affectées.
ABBR, BDI, BDO, CITE, DATA, DEL, DFN, INS, KBD, MARK,
Q, RB, RP, RT, RTC, RUBY, SAMP, SPAN, SUB, SUP, TIME, VAR
Divers problèmes de remplacement dans Tidy modifier
Tableau multilignes dans une liste modifier
Problème modifier
Solution modifier
| Wikicode | Résultat avec Tidy | Résultat avec Remex | Wikicode corrigé |
|---|---|---|---|
* <table>
<tr><td>foo</td></tr>
</table>
bar
|
<table>
<tr>
<td>foo</td>
</tr>
</table>
<p>bar</p>
|
<ul><li>
<table>
<tbody><tr><td>foo</td></tr>
</tbody></table>
<p>bar</p>
</li></ul>
|
<table>
<tr><td>foo</td></tr>
</table>
bar
|
Multiples balises de mise en forme non fermées modifier
Problème modifier
Scénario 1 : effet cumulé avec plusieurs balises modifier
Lorsque plus d'une balise est laissée ouverte sur une page, les effets de ces balises s'accumulent sur la totalité de la page. Voir ce diff sur Wikipédia en italien pour un exemple d'un cas particulièrement mauvais avec 13 balises non fermées.
Tidy supprimait parfois ce comportement en limitant l'effet d'une balise non fermée à un fragment plus petit de la page (une section) alors qu'un analyseur HTML5 comme RemexHtml ne le fait pas.
Scénario 2 : utilisation incorrecte d'une balise ouvrante <balise> au lieu d'une balise de fermeture </balise> modifier
Parfois, les contributeurs utilisent accidentellement une balise d'ouverture au lieu d'une balise de fermeture. Dans certains scénarios, Tidy corrigeait automatiquement la deuxième balise pour qu'elle soit une balise de fermeture. Cependant, les analyseurs HTML5 ne le font pas automatiquement. Ainsi, avec RemexHTML, le rendu sera assez différent (exemple : ce diff sur itwiki).
Scénario 3 : interférence avec d'autres balises modifier
Parfois, ce problème est signalé à cause d'une interférence avec d'autres balises. Par exemple, cette contribution a résolu le problème en modifiant l'ordre de balises small et de balises de mise en gras/italique.
Solution modifier
Dans les deux scénarios, fermez la ou les balises ouvertes problématiques.
| Mauvaise syntaxe | Bonne syntaxe |
|---|---|
<u><big><code>foo</big><u>
|
<u><big><code>foo</code></big></u>
|
<code>foo<code>
|
<code>foo</code>
|
</small>foo<small>
|
<small>foo</small>
|
<small>Texte<br />'''''en gras/italique <small><small>et en petit'''''</small></small></small>
|
<small>Texte<br />'''''en gras/italique <small><small>et en petit</small></small>'''''</small>
|
Balises affectées modifier
Il est à noter que ces scénarios n'ont d'incidence que sur le formatage des balises (a, b, big, code, em, font, i, nobr, s, small, strike, strong, tt, et u).
Palliatif au bogue de délimitation de paragraphe modifier
Balises auto-fermantes modifier
Bogue de Tidy affectant les liens englobant les balises <font> modifier
Problème modifier
Solution modifier
| Wikicode | Résultat avec Tidy | Résultat avec Remex | Wikicode corrigé |
|---|---|---|---|
<font color="green">[[Foo]]</font>
|
<a href=".."><font color="green">Foo</font></a>
|
<font color="green"><a href="..">Foo</a></font>
|
[[Foo|<font color="green">Foo</font>]]
ou mieux, [[Foo|<span style="color:green;">Foo</span>]]
|
Bogue d'espace blanc Tidy modifier
| Wikicode | Résultat avec Tidy | Résultat avec Remex | Wikicode corrigé |
|---|---|---|---|
<span class='nowrap'>a </span><span class='nowrap'>b</span>
|
<span class='nowrap'>a</span> <span class='nowrap'>b</span>
|
<span class='nowrap'>a </span><span class='nowrap'>b</span>
|
<span class='nowrap'>a</span> <span class='nowrap'>b</span>
|
Citation non fermée dans l’entête modifier
Problème modifier
Solution modifier
| Wikicode | Wikicode corrigé |
|---|---|
text
==''foo==
bar
|
text
==''foo''==
bar
|