En complément, j'ai aussi ajouté une version de cette documentation pour Joomla 4. Retrouver l'API doc de Joomla 4.… https://t.co/Q6whFT8Zui
Optimisation Joomla pour la compatibilité mobile
Le 21 avril, Google sera sur le point de pénaliser les sites non-adaptés aux téléphones mobiles ! Votre site est déjà en Joomla 3 et vous utilisez un template Responsive ? Très bonne nouvelle, vous vous dites que vous êtes prêt !
Attention : avoir un template Responsive est effectivement un très bon point, mais d'autres paramètres entrent en considération :>
- vos extensions additionnelles supportent-elles correctement le Responsive Design ?
- vos extensions additionnelles respectent-elles correctement l'arborescence des dossiers Joomla ?
- votre fichier robots.txt permet-il un rendu correct pour mobile selon les normes de Google ?
Car le soucis est que Google va se fier aux informations du fichier robots.txt pour s'assurer que votre site est bien "compatible avec les mobiles".
Que faire si votre site Joomla 3, pourtant sensé être Responsive, n'est pas reconnu comme "compatible mobile" par Google ?
Sources des problèmes
Le problème d'une potentielle incompatibilité n'est pas tant dans le CMS Joomla, mais plutôt dans les templates et les extensions que vous utilisez qui ne sont peut-être pas en accord avec l'arborescence de dossiers de Joomla.
L'exemple de ce site garstud.com, basé sur un site Joomla 3 utilisant un composant et un template avancé montre les problèmes que vous pourriez rencontrer. En le testant sur le service de "Test de compatibilité Mobile" de Google ...
Test de compatibilité Mobile > >
On obtient le résultat suivant :
Le constat est sans appel, ce site Joomla 3 pourtant Responsive et dont le rendu est impeccable si on navigue via un Mobile, n'est pas validé par Google, pourquoi ?
Comprendre le problème
Le GoogleBot ne fait pas que charger votre site, il le fait en respectant les règles du fichier robots.txt.
Si ce fichier lui demande de ne pas accéder ("dissallow") à tel dossier, alors GoogleBot tentera de charger la page du site sans aller charger les fichiers présents dans les chemins interdits (généralement des CSS, JS, images) !
Le problème est que Joomla a volontairement bloqué l'indexation des sous dossiers du site (hormis /media/ et /images/ qui ont été retiré du fichier robots.txt depuis la version 3.4 pour optimiser le SEO) car ils n'ont aucun intérêt pour l'indexation du site ! ... Mais voila que Google change la donne pour valider la "Compatibilité Mobile". Du coup, le GoogleBot est incapable de charger certains fichiers (CSS, JS, images ... ) et le rendu de la page lui semble donc altéré. Il décide alors que le site n'est "pas compatible pour les mobiles".
Il faut donc régler le fichier robots.txt pour qu'il autorise les Bots d'indexation de contenus à accéder à tous les fichiers CSS, JS et images !
La solution pour votre site
Il faut procéder à l'analyse des remarques du Webmaster tools Mobile-friendly et ajouter des directives pour autoriser (Allow) les sous-dossiers et fichiers nécessaires sans pour autant supprimer les Disallow proposés par Joomla !
Règles génériques pour la majeure partie des composants Joomla
Une des solutions recommandées pour autoriser l’accès aux CSS et JS, souvent installés dans les dossiers /assets des composants consistera a ajouter les 2 lignes suivantes juste avant le "Disallow: /components/" :
Allow: /components/*/assets/css/*.css$ Allow: /components/*/assets/js/*.js$ Disallow: /components/
Le caractère "*" remplace n'importe quel mot. Les règles "Allow" vont permettre a GoogleBot de suivre et charger tous les fichiers "se finissant" (caractère "$") par .js ou .css.
Ces 2 règles sont valables pour tous les sites Joomla et devraient supprimer de nombreux blocages du GoogleBot !
Règles spécifiques à vos extensions
Comme vous pourrez le constater, mon fichier http://www.garstud.com/robots.txt contient d'autres règles "Allow" qui m'ont permis, une par une, de régler les problèmes signalés sur des extensions spécifiques (plugins, modules, templates, cache, components).
L'objectif étant d’être le plus précis afin de limiter les accès, par exemple pour autoriser mon template à fournir son propre cache de fichiers CSS, j'ai ajouté :
Allow: /cache/template/gzip.php?*.css$
le caractère "*" remplaçant toutes les caractères spécifiques afin de traiter les fichiers ci-dessous que le GoogleBot me signalait comme bloqués :
- /cache/template/gzip.php?widgetkit-3bbc4ba4-ba7662b1.css
- /cache/template/gzip.php?widgetkit-8dbc4b56-4a75d23c.css
- etc ...
Une fois ces règles ajoutées dans le robots.txt du site Joomla, un simple rechargement du moteur de test de compatibilité donne :
==> La page du site est désormais "Adaptée aux Mobiles" aux yeux du GoogleBot !
Note de Sécurité : Le fichier robots.txt n'est pas un réglage de sécurité, il sert uniquement a renseigner les robots d'indexation (googlebot, ...). Par contre il y a fort à parier que des Bots malveillants lisent aussi ce fichiers robots.txt, il est donc vivement recommandé de ne pas insérer d'informations trop explicites (comme le nom du dossier d'un composant (com_content), d'un module, d'un plugin. Si besoin, utilisez les "Wildcards" (caractère "*") pour masquer le nom d'un dossier comme dans l'exemple du robots.txt traité dans cet article.
Note sur l'ordre des directives : le GoogleBot impose de placer les Allow avant les Disallow. Ce n'est pas forcement le cas pour tout les bots (certains ne comprennent même pas les Allow" !) ! Si vous avez besoin d’être référencé correctement sur un autre bot, il faudra dupliquer les règles du robots.txt en précisant :
User-agent: googlebot ... les regles pour google avec le Allow avant les Disallow User-agent: bingbot ... autres regles spécifiques à ce bot
Les Bots les plus connus sont :
- User-Agent: bingbot
- User-Agent: Googlebot
- User-Agent: Googlebot-Mobile
- User-Agent: msnbot
- User-Agent: Mediapartners-Google
- User-Agent: AhrefsBot
- User-Agent: Baiduspider
- User-Agent: MJ12bot
- User-Agent: proximic
- User-Agent: ScoutJet
Les 4 premiers sont les plus actifs !
Controler votre fichier robots.txt
Vous avez un doute ou un problème de fonctionnement lors du test de votre site ?
Vous pouvez vérifier via votre compte "Webmaster Tools", la manière de se comporter du GoogleBot quand il lira votre robots.txt :
- dans votre "Webmaster Tools" : https://www.google.com/webmasters/tools
- dans le menu : Exploration > Outil de test du fichier robots.txt
- saisissez une url de votre site en bas et cliquez sur le bouton [Tester]
L'outil de Test vous signalera si il peut (règle surlignée en vert) ou pas (règle surlignée en rouge) y accéder :
Note pour les développeurs d'extensions
Depuis Joomla 3.4, deux directives bloquantes pour le GoogleBot ont été retirées du robots.txt de Joomla :
Disallow: /images/ Disallow: /media/
Ces 2 dossiers sont donc analysés par les GoogleBot et donc facilite la compatibilité mobile ! Pourtant les extensions Joomla ont encore le choix de ne pas utiliser ses 2 dossiers pour stocker leurs images, css js, ... ou bon leur semblent !
L'API de Joomla fournit pourtant aux développeurs de quoi respecter la structure des dossiers de stockages des médias.
La règle : si vous installez et utilisez des fichiers css, js ou images dans votre extension, vous ne devez pas les installer dans le même dossier que votre extension !
Pour respecter ce point, il vous faut utiliser la balise <media> dans votre Descripteur de déploiement (fichier XML) de votre extension pour que les médias de votre extension (CSS, JS, images) soient installés dans /media/com_moncompo1/... . Plus d'infos sur :
> https://docs.joomla.org/Manifest_files#Media_files
> https://docs.joomla.org/Development_Best_Practices
