Ryuran.info

BBcode, Wyswyg, wikitext

Cela fait pas mal de temps que je n'ai pas poster un nouvel article. Aujourd'hui j'ai trouver de quoi vous parler car ayant parcouru le web à la recherche de la solution miracle je n'ai trouvé qu'une réponse :

Il n'existe pas de solution correct pour permettre aux utilisateur de saisir du text riche.

J'ai chercher toutes les possibilité de bbcode à Markdownen passant Textile, Wikitext, zCode et même du coté des wyswyg et des nettoyeurs de xhtml.

BBcode

BBcode qu'est ce que c'est ?

Cette syntaxe était à l'origine très basique. Elle permettait simplement de mettre le texte en gras, souligner, italique ou insérer un lien ou une image. Tout ceci grâce à de balises semblable au html mais avec de crochets.

Exemples

BBcode :
[b]texte en gras[/b]

html équivalent :
<b>texte en gras</b>

Avantages

  • Le BBcode est fait pour être simple pour les utilisateurs (pas besoin de connaitre le html).
  • Il est utilisé par la grande majorité des forum à travers le web.

Inconvénients

  • Il y a plus d'une vingtaine de balises différentes, soit un nombre plus important que les balises xhtml de mise en forme simple usuelles.
  • Le code est difficile à saisir à cause des crochets "[" et "]" plus difficiles d'accès que les "<" et ">" du html.
  • BBcode est orienté "mise en forme" et non pas "sens sémantique". Même si les dernières versions changent ce problème, les utilisateur continueront à ne pas prendre en compte le sens sémantique des balises.
  • Les parseurs usuels génèrent du xhtml invalide pour la plus part et ne corrige pas vraiment le chevauchement de balises ([b]texte [i]en gras[/b] ou en italique[/i] qui est faux).
  • Les parseurs sont lourds et utilisent trop d'expression régulières. Et plus encore quand on demande que le code généré soit correct (je parle d'expérience).
  • Il existe de nombreuses variantes (entres différents forums).

Syntaxes Wiki

Les syntaxes Wiki qu'est ce que c'est ?

Les wikis utilisent des langages de balisage léger. Il y en existe plusieurs dont les plus connu et plus utilisés qui sont wikiText, Textil et Markdown.

La syntaxe n'utilise pas de balise comme le bbcode ou le html. Il s'inspire de la mise en page que l'on fait habituellement sur un éditeur de texte simple comme le bloc note (notepad).

Exemple avec markdown

syntaxe :
__texte mis en importance__

html équivalent :
<strong>texte mis en importance</strong>

Avantages

  • Très simple d'utilisation. On s'y fait vite.
  • Très complet.
  • La syntaxe source est facile à lire et n'est pas pollué de balisage.

Inconvénients

  • Il existe de nombreuses variantes.
  • Les parseurs sont aussi peuplés d'innombrable expressions régulières.
  • Trop complet pour le contenu d'un forum.

zCode (le BBcode XML)

zCode qu'est ce que c'est ?

Le zCode à été créer par le site du zéro pour l'édition de leurs articles ainsi que sur leur forum.

C'est simplement un xml inspiré du bbcode. Une sorte de HTML simplifié et surtout en français.

Exemple

zCode :
<gras>texte mis en importance</gras>

html équivalent :
<strong>texte mis en importance</strong>

Avantages

  • Le zCode est fait pour être simple pour les utilisateurs (pas besoin de connaitre le html).
  • Le sens sémantique est respecté.
  • Le code est en français.
  • L'utilisation des chevrons ("<" et ">") rend la saisie plus facile comparé au BBcode.
  • Donne la possibilité d'utiliser un parseur xml (avec php5 par exemple) donc moins d'expressions régulières.
  • On peut aussi l'utiliser de différentes façon comme tout ce qui est structuré avec du xml.

Inconvénients

  • Il est utilisé uniquement par le site du zéro (et par certains de leurs disciples) .
  • Le xml interdit l'erreur de syntaxe (corriger les erreurs de syntaxe via le parseur ou alerter l'utilisateur si il y a une erreur).
  • Code en français oui mais pour un site multilingue il faudra plusieurs versions différentes.
  • La syntaxe n'est pas bien différente du html (c'est un site de formation à la création de site web) donc facile d'utilisation pour les membres. Il faudrait voir si les autres s'y retrouvent.

WysWyg (What you see what you get)

Un éditeur WysWyg qu'est ce que c'est ?

C'est un éditeur entièrement visuel. C'est à dire que la mise en forme ce fait en live comme dans un logiciel de traitement de texte classique.

Avantages

  • Les utilisateurs n'ont besoins d'aucune connaissance particulière.
  • Aperçu direct du texte en cours de rédaction avec la mise en forme final.

Inconvénients

  • Nécessite javascript (ou plugin/extention pour le navigateur).
  • Le code généré est souvent invalide.
  • Problème de sécurité (html).

la variante WysWyM (What you see what you Mean)

C'est comme un WYSWYG mais plus orienté vers la sémantique que vers la mise en forme. Pour l'instant il n'en existe qu'un seul, WymEditor. Il est bien avancé mais pas encore aboutis.

Conclusion

Aucune solution ne se démarque par rapport aux autres. Elles ont tous des avantages et des inconvénient. Bien que le zCode est une bonne idée elle est plus avantageuse pour les programmeurs que pour les utilisateur.

La meilleur solution à mon avis

Il faudrait un code xhtml simplifié (ou un nouveau code xml) qui n'aurai pas la limite de la langue qu'à le zCode. Mais entièrement saisis pas WYSWYG pour ne pas demander aux utilisateur d'apprendre un langage.

