The Joomla! Community Magazine™

La création d'un article avec Joomla! n'a jamais été aussi facile !

Written by | Tuesday, 30 September 2014 16:00 | Published in 2014 October
Joomla est excessivement flexible et offre de multiples possibilités. Cependant, lorsque vous travaillez avec, ceci peut apparaître comme un inconvénient tant les paramétrages et les options de navigation sont nombreux. Pour un spécialiste de Joomla, habituellement, ceci n'est pas un problème mais, pour beaucoup d'utilisateurs cela peut être une pierre d'achoppement. L'ajout de nouveaux articles via le site (en frontend) est souvent le premier contact d’un utilisateur avec Joomla. De fait, cette opération devrait s’avérer excessivement simple, pourtant, nombreux sont à la trouver très complexe.

L’étude de cas de l’utilisateur final

J'ai voulu tester et comprendre ce que les utilisateurs finaux éprouvent. J’ai ainsi configuré un site simple sous Joomla 3 et j’ai demandé à ma petite amie Julianne de venir m’aider (NDT : Julianne n’est pas ma petite amie, mais bien celle de Sander. Il me semblait important de préciser la chose afin d’éviter tout malentendu ;) ). Elle sait ce qu’est Joomla, mais ne l'avait jamais utilisé auparavant. Je lui ai simplement fourni ses informations de connexion et lui ai demandé de réaliser l'exercice suivant :

  1. Se connecter avec les éléments fournis,
  2. Publier un article en page d'accueil comprenant un titre, du texte, une image et des mots clés,
  3. Se déconnecter

La vidéo suivante, dont la vitesse a été accélérée 2 fois, relate comment Julianne a tenté de réaliser l'exercice. L'ajout d'un titre, comme celui d’un texte, se sont révélés aisés. En revanche, l'ajout de l'image et des mots clés ont été plus compliqués, mais elle a réussi.

En revanche, la sauvegarde de l'article a généré la plus grande confusion. L'article n'apparaît pas sur la page d'accueil, où est-il donc passé ? Après avoir cliqué à droite et à gauche et ayant même réussi à entrer dans le backend de Joomla, elle a ainsi remarqué que la catégorie n'avait pas été sélectionnée.

En tout, Julianne aura eu besoin de 8 minutes et 22 secondes pour publier l'article. Pas mal, même si cela devrait être possible en moins de temps.

La vidéo après les améliorations apportées quant à la facilité d'utilisation

La vitesse de la vidéo suivante a également été accélérée 2x. Le même exercice est répété, mais cette fois sur un Joomla 3 optimisé sur lequel j’ai apporté des améliorations quant à la facilité d'utilisation.

Cette fois Julianne n’a eu besoin que de 1 minute et 29 secondes. Bien sûr, ce n’était plus sa première découverte de Joomla, mais tout de même, grâce aux améliorations apportées, elle peut réaliser l'exercice beaucoup plus rapidement et facilement.

10 astuces afin d’améliorer la facilité d'utilisation de Joomla

En qualité d’utilisateur averti de Joomla, certaines choses peuvent nous sembler tout à fait logiques alors qu’elles seront incompréhensibles pour un utilisateur profane. Il est ainsi toujours utile de penser comme le ferait l’utilisateur final. Vous pouvez également regarder par-dessus l’épaule d’un novice tandis qu’il utilise le site. C’est d’ailleurs ce qui m'a inspiré cette étude de cas, mais également les améliorations suivantes.

1. Après la connexion, redirigez vers la page appropriée

Sander Potjer 2

Par défaut, après sa connexion à un site Joomla, un utilisateur sera redirigé vers sa page de profil. Cette page présente de nombreux paramètres utilisateur certes, mais soulève également de nombreuses interrogations.

Au lieu de cela, il est préférable de paramétrer une redirection d’URL plus pertinente dans les paramètres de l’élément de menu de connexion. Par exemple, rediriger directement vers la page destinée à la création d’un nouvel article, si c’est la raison principale de la connexion à ce site en particulier.

2. "Ne vous compliquez pas la vie" ou la théorie du KISS

(NDT : KISS, acronyme pour "Keep it Simple, Stupid", voir KISS sur Wikipedia)

Sander Potjer

