Préambule
J'ai écris ces quelques lignes pour apporter mon point de vue et le fruit de mes réflexions sur la question très sensible des règles de formatage des Wikis. Si c'est sur les pages de
WikiNi que je fais cela, ça n'est pas par hasard mais par ce que je suis séduit par la simplicité de ses
ReglesDeFormatage. J'ai parcouru le web pour voir les quelles étaient les propositions déjà existantes. Ceci dit, j'imagine bien que de telles propositions ont été déjà écrites ailleurs et en nombre.
De la même manière que l'HTML a définit des règles universelles (les balises) de formatage pour le web, je pense qu'il est nécessaire d'en faire de même pour l'écriture des pages en Wiki. Quelque soit votre avis sur ce qui suit, j'espère que vous le commenterez, que vous l'améliorerez, et que par la suite cette amélioration commune vienne enrichir
WikiNi. --
DavidMartineau
Les impératifs sont les suivants :
- Eviter les balises HTML car elles sont trop longues et ne donnent pas une idée du résultat en mode édition
- Le code source (celui qu'on édite) doit avoir une apparence la plus proche possible du résultat final
- Ne pas tomber dans le piège d'un nouveau langage à balises comme on peut le voir dans d'autres wiki, par exemple avec %%BOLD%%le texte%%BOLD%%
- Offrir autant de formatage que le permet l'HTML (après tout c'est le format de destination), surtout qu'il est possible via les CSS de jouer sur le rendu visuel des différentes balises HTML de formatage de texte (voir plus bas <em>, <ins>, <cite> etc...).
Ce que l'on peut utiliser :
- Lorsque l'on écrit un texte, il y a peut de chance d'utiliser les marques de ponctuation et les caractères spéciaux deux fois de suite (par exemple "##", Wikini suit déjà ce principe),
- Pour les listes, on a naturellement tendance a commencer chaque ligne par un tiret ou par un chiffre suivit d'une parenthèse donc il n'y a pas de syntaxe particulière a imaginer,
- Pour les titres, il est judicieux d'utiliser un marquage grandissant avec taille du texte ( ce que fait Wikini avec les signes "=") et c'est un principe qu'on peut étendre à d'autres types de formatage qui sont voisins,
- Quoi qu'il en soit, il y a plus de caractères spéciaux que de balise HTML qui servent aux formatage du texte, nulle besoin de faire des combinaisons de caractères pour créer des balises Wiki.
Premières conclusions :
- la tâche se résume finalement à inventer un dictionnaire balises HTML servant au formatage - marqueurs Wiki, et inventer ces marqueurs
- nous allons utiliser non pas des balises mais ce que j'appelle des marqueurs (ce que j'entend par balise c'est "un_signe_ouvrant" nom_de_la_balise "un_signe_fermant", par exemple dans le cas de l'HTML c'est < et > qui sont utilisés comme signes ouvrant et fermant),
- les marqueurs seront composés de caractères spéciaux répétés deux fois ou plus si besoin,
- les marqueurs seront symétriques, c'est à dire que le marqueur ouvrant sera le même que le marqueur fermant
Au départ, pour le code source, nous disposons des caractères spéciaux suivants :
@ Arobase, notion de correspondance (bon candidat pour <abbr> et <acronym>, voir plus bas)
# Dièse, il rappelle un quadrillage, idéal pour le texte à espacement fixe
& Ampersand
" Guillemets double
' Guillemet, prete trop confusion avec les guillemets double si répété deux fois
§ Paragraphe
! Point d'exclamation, proscrit car beaucoup de gens écrivent en mettant plusieurs points d'exclamation
¡ Point d'exclamation reversé, idem que précédemment (utilisé pour la ponctuation espagnole)
? Point d'interrogation, proscrit car beaucoup de gens écrivent en mettant plusieurs points d'interrogation
¿ Point d'interrogation reversé, idem que précédemment (utilisé pour la ponctuation espagnole)
( Parenthèse ouvrante
) Parenthèse fermante
{ Accolade ouvrante, convient bien aux actions dans Wikini
} Accolade fermante, idem que précédemment
[ Crochet ouvrant, convient bien aux liens dans Wikini (voir cependant les différentes possibilités de liens, images etc...)
] Crochet fermant, idem que précédemment
| Barre
° Degré (ou numéro), trop petit et facilement confondu avec *
= Egal, convient bien aux titres dans Wikini (mais pourquoi pas utiliser les 6 tailles de titres offertes par l'HTML ?)
± Plus ou moins, peu populaire, risque d'être un obstacle à son adoption
+ Plus, notion d'ajout
- Moins, notion de retrait
_ Sous-trait, notion de soulignement
^ Circonflexe,
¨ Tréma, petit, se confond avec "
$ Dollar, fait penser naturellement à un "S" rayé
¥ Yen
€ Euro
£ Livre
* Etoile (ou multiplié), largement adopté comme marqueur pour le gras
% Pour-cent
‰ Pour-mile, peu populaire
` Guillemet inversé, peu populaire (sauf pour certains programmeurs !)
, Virgule, trop commun
; Point virgule, trop commun
. Point, trop commun
: Deux points, trop commun
/ Oblique, notion de penché
\ Oblique inversé, idem que précédemment
µ Micro, peu populaire
÷ Divisé
… Trois points, se confond avec . . .
~ Tilde
< inférieur
> supérieur
On peut voir déjà que certains choix sont déjà fait facilement pour associer une balise HTML à un marqueur Wiki.
A l'arrivée, pour le code HTML, nous disposons des balises suivantes :
<b> gras </b>
<em> mis en valeur</em>
<strong> fortement mis en valeur </strong>
<i> italique </i>
<s> barré </s> (ou <strike> </strike>) que l'on ne doit plus utiliser d'après W3C (utilisez <span style="text-decoration: strike"> barré </span>)
<u> souligné </u> que l'on ne doit plus utiliser d'après W3C (utilisez <span style="text-decoration: line-through"> souligné </span>)
<tt> télétype</tt>
<pre> préformaté </pre>
<ins> inséré </ins>
<del> effacé </del>
<sup> exposant </sup>
<sub> indice </sub>
<cite> citation </cite>
<q> citation en ligne </q>
<blockquote> citation en block </blockquote >
<code> entrée de code </code>
<samp> sortie de code </samp>
<kbd> saisie clavier </kbd>
<var> variable </var>
<dfn> définition </dfn>
<abbr> abbréviation </abbr>, encore peu utilisé mais peut pourtant s'avérer trés utile
<acronym> acronyme </acronym>, encore peu utilisé mais peut pourtant s'avérer trés utile
<p> paragraphe </p>
<table><th><tr><td> pour les tableaux
br retour de ligne
hr séparation horizontale
L'intérêt d'implémenter toutes ces balises HTML en marqueurs Wiki permet via les CSS d'offrir une très grande variété de formatage aux rédacteurs sans pour autant qu'ils aient beaucoup de choses à apprendre.
Proposition de formatage :
Les attributs de texte
- ** gras ** code pour <b> gras </b>
- *** mis en valeur *** code pour <em> mis en valeur</em>
- **** fortement mis en valeur **** <strong> fortement mis en valeur </strong>
- // italique // code pour <i> italique </i>
- /// citation /// code pour <cite> citation </cite>
- //// citation en ligne //// code pour <q> citation en ligne</q>
- ///// citation en block ///// code pour <blockquote> citation en bloc</blockquote >
- $$ barré $$ code pour <s> barré </s> (ou <span style="text-decoration: strike"> barré </span>)
- __ souligné __ code pour <u> souligné </u> (ou <span style="text-decoration: line-through"> souligné </span>)
- ## télétype ## code pour <tt> télétype</tt>
- ### préformaté ### code pour <pre> préformaté </pre>
- ++ inséré ++ code pour <ins> inséré </ins>
- -- effacé -- code pour <del> effacé </del>
- ^^ exposant ^^ code pour <sup> exposant </sup>
- ~~ indice ~~ code pour <sub> indice </sub>
- @@ abbréviation @@ code pour <abbr> indice </abbr>
- @@@ acronyme @@@ code pour <acronym> acronyme </acronym>
- %% entrée de code %% (avec pourquoi possibilité de spécifier le langage du code) code pour <code> entrée de code </code>
- %%% sortie de code %%% code pour <samp> sortie de code </samp>
- %%%% saisie clavier %%%% code pour <kbd> saisie clavier </kbd>
- && variable && code pour <var> variable </var>
- &&& définition &&&" code pour <dfn> définition </dfn>
Les titres
- ======= titre 1 ======= code pour <h1> titre 1 </h1>
- ====== titre 2 ====== code pour <h2> titre 2 </h2>
- ===== titre 3 ===== code pour <h3> titre 3 </h3>
- ==== titre 4 ==== code pour <h4> titre 4 </h4>
- === titre 5 === code pour <h5> titre 5 </h5>
- == titre 6 == code pour <h6> titre 6 </h6>
les signes = supplémentaires ne comptant pas
notez ici que l'on utilise <h1> jusqu'a <h6> contrairement à ce que fait
WikiNi pour l'instant.
Autres
- " " non interprété " " (sans espaces) pour spécifier du code qui ne doit pas être interprété par le moteur de Wiki
- - - - (sans espaces) code pour retour de ligne forcé
- - - - - (sans espaces) code pour ligne de séparation
- {{ action }} code pour les générateurs de contenu de Wikini
- les paragraphes sont spécifiés en laissant au moins une ligne vide dans le code d'édition, puis au niveau de l'HTML ils sont réellement codés par des balises <p> et </p> (pratique pour leur donner un style via les CSS)
On peut encore s'interroger sur l'utilité de permettre au rédacteur de choisir l'alignement des paragraphe ou bien laissé ce choix au webmaster du Wiki dans les CSS. Même sur la possibilité de changer la couleur du texte. Mon avis serait de fixer tout cela dans les CSS, sinon je propose ce marquage :
- << texte << code pour <p style="text-align: left"> texte </p>
- >> texte >> code pour <p style="text-align: right"> texte </p>
- <> texte <> code pour <p style="text-align: center"> texte </p>
Liens, images, insertions de fichiers
- [[url]] code pour <a href="url">url</a>
- [[url titre]] code pour <a href="url">titre</a>
- [[[url titre]]] code pour <img src="url" alt="alt"/> (si url pointe vers un fichier image), force donc l'affichage d'une image plutot que son URL.
- [[[[url titre]]]] code pour <a href="url"><img src="icone_telecharger" alt="titre"/>titre</a>, force l'affichage sous forme d'icone de fichier a télécharger.
- se réserver aussi la possibilité de pouvoir faire de l'imbrication [[url [[[url titre]]] ]] qui donnera <a href="url"><img src="url.jpg" alt="titre"/>titre</a>
Tableaux
- | cellule | code pour une cellule
- || entete || code pour une cellule d'entete
|| entete1 || entete2 || entete3 ||
| cellule1 | cellule2 | cellule3 |
| cellule4 | | cellule6 |