Des formules mathématiques pour le web
Depuis l’apparition de l’informatique, la rédaction d’équations mathématiques a toujours posé des problèmes. Cela tient au fait que les mathématiciens n’ont eu de cesse d’inventer de nouveaux langages pour décrire les concepts qu’ils découvraient. Une situation qui n’a fait que s’empirer avec l’arrivée du Web et du HTML. A tel point qu’on peut aujourd’hui se poser la question de savoir comment rédiger et publier des équations mathématiques.
TeX et LaTex
Le standard pour rédiger des équations mathématiques est depuis le début des années 80 TeX et son extension LaTeX. Il s’agit d’un langage permettant d’entrer des équations mathématiques en utilisant le clavier. On peut ainsi entrer les racines d’une équation du deuxième degré de la façon suivante:
$x = {-b \pm \sqrt{b^2 - 4ac}\over 2a}$
On affiche ensuite le résultat sous forme graphique à l’aide d’un logiciel qui interprète les commandes pour produire:
LaTeX est un ensemble de macros (des commandes) qui permettent de simplifier les tâches les plus courantes. Comme ces commandes génèrent du TeX, elles ne changent pas ce qu’il est possible de faire mais seulement la façon de le faire. On obtient donc les mêmes résultats qu’avec du TeX « classique ».
Le problème de l’affichage pour les pages WEB
Le problème principal, lorsqu’on veut afficher des formules mathématiques en HTML, est que ce format ne permet pas un placement précis des différents éléments. En effet, en HTML le positionnement des éléments (caractères, symboles, etc) n’est pas spécifié de façon exacte mais est laissé à la discrétion du navigateur. C’est d’ailleurs ce qui permet à une page web de s’adapter de façon dynamique à la taille du navigateur. Cela permet d’éviter que du texte apparaisse à droite en dehors de la zone d’affichage comme ça peut être le cas avec, par exemple, un document PDF.
Pour afficher des formules mathématiques, il y a principalement deux solutions:
- La première consiste à générer des fichiers images (pnp, tiff, jpeg, etc) et à les insérer dans le document web. C’est mal pratique, le contenu devient invisible aux moteurs de recherche et les images ralentissent le web puisqu’elles occupent sensiblement plus de place que du texte.
- La deuxième solution consiste à utiliser les règles du HTML pour positionner aussi bien que possible les différents éléments. Le résultat est moins bon et est aléatoire, les différents navigateurs n’interprétant pas les règles de la même façon.
MathML
Pour répondre au problème de l’affichage de formules mathématiques pour le WEB, le W3C a créé à la fin des années 90 un nouveau langage: MathML. MathML permet lui aussi de décrire des équations mathématiques mais est basé sur le XML. A titre d’exemple voici la même équation que précédemment mais en MathML cette fois:
<math> <mrow> <mi>x</mi> <mo>=</mo> <mfrac> <mrow> <mrow> <mo>-</mo> <mi>b</mi> </mrow> <mo>±</mo> <msqrt> <mrow> <msup> <mi>b</mi> <mn>2</mn> </msup> <mo>-</mo> <mrow> <mn>4</mn> <mo>⁢</mo> <mi>a</mi> <mo>⁢</mo> <mi>c</mi> </mrow> </mrow> </msqrt> </mrow> <mrow> <mn>2</mn> <mo>⁢</mo> <mi>a</mi> </mrow> </mfrac> </mrow> </math>
La syntaxe est nettement plus longue cependant MathML n’a pas été conçu pour être entré « à la main » mais au travers d’outils d’édition.
Le principal problème de MathML est qu’il n’est encore que très peu supporté par les navigateurs courants. Le seul qui le supporte vraiment étant Firefox depuis la version 1.0. Pour les autres, il faut au mieux installer un plugin – c’est le cas par exemple pour Internet Explorer 7 et 8 – ou alors se tourner vers une autre solution.
Les éditeurs WYSIWIG
Des logiciels existent également pour permettre de créer des équations mathématiques de façon visuelle – on parle d’éditeur WYSIWIG. Ce sont des programmes qui permettent de créer des formules au travers d’icônes et qui affiche directement le résultat finale. L’exemple le plus connus étant l’éditeur d’équations mathématiques de Microsoft Word. Ces solutions sont certes intéressantes pour créer des documents mais elles souffres généralement de deux défauts:
- Tout d’abord ces programmes sont des outils qui facilitent l’édition, mais ils ne fournissent pas une solution à la question de savoir comment afficher des équations dans une page Web. Dans la plupart des cas ils produisent des documents à télécharger – au format PDF par exemple.
- L’autre problème majeur vient du fait que l’édition d’équations mathématiques au travers d’un éditeur graphique devient vite extrêmement inconfortable. Certes le néophyte voit sont travail facilité mais cela se fait au détriment de l’utilisateur expérimenté. Raison pour laquelle TeX/LaTeX restent pertinent malgré leurs ages.
MathJax
Heureusement MathJax fournit une solution élégante sous la forme d’une librairie open source écrite en JavaScript.
Pour l’utiliser, il suffit de rajouter un lien qui pointe vers la librairie dans l’entête HTML de la page. Une fois le lien effectué l’ensemble des formules, TeX et MathML, qui apparaissent dans la page sont automatiquement converties en HTML. Comme MathJax est écrit en JavaScript, il fonctionne avec tous les navigateurs qui supportent ce langage. C’est à dire tous les navigateurs récents. MathJax arrive à obtenir un bon rendu en HTML en exploitant au mieux les technologies du web: CSS et fontes web.
MathJax fournit également un menu contextuel pour effectuer les opérations habituelles: copier, zoomer, etc.
Enfin MathJax fournit une interface de programmation (API) qui peut être utilisée par d’autres programmes pour fournir des services supplémentaires.
Le mieux pour se convaincre de l’utilité de MathJax, c’est encore de le voir en application. Pour rentrer une équation en LaTeX, il suffit de l’inclure entre deux $$ comme ceci (mais sans espace entre les $):
$ $ x = {-b \pm \sqrt{b^2 – 4ac}\over 2a} $ $
Pour obtenir:
D’autres exemples sont disponibles sur le site the MathJax:
Le seul véritable inconvénient avec MathJax, c’est qu’il y a un léger délai avant que les équations soient traduites au moment ou la page se charge. Un léger désagrément que compense largement ses avantages.
A noter que Google Docs (outil de rédaction collaboratif en ligne) prend en charge le langage LaTex ! Cela peut être très utile si on doit convertir le document final en pdf ou Word !
C’est un article intéressant, pour les éditeurs WYSIWIG c’est facile et plus pratique indépendamment de ses défauts et surtout pour ceux qui utilisent les CMS comme Joomla ou Drupal, …
Il n’est ps question dans cet article ,des possibilités de TeXmacs, qui est wysiwyg contrairemant à Tex et latex ,mais qui emploie des éléments de teX comme les fontes et BIBtex pour la paretie biographie . C’est un produit relativement plus jeune que Tex,latex et certains patois comme SWP, SW et Lyx qui ne sont pas wysiwig,TExmacs possède un oprdre « exporter » avec une variante .html (utilisant » Css »et une sortie.pdf Maais alors que les fichiers en .pdf sont très bons, ceux en .html Plus Css sont mauvais dès qu’il ya des formules mathématiques. Une utilisation de votre application en sortie est-elle possible et éventuellement bénéfique dans la perspective de mon futur site web?