Rendre compatible votre blog wordpress sur mobiles

By | septembre 15, 2008 at 15 09 08 | 17 comments | Plateformes, Plugins | Tags: , , ,

Note de l’équipe du Journal du Blog : Dans le cadre de notre concours d’articles, Zara vous propose de rendre compatible votre blog WordPress sur les mobiles.

La navigation web depuis un mobile se généralise, et de plus en plus de téléphones permettent de surfer sur Internet. J’aime pour ma part surfer sur mes blogs préférés durant mes voyages en transports en commun. Le problème, c’est que beaucoup d’entre eux ne proposent pas d’interface compatible mobile, ce qui entraine une mise en page complètement cassée sur mon BlackBerry, et un temps de chargement très long. Il est pourtant relativement simple de proposer à vos lecteurs une version mobile de votre WordPress.

Nous vous avions déjà présenté sur le Journal du Blog des plugins permettant d’optimiser votre blog WordPress pour l’IPhone. Mon propos sera plus large aujourd’hui, puisque je vous propose de voir comment rendre votre blog Wor dpress compatible avec tous les mobiles.

Pour ce faire, vous pouvez utiliser des plugins ou mettre en place une version mobile de votre blog manuellement. Dans les deux cas, le principe est le même : il s’agit de mettre en place un thème spécial mobile en parallèle du thème de votre blog, et de forcer les internautes provenant de mobiles à afficher le thème adapté.

Le plugin le plus célèbre pour rendre son blog compatible mobile pour vos lecteurs est le plugin WordPress Mobile Edition d’Alex king. L’installation est très simple, de nombreux navigateurs mobiles sont pris en charge, la mise en page est bien adaptée aux mobiles. Par défaut, la page d’accueil proposée liste les derniers articles du blog, et les pages. La page d’article contient tout l’article et les commentaires laissés par vos lecteurs, avec la possibilité de laisser un commentaire.

Par exemple, voici ce que donne mon blog sous Opera Mini (navigateur web pour mobile) après avoir activé l’extension WordPress Mobile Edition :

wp mobile edition Rendre compatible votre blog wordpress sur mobiles

Page d’accueil

wp mobile edition3 Rendre compatible votre blog wordpress sur mobiles

Page d’article

wp mobile edition4 Rendre compatible votre blog wordpress sur mobiles

Page d’article – commentaires

Le site ready.mobi qui teste l’affichage de sites sur mobile donne une note de 3/5 pour mon blog quand ce plugin est activé, contre une note de 1/5 lorsqu’aucun plugin n’est activé pour améliorer la compatibilité de mon blog avec les navigateurs mobile.

Ce plugin présente cependant quelques inconvénients. Il n’est compatible que jusqu’à WordPress 2.5 : il fonctionne tout de même correctement sur WordPress 2.6, à l’exception de messages d’erreur qui apparaissent dans l’administration et l’impossibilité d’accéder aux options du plugin. Par ailleurs, je trouve l’affichage un peu trop épurée et il manque une navigation dans les articles plus anciens.

En ce qui me concerne, je préfère largement le plugin WP Viewmobile. En effet, contrairement au plugin précédent, celui-ci est compatible jusqu’à WordPress 2.6, l’affichage est plus propre et plus complet, et surtout, mon blog obtient une meilleure note au test ready.mobi, c’est-à-dire 4/5.

Par défaut, la page d’accueil proposée liste les derniers articles du blog avec un extrait, propose une pagination pour accéder aux articles plus anciens, liste les pages, et propose une navigation par catégories et par archives. La page d’article contient tout l’article et les commentaires laissés par vos lecteurs – avec une alternance de couleurs qui permet une lecture plus aisée -, avec la possibilité de laisser un commentaire.

Voici un petit aperçu de ce que donne mon blog sous Opera Mini après avoir activée l’extension Viewmobile :

viewmobile Rendre compatible votre blog wordpress sur mobiles

Page d’accueil – haut

viewmobile2 Rendre compatible votre blog wordpress sur mobiles

Page d’accueil – bas

viewmobile3 Rendre compatible votre blog wordpress sur mobiles

Page d’article

viewmobile4 Rendre compatible votre blog wordpress sur mobiles

Page d’article – commentaires

Vous pouvez bien sur modifier les thèmes proposés par ces deux plugins, mais faites attention à ne pas faire de modifications allant à l’encontre de la compatibilité mobile ! Pour cela, aidez-vous des validateurs suivant pour vérifier la compatibilité mobile :

  • ready.mobi : celui-ci note l’affichage de votre blog en testant divers critères, et vous donnant des astuces pour améliorer les critères que votre blog ne passe pas
  • validateur mobile du W3C : celui-ci liste tous les problèmes que rencontre votre blog pour être considéré comme compatible mobile à 100%. Celui-ci est TRÈS strict et vous remontera des erreurs qui gènent pourtant très peu l’affichage sur mobile comme l’absence de contenu alt dans les balises images…

Vous pouvez également vérifier ce que cela donne sur les émulateurs de navigateurs mobiles que l’on peut trouver sur internet, comme celui d’Opera Mini.