Avantages

  • Les utilisateurs n'ont besoins d'aucune connaissance particulière.
  • Aperçu direct du texte en cours de rédaction avec la mise en forme final.
  • Le sens sémantique est respecté (en fonction du parseur).
  • Sans javascript l'utilisation des chevrons ("<" et ">") rend la saisie plus facile comparé au BBcode.
  • Donne la possibilité d'utiliser un parseur xml (avec php5 par exemple) donc moins d'expressions régulières.
  • On peut aussi l'utiliser de différentes façon comme tout ce qui est structuré avec du xml.

Inconvénients

  • Les personnes ne pouvant pas bénéficier de javascript seront désavantagées.
  • Il faudrait que le système soit normaliser et entretenu par une communauté (penser au plugins pour forums existant).

Remarque : sur le site du zero il y a un aperçu dynamique ce qui est une bonne alternative au wyswyg.

Initiation à l'accessibilité

Varouj m'a demandé des informations sur
l'accessibilité des sites Internet. Je me suis donc rendu compte que sur découpe-fr c'est un sujet dont on parle peu et qui pourtant est important. Je rédige donc cet article pour rappeler des souvenirs à certains et en informer d'autre.

Lire la suite...

Creative Commons

Qu'est ce que c'est et comment ça marche ? Ce sont deux questions que je me suis posé la première fois que j’ai vu apparaître ces termes.

J’ai vite trouvé une réponse à la première. Creative Commons est une licence crée pour le partage et la diffusion des œuvres (Jusque là pas de problème). Avec cette licence on peut interdire l’utilisation de l’œuvre à but commercial (ça tombe bien c’est ce que je veux). Mais la vrai question est comment appliquer cette licence à l’œuvre en question.

La réponse est donnée par une BD simple à comprendre trouvée sur internet.

Merci selby !

Comment choisir mon linux ?

J'avais pensé à Gentoo mais j'ai un doute.

J'aimerais un linux avec une interface facilement modelable (ce serait génial si on pouvait faire le design en css). J'aimerais aussi qu'il reconnaisse ma carte wifi et mon réseau sans fil que je ne galère pas trop avec la live-box. J'aimerais qui soit stable (d'un autre coté j'ai vécu avec windows donc tant que c'est plus stable que windows ça serait le minimum).

Si quelqu'un peut me conseiller je veux bien son mail merci à vous.

&lt; et &gt;

Je me plante tout le temps avec ces deux entités html. En déconnant avec un ami j'ai fini par trouver un moyen mnémotechnique pour ne pas me tromper entre ces deux symboles (&lt; et &gt; servent respectivement à afficher < et > quand on les met dans une page html). Je me disais à chaque fois "g" comme "gauche" donc je met &gt; à gauche et bah non là était mon erreur en fait c'est plutôt "l" comme "left" donc je met &lt; à gauche. C'est quand même gênant on ne sait donc pas lequel est à gauche et lequel à droite. La solution trouvée est de se rapporter au code de la route. En France on roule à droite donc le "g" comme "gauche" est à droite car il est français et le "l" comme "left" est à gauche car il est en anglais Et les anglais roulent à gauche. C'est en fait comme le sens dans lequel roulent les voitures dans leur pays respectifs.

Donc dans l'ordre on a &lt; et &gt; ce qui donne < et >.

Majuscules à accents

J'ai toujours été embêté par les majuscules à accent ou à cédille quand il fallait écrire avec mon PC. Donc j'ai cherché un petit peu pour trouver comment écrire ce genre de lettres au clavier. J'ai trouvé les numéros Alt + ???? sur cette page : http://www.cylibris.com/fr/auteurs/bar_typo.html.

Voici la liste des caractères souvents utilisés :

  • Alt 0171 guillemet français ouvrant : «
  • Alt 0187 guillemet français fermant : »
  • Alt 0151 tiret cadratin : —
  • Alt 0169 symbole copyright : ©
  • Alt 0192 A accent grave : À
  • Alt 0194 A accent circonflexe : Â
  • Alt 0196 A tréma : Ä
  • Alt 0199 C capitale cédille : Ç
  • Alt 0200 E accent grave : È
  • Alt 0201 E accent aigu : É
  • Alt 0202 E accent circonflexe : Ê
  • Alt 0203 E tréma : Ë
  • Alt 0206 I accent circonflexe : Î
  • Alt 0207 I tréma : Ï
  • Alt 0212 O accent circonflexe : Ô
  • Alt 0214 O tréma : Ö
  • Alt 0217 U accent grave : Ù

Comme mon CMS est en utf-8, je peux me permettre de ne pas rechercher les entités html pour ce genre de caractères.

Maintenant je vais pouvoir dire : Ça va ? sur GoogleTalk avec une majuscule.

Pour ceux qui codent encore en iso-truc-machin, on peut trouver une liste assez complête des entitées html sur Comment ça marche : Listes des entités html sur www.commentcamarche.net

Encodage utf-8 PHP/mySQL

Je ne dois pas l'avoir dit encore sur mon blog mais je suis en plein développement d'un petit CMS en php. Sa particularité est d'être extensible, multilingue et surtout il peut aussi bien servir pour un gros portail que pour un petit site. Bien sûr tout ça dans le respect des standards.

En fait si j'écris cet article c'est pour vous raconter les problèmes que j'ai rencontré au niveau de l'encodage utf-8 pour ce CMS. Aussi bien au niveau du php et de la base de donnée mySQL.

Lire la suite...