Imperavi Redactor, un WYSIWYG ultra léger

Si comme moi vous avez l'habitude de développer des outils d'administration pour les sites de vos clients, ce billet devrait vous intéresser. Il concerne l'implémentation des outils WYSIWYG comme peuvent l'être CKEditor ou Tiny MCE.

Place aux scripts légers

Une admin qui n'est pas visible par les internautes ne doit pas pour autant être une 2CV. L'expérience utilisateur est aussi importante dans le back-office que sur le front-office. Encore plus quand certains clients n'ont pas la fibre web dans le sang. Vous connaissez mon goût pour l'affichage rapide des mes sites. J'applique la même méthodologie de travail pour les admins de mes clients. Cela doit être simple à utiliser et rapide à charger.

Du coup, j'ai longtemps cherché un enrichisseur de textes performant et léger pour remplacer CKEditor qui, bien qu'amélioré dans sa dernière version, est vieillissant d'un point de vue du code source. Quand je vois le nombre de fichiers nécessaires à son fonctionnement comparé à Imperavi Redactor, il y a de quoi devenir chauve. :)

Si vous n'avez pas peur de dépenser quelques euros pour vous offrir la licence payante à 99 € en version développeur avec les mises à jour à vie et l'installation illimitée sur les sites que vous développez, il faut foncer !

Et je vous le dis amis lecteurs, ce script est une tuerie pour les développeurs. Non seulement à installer puisqu'il possède seulement 3 fichiers (2 javascript et 1 css) mais également à paramétrer. Il suffit juste d'appeler l'instance sur la page où il est destiné et de régler les paramètres selon vos besoins ou utiliser ceux proposés par défaut. Ainsi vous pouvez régler la hauteur de l'éditeur, customiser la barre d'outils, interdire l'utilisation de balise (script, html, body, head, etc.) par exemple.

Avantages et inconvénients de Redactor

La liste est longue des avantages par rapport aux éditeurs que vous avez l'habitude d'utiliser que les inconvénients sont finalement insignifiants. Aucun script n'est idéal mais celui-ci frôle toutefois la perfection en terme d'utilisation.

En plus de sa légèreté, Redactor se distingue par sa facilité pour l'utilisateur à uploader des images et des fichiers sur le serveur. Un simple glisser-déposer suffit pour l'envoyer en ligne. Si vous êtes comme moi perfectionniste, vous pouvez développer un script en PHP pour choisir les dossiers, renommer les fichiers à la volée en ajoutant un horodatage au nom afin d'éviter les doublons.

Depuis la version 9, l'édition est facilitée afin de modifier la balise Alt et le calage à gauche ou à droite de l'image. Tout comme le redimensionnement des images à l'aide d'un curseur qu'il suffit de déplacer pour l'afficher à votre convenance. J'ai apporté mon petit lot d'améliorations pour qu'il soit un peu plus conforme à mes attentes comme le centrage ou l'ajout d'une balise Titre en plus du Alt.

De plus, il est désormais possible de sélectionner la zone d'une image dans Photoshop et de la copier directement dans l'éditeur sans passer par la fenêtre d'upload. Vu les modifications que j'ai apporté quant à la gestion des dossiers, je ne l'utiliserais sans doute pas. Mais sachez que cette possibilité existe. Et ça c'est fort je trouve !

La gestion des vidéos est quant à elle admirable. Soit vous copiez le code d'intégration (iframe) de la vidéo Youtube, Viméo ou Dailymotion dans la fenêtre approprié, soit vous copiez le lien de la page et Redactor s'occupe de la convertir automatiquement dès que vous pressez la touche Entrée de votre clavier. Niveau facilité d'utilisation, il est difficile de faire beaucoup mieux.

Étant donné que je vends beaucoup de prestations de rédaction, j'utilise énormément Word. J'ai enfin trouvé l'outil qui me permet de copier-coller le texte directement dans l'éditeur sans avoir besoin de nettoyer le code pourri généré par le logiciel de Microsoft ni de passer par un logiciel tiers comme passerelle.

Les dernières technologies au service de la simplicité

Redactor supporte le HTML5, Amazon S3 et peut intégrer différents plugins que vous pouvez développer par vous-même si vous touchez votre bille en javascript ou télécharger ceux proposés par la communauté. Pour un annuaire par exemple, le plugin pour compter les mots est très utile.

Du côté des inconvénients, la principale faiblesse que je lui trouve est l'ajout par moment de balises qui n'ont rien à faire comme le br par exemple. Il semblerait que dans la version 9 (j'utilise encore la version 8) que ce ne soit plus le cas. Si c'est confirmé, je lui trouverais encore moins de défauts. :-)

Si on est tatillon, on peut aussi regretter l'absence d'une bibliothèque multimédia pour gérer les images et les fichiers sur le serveur afin de les supprimer. Certains d'entre vous me connaissent, j'ai compensé cette absence par un code maison. Finalement, il répond à mes attentes et tient en seulement quelques lignes de PHP.

Vu la vitesse des développeurs à améliorer l'outil j'ai hâte de voir les prochaines versions. Il devrait y avoir de belles nouveautés. Je finis ce billet en vous donnant le lien pour aller jeter un coup d’œil et je vous propose une courte vidéo à propos de la gestion des images et des vidéos.

Pour visiter le site officiel : http://imperavi.com/redactor/