Image de la page d’accueil: Shadowkris

Like it? Tweet it!

About the Author

17 Comments

  1. B1B1 (3 years ago)

    Très intéressante! Mais existe il un plugin pour obtenir une version »plus Iphone » comme par exemple sur http://iphone.bienbienbien.net/  ?

    Merci

  2. Julien (3 years ago)

    Article très intéressant et surtout pratique.
    Toutefois concernant le plugin Viewmobile, j’ai tenté de l’installer, et une fois mis dans la liste de mes plugins, impossible de l’installer. Je clique dessus et tombe sur une Page Error 500…

  3. Alias (3 years ago)

    un mobile ce n’est pas fait pour surfer, à la base c’est fait pour téléphoner pour ceux qui l’aurait oublié. et puis on ne va pas fait 36 versions de son site juste pour satisfaire quelques kéké qui sont tout fier d’exhiber leur iPhone qui n’est même pas capable d’affiche une résolution digne de ce nom.
    ne comptez pas sur moi pour la régression technologique.
    et vous faites quoi quand vous avez du flash, de l’ajax, du javascript sur votre site ?
    si je vois un iphoneur dans le métro, je lui donne un coup de boule, non mais !!!

  4. Aurelien (3 years ago)

    @B1B1 : le plugin dont parle Zara dans l’article peut être :

    @Julien ; tu as peut être un conflit avec un autre plugin, t’as essayé de l’installer en désactivant tout les autres, pour voir?

    @Alias : partant de ce principe, ma ligne téléphonique est là pour que je reçoive et passe des appels téléphonique : donc fini Internet. Cet article, en toute neutralité je précise, vu qu’il a été rédigé dans le cadre du concours, a l’avantage de ne pas parler que de l’iPhone, comme on voit bien souvent. A titre personnel, j’ai un smartphone, il m’arrive de surfer dessus, et c’est très pratique. Il faut savoir vivre avec son temps et avec les outils dont on dispose.

  5. Alias (3 years ago)

    il faut savoir vivre avec son temps ? en surfant dans une résolution en 640×480 ? oui oui, quelle modernité en effet !!!
    la ligne téléphonique sert à véhiculer de l’information : voix ET données. CQFD !

  6. Aurelien (3 years ago)

    @Alias : tout comme le portable ;) voix et données (sms, mms, et autres)
    La modernité, c’est par rapport à la mobilité que cela permet… mais bon discussion stérile je pense.

  7. Aujourd’hui et demain, j’écris ailleurs… | Ainsi bloggait Zarathoustra (3 years ago)

    [...] moi donc sur Le Journal du Blog pour apprendre à rendre votre blog WordPress compatible mobiles [...]

  8. Nico (3 years ago)

    Merci pour m’avoir fait découvrir le plugin WP Viewmobile. Il est bien plus « joli » que le premier cité.

  9. Les articles du Concours du Journal du Blog : Le Journal du Blog (3 years ago)

    [...] Rendre compatible votre blog Wordrpress sur mobiles [...]

  10. goji (3 years ago)

    très bon article pour assurer toujours plus d’accessibilité quelque soit le format (et pas que pour l’iphone …)
    des liens et des sources en veux tu en voilà
    et une mise en page agréable à lire, même pour les réfractaires (et oui alias tu as quand même lu l’article en toute mauvaise foi ;) )

  11. Hubert (3 years ago)

    cool, je vais regarder ça, merci Zara !

  12. worlock (3 years ago)

    moi j’ai un iPhone et j’en suis très content.
    J’adore les smartphones en général, le dernier
    BB storm est très sympa…. C’est drôle de voir
    Que souvent les iphoners n’ont rient contre les
    Smartphones mais que les smartphoners ont
    Parfois une « haine » contre le iPhone… Très bizarre.
    En tout cas le sujet des plugins m’intéressent.
    Pour apporter ma pierre à l’édifice, Apple propose
    Sur le site des applications iPhone une apps wordpress.
    On peut gérer son blog WP à partir du Iphone
    Et ça marche bien. C’est gratuit.
    @+

  13. bonesprit (3 years ago)

    très bon plugin…mais comment faire pour afficher et lire les videos postées dans les articles? est ce possible??

  14. Blog 21th Century | Esprit de mots, le blog de Thierry Benquey (2 years ago)

    [...] Rendre compatible votre blog WordPress sur mobiles [...]

  15. Mobi (1 year ago)

    Génial exactement le plugin qu’il me falllait bonne découverte , c’est super pratique c’est vrai que les mobiles deviennent de plus en plus envahissant :) dur quand on est surtout pc !

  16. Beverlee Carrico (1 year ago)

    I have been checking out some of your articles and it’s pretty good stuff. I will definitely bookmark your website.

  17. Shantell Belvins (10 months ago)

    I’d be inclined to concede with you here. Which is not something I usually do! I love reading a post that will make people think. Also, thanks for allowing me to speak my mind!

Comments

© 2011 WideZine. All rights reserved.