Essayez de cacher ou désactiver tout ce qui n'est pas indispensable à votre site. Moins de choix un utilisateur aura à faire et plus tout semblera clair et utile. Assurez-vous également que ce qui reste visible ne prête pas à confusion.

Vous avez sur votre site un élément de menu "Connexion" ?
Assurez-vous alors qu’une fois connecté ce menu ne soit plus visible mais qu’à la place s’affichera bien un menu "Déconnexion".

Vous pouvez facilement réaliser cette opération en utilisant le niveau d’accès "Invité" de Joomla. S’il est paramétré pour un élément de menu, un article ou un module, il sera visible uniquement par les utilisateurs qui ne se sont pas connectés sur le site.

3. Faire soi les paramètres Joomla

Sander Potjer 4

La multitude de paramétrages offerts par Joomla peut apparaitre comme un inconvénient, mais vous pouvez également les utiliser pour améliorer la facilité d'utilisation pour l'utilisateur final.

Le paramétrage de la "Durée de Session" peut engendrer de nombreuses frustrations. Imaginez qu'un utilisateur travaille sur un article sur une durée particulièrement longue, qu’il sauvegarde son travail et reçoive en retour un message d’erreur "Merci de bien vouloir d’abord vous connecter" parce que le temps de session a expiré. Il suffira alors tout simplement d’augmenter cette durée à 60 minutes par exemple.

Un autre exemple est l'attribution d'une catégorie par défaut aux nouveaux articles soumis sur le site (en frontend). Est-ce qu’un utilisateur est uniquement autorisé à publier des articles dans la catégorie "Blog" ? Dans ce cas, définissez cette catégorie comme étant celle par défaut dans les paramètres de l’élément de menu. En faisant cela, vous éviterez que des articles publiés le soient dans des parties (non visibles) de votre site.

4. Réduisez le nombre des options de l’éditeur de texte

Sander Potjer 5

TinyMCE est l'éditeur de texte par défaut dans Joomla et propose de très nombreuses options afin de formater les articles, parfois trop. Afin de pallier ces désagréments, beaucoup utilisent un éditeur de texte disponible en extension tierce.

Mais savez-vous que l'éditeur natif TinyMCE propose déjà de nombreuses options pour ce cas ? TinyMCE est en fait un plug-in et si vous regardez ses paramètres dans le gestionnaire de plug-ins, vous pouvez les modifier pour régler le "Mode de l’éditeur" sur "Simple". Ainsi, uniquement certaines options de base pour le formatage de texte seront disponibles.

5. Faites des Groupes d'Utilisateurs et des Niveaux d’Accès quelque chose de compréhensible

Sander Potjer

Tous les sites Joomla proposent par défaut, après l'installation, différents groupes d'utilisateur et niveaux d'accès. Très souvent, la plupart d'entre eux peuvent d’ailleurs être sans risque supprimés.

Pour les groupes d'utilisateur et les niveaux d'accès que vous laisserez, il s’avère utile de modifier leur nom en quelque chose de plus compréhensible. "Administrateurs" est souvent plus compréhensible que "Super Users", ou encore "Blogeurs" plutôt que "Special". Cela est particulièrement utile lorsque les personnes qui travaillent sur le site ne sont pas des habitués de Joomla. Après tout, il est quand même beaucoup plus clair de préciser qu’un article est visible par les "Blogueurs" plutôt que par les "Special", non ?

6. Évitez les confusions, ne fournissez pas d'accès inutiles

Sander Potjer

Joomla bénéficie d’un système avancé de gestion des permissions (ACL - Access Control List) qui vous permet de configurer avec précision quelles actions chaque groupe d'utilisateurs peut exécuter. Dans Joomla et concernant les groupes d’utilisateurs par défaut, ces actions sont déjà définies, mais restent entièrement personnalisables.

Grâce à ce système ACL, vous pouvez autoriser une personne à accéder uniquement à un espace de travail déterminé afin d’exécuter des tâches spécifiques. D'une part, ceci empêche des modifications non désirées et d’autre part permet de ne pas inonder l’utilisateur avec des options sans rapport et qui portent à confusion.

7. Utilisez la substitution de langage pour plus de clarté

Sander Potjer 8

Une technique très simple, mais au combien efficace afin d'améliorer la facilité d'utilisation de Joomla est la substitution de Langage. Tous les textes présents dans le système, ainsi que les légendes, sont stockés dans des fichiers de langue. Via le gestionnaire de langues de Joomla, vous pouvez très facilement substituer ces textes par d’autres qui seront plus pertinents au regard des spécificités de votre site Web.

Le titre "Accéder" à un article n’est pas assez clair de votre point de vue ? Qu’à cela ne tienne, changez-le pour "Visible pour". Ou modifiez encore l’option du statut "Non publié" par "En cours" parfois plus facile à comprendre pour beaucoup de personnes qui souhaitent sauvegarder leur progression quant à un article. Vous pouvez même ajouter votre propre constante langue personnalisée si nécessaire.

8. Modifiez le rendu du site avec les substitutions de template

Sander Potjer 9

Les substitutions de template sont plus complexes que celles de langues, mais vont vous permettre de totalement personnaliser le rendu d’affichage de votre site Joomla, sans pour autant devoir modifier le code principal de Joomla. De cette façon vous pouvez supprimer des fonctionnalités inutiles ou au contraire les compléter.

Depuis Joomla 3, la création de substituions de template est beaucoup plus facile. Lorsque souhaitez personnaliser un template, un nouvel onglet "Créer des substitutions" est disponible dans le gestionnaire de templates. Dans cet écran, vous cliquez sur le fichier que vous voulez modifier et un fichier de substitution est automatiquement créé permettant de futures modifications.

9. Optimisez le rendu avec des CSS et JavaScript

joomla-usability-tip09

Avec une bonne dose de CSS et JavaScript, il est également tout à fait possible d’améliorer la facilité d'utilisation. Pratiquement l’ensemble des éléments de rendu Joomla dispose de leur propre classe. Ainsi, vous pouvez appliquer des effets de style à chacun de ces éléments.

Vous pouvez alors, dans le formulaire de saisie d’un nouvel article, utiliser les CSS afin d’afficher un champ de saisie de titre plus grand et d’y ajouter un emplacement réservé avec le JavaScript. Vous pouvez également cacher certains champs ou légendes avec ces CSS.

10. Divisez les champs de saisie des articles

Sander Potjer 10

Les personnes qui utilisent Joomla depuis un certain temps connaissent bien les problèmes liés aux images intégrées directement aux articles par l'utilisateur final. Auparavant, une image de 2000 pixels de large s'alignait de façon catastrophique générant un rendu du site assez horrible.

Heureusement, l'utilisateur peut désormais intégrer une image via un champ séparé. A condition que votre template supporte cette fonctionnalité, l'image s'affichera de façon cohérente et à une place déterminée. C'est ainsi beaucoup plus facile pour l'utilisateur et le site reste parfait.

"Ne me faites pas réfléchir"

Le point de départ de toute bonne astuce d'optimisation de la facilité d'utilisation se résume à : "ne me faites pas réfléchir" (NDT : "Don't make me think" est également un livre de référence écrit par Steve Krug) ; ce qui éloigne les utilisateurs du doute, de la recherche inutile et de devoir travailler avec des structures incohérentes les amenant à devoir faire des choix inutiles.

La substitution de template pour la vue de création d'un article

Dans le cadre de cette étude de cas, nous avons parlé d'une substitution de template d'exemple pour la vue de création ou de modification d'un article par un utilisateur final.
Toutes les astuces mentionnées dans cet article ont été compilées dans cette substitution de template.

Sander Potjer 11

Puis-je utiliser cette substitution ?

Bien sur !
Vous pouvez retrouver l'intégralité du code de cette substitution de template à l'adresse : https://gist.github.com/sanderpotjer/5488c2a10dceeee7db7d.

Créez une nouvelle substitution de template via le gestionnaire de template pour le com_content -> form ou encore, créez un nouveau fichier dans votre répertoire de substitution de template : templates/template-name/html/com_content/form/edit.php. Copiez-collez le code de substitution dans ce fichier et personnalisez-le comme vous le désirez.

Amusez-vous à améliorer la facilité d'utilisation de vos sites Web !

IMPORTANT :
Cet article est la traduction libre par Marc Antoine Thevenet de l'article original : Creating an Article in Joomla! Has Never Been This Easy!
par Sander Potjer
Read 16572 times
Tagged under French

Language Switcher

Current Articles