Améliorer la lisibilité de votre blog : utilisez des résumés !

Cet article est le premier à être affiché en mode « résumé » sur BLOmiG. Ce billet décrit les arguments qui militent pour l’affichage sur la « home » des billets résumés (rythme graphique, et analyse des stats facilitée), et la manière de mettre en oeuvre tout cela (utilisation du « more » dans les billets, utilisation d’une classe spéciale dans style.css pour personnaliser le résumé, et installation du plugin Full Text Feed pour conserver un flux RSS complet). Simple à mettre en oeuvre, et efficace pour améliorer la lisibilité de votre blog !

Arguments pour les extraits sur la home

Suite aux discussions sur ce billet, j’ai finalement décidé d’adopter l’affichage d’extraits sur la page d’acceuil de BLOmiG.

Deux arguments clefs donnés en fin de discussion par br1o m’ont fait me décider dans ce sens :

  • L’apparence graphique de la home page est plus rythmée avec seulement des extraits, plutôt qu’avec des billets entiers de longueurs nécessairement inégales (cela implique de présenter des extraits qui soient conçus exprès pour cet usage (de type chapeau d’article présentant les grandes lignes, ou paragraphe court fait pour accrocher le lecteur)
  • Si les articles sont lus sur leur page spécifique, et non plus sur la home, cela permet d’analyser de manière bien plus fine les statistiques de visites de chaque billet. La page de lecture est désormais unique !

Mise en oeuvre

Voyons maintenant comment on réalise cela. Quelques points sont très importants dans la mise en oeuvre si l’on passe en mode d’affichage « uniquement les extraits sur la home » :

  • Il faut décider soi-même où l’article sera coupé. Pas question de simplement utiliser la fonction « excerpt », qui peut coupe l’article au beau milieu d’une phrase. Pour cela il faut donc utiliser la fonction « more » (insérer (sans les espaces) dans le texte là où on veut que la coupure se fasse
  • Il faut s’assurer que nos flux continueront de contenir les articles en entier (rien de plus énervant qu’un article coupé dans les flux RSS : c’est une perte de temps qui finit par lasser). Pour cela, Fran6 nous a amené la solution : il s’agit du plugin Full Text Feed 1.03 qui suprrime de vos flux RSS le « more »
  • Pour que les extraits/résumés soient utiles, il faut qu’ils soient rédigés exprès pour cet usage : à ce titre, il faut donc définir une classe spéciale dans la feuille de style css (j’ai crée il y a peu une classe « chapeau » qui me sert à faire un court résumé au début des articles, que je vais réutiliser). Cette classe permettra d’afficher le résumé accrocheur sur la page de garde dans un style un peu différent du corps de texte.
  • Ne pas oublier, bien sûr, de personnaliser l’affichage relatif au « more »: cela se passe dans le fichier “/wp-includes/post-template.php » index.php, où le texte du « more » apparait derrière un appel php à « the_content »…

Voilà, c’est tout ! après cela, votre home page affiche des résumés brefs et accrocheurs de vos billets, et les pages spécifiques à chaque billet affichent les billets complets ! Propre, net et efficace !

Remerciements

Pour terminer, je voudrais remercier tous ceux qui ont participé à la discussion (dans le désordre) : merci, donc, à br1o, Fran6, Thierry, Frenchmat, Oli, Matthieu M., Winsa et Fred.


Publié

dans

par

Commentaires

38 réponses à “Améliorer la lisibilité de votre blog : utilisez des résumés !”

  1. Avatar de Oli
    Oli

    Merci Lomig pour cette synthèse. Pour ma part, je n’ai pas encore tranché mais j’y réfléchi, quoi qu’en ce moment ma tête est ailleurs. Dernière chose, j’ai pas pigé la classe « chapeau » (création, utilisation )

  2. Avatar de BLOmiG
    BLOmiG

    salut Oli,de rien c’est normal de synthétiser un peu les fruits de cette discussion. ca a permis d’avancer beaucoup plus vite que tout seul ! vive la collaboration…!La classe chapeau c’est simplement une classe que tu définis dans ta feuille de style, et qui te permet de déclarer un paragraphe comme étant un « chapeau » (ou tout autre nom que tu souhaites lui donner), avec son style propre.C’est le paragraphe gris qui est au début du billet ici.pour utiliser cette classe il suffit de taper ton paragraphe de textedans ton éditeur en mode CODEà  bientà´t !

  3. Avatar de Oli
    Oli

    Merci pour les précisions, c’est plus clair. Y’a plus qu’a mettre les mains dans la « bouillace » ;-)

  4. Avatar de Frenchmat
    Frenchmat

    Oh, moi je n’ai pas fait grand-chose ! Mais merci ;)Personnellement je pense que je ne le ferais pas, car ça ne me semble pas correspondre à  mon blog, tu ne crois pas ?Et puis, c’est du boulot d’écrire en plus des billets, de bons résumés bien accrocheurs.Par contre, chez toi le résultat est sympa, c’est clair. Mais du coup, ne vaudrait-il pas mieux mettre la liste des billets similaires seulement pour la page du post ?Ca risquerait à  mon avis de couper ce « rythme » dont tu parles et ça me parait plus utile à  la fin du billet.Voilà , beau boulot ! ;)

  5. Avatar de BLOmiG
    BLOmiG

    salut Frenchmat,si si tu as participé…je suis d’accord avec toi : ce n’est pas très adapté à  ton blog.et oui, j’ai vu une fois que j’avais le résultat sous les yeux que je devais modifier un peu la mise en page pour que la « home » s’affiche bien…(supprimer les articles en relations, enlever un des deux liens vers les commentaires…peut-être même le bandeau de fin d’article avec l’abonnement RSS…)affaire à  suivre..Lomig

  6. Avatar de Nicolargo
    Nicolargo

    Comme je suis abonné RSS, je lis tes posts par RSS et j’apprecie vraiment qu’ils restent entiers. Pour les visites directes sur le blog, je pense comme Frenchmat, que ce n’est pas généralisable à  tous les blogs.En tout cas ce n’est pas mal du tout sur le tient.

  7. Avatar de Fran6
    Fran6

    En tout cas, je suis en train de faire des essais en local, c’est nettement plus beau et plus sympa de n’avoir que quelques lignes. Même le excerpt et sympa d’une point de vue visuel. Par contre, faut penser à  un truc, ne pas mettre de photo sur les premières lignes !! ;-)

  8. Avatar de br1o
    br1o

    Merci à  toi lomig ! ces échanges m’ont permis de connaître plusieurs plugin dont j’ignorais l’existence :)

  9. Avatar de Matthieu M.
    Matthieu M.

    Je pense que tu as pris la bonne décision, car la longueur habituelle de tes articles ne permettait pas d’avoir en un seul coup d’oeil (ou plutà´t de molette) une vue d’ensemble de ton contenu, maintenant ce sera le cas !En revanche, de mon cà´té, je désespère de trouver une solution à  mon problème de flux tronqués. Ce qui semble marcher avec vous ne marche pas avec moi.J’ai upgradé wordpress vers la version 2.2.1, j’ai installé le plugin Full Feed Text, j’ai paramétré les options wordpress et feedburner pour afficher le texte en entier… Et malgré ça, mon flux reste désespéremment tronqué.Et en plus de ça, j’ai installé hier un plugin censé afficher les articles connexes, dans le flux, et bien je ne suis presque pas étonné, mais ca n’affiche rien. Décidemment, mon flux est maudit. :(

  10. Avatar de BLOmiG
    BLOmiG

    salut NicoLargo,merci pour ton commentaire…oui moi aussi je préfère avoir les flux complets dans mon aggrégateur…! Tant mieux si ça passe bien ici, les évolutions sont de toute façon possibles !à  bientà´t ! :)

  11. Avatar de BLOmiG
    BLOmiG

    salut Fran6,oui je trouve aussi que la page d’acceuil est plus sympa comme ça…je verrais quand j’aurais plusieurs articles en format « résumé »…à  bientà´t !

  12. Avatar de BLOmiG
    BLOmiG

    salut br1o,non non : grand merci à  TOI. Si tu n’étais pas venu amener ta pierre à  la discussion, j’abandonnais l’idée…alors que l’aspect esthétique était au début une de mes motivations…merci encore !

  13. Avatar de BLOmiG
    BLOmiG

    salut,merci pour ton soutien : oui c’est vrai que mes articles sont en général un peu long, et ça sera plus aéré comme cela.Sinon, je lisais depuis longtemps ton blog par mail : je vais m’inscrire par RSS pour voir l’allure chez moi (google Reader). Désolé que ton fil RSS foire, je ne sais vraiment pas d’o๠ça pourrait venir…à  bientà´t !

  14. Avatar de thibault
    thibault

    C’est vrai que les articles entiers en page d’accueil, ça fait un peu lourd. Dans mon cas par exemple, je n’écris que de longs articles, et la mise en page n’est même plus navigable. J’ai également adopté la solution du résumé, que je trouve la meilleure.

  15. Avatar de BLOmiG
    BLOmiG

    salut Thibault,merci pour ton commentaire… concerné effectivement !je suis allé voir ton blog, et c’est vrai que tes articles nécessitent aussi ce traitement. Bravo, au passage pour ton blog très intéressant (je me suis inscrit)…!à  bientà´t j’espère !

  16. Avatar de aiglestates
    aiglestates

    Qu’il soit long ou court je vais les lire

  17. Avatar de BLOmiG
    BLOmiG

    salut aiglestates,merci pour ton gentil commentaire ! :)à  bient

  18. Avatar de Fran6
    Fran6

    Juste une chose que je souhaiterais rajouter à  tout ça: C’est très bien de mettre un « raccourci » en homepage, mais pensez aussi et surtout à  un titre pertinent. Je suis en train de parcourir plusieurs blogs qui utilisent cette technique et comme les titres ne sont pas intéressants, je zappe…malheureusement, alors que le contenu est peut-être intéressant… On parlait l’autrea jour avec Lomig des 75% qui restent moins de 10 secondes. Chez moi, ils sont de 53%. Je ne sais pas si c’est peu ou beaucoup. Déjà , peut-être que de venir sur une homepage avec des articles longs, ça décourage le visiteur. Je dis bien « peut-être ». L’avenir et les résultats de ce changement des structure nous le diront. Mais si le visiteur vient, qu’on est en flux tronqués et que les titres sont pas accrocheurs, le gars se barre aussi… Quelque part, je crois que ce sont ces 10 premières secondes qui sont importantes, non ? Ensuite, on peut expliquer comment garder les visiteurs sur le blog plus longtemps. Mais faut trouver un truc pour accrocher dès le début. Et je suis convaincu que le titre doit être fort, et je deviens de plus en plus persuadé que les articles longs découragent aussi les visiteurs la première fois qu’ils viennent. Trop de chose à  lire d’un seul coup… Faut donc être très fort dans le visuel, dans le premier « regard »… non ??Je veux juste en profiter aussi pour faire une petite remarque personnelle. Vous trouvez pas bizarre qu’on soit plusieurs et souvent les mêmes à  se retrouver autour de ces mêmes discussions ? Et bien, je tenais juste à  vous dire que c’est vraiment super sympa d’avoir ce genre de discussions avec vous, pas assez abordées par les blogueurs FR à  mon goà»t, merci pour ce partage !! ;-) Et toujours un grand merci à  toi Lomig pour ton blog. Je pense que je vais écrire un petit billet sur mon blog pour vanter le mérite de cette discussion, et histoire de prolonger le débat !!Bon week-end à  tous !!

  19. Avatar de Fran6
    Fran6

    Petite question subsidiaire pour Thibault: Comment tu as fait pour sortir le nombre d’abonnés de Feedburner sans utiliser le widget ?? Merci !! ;-)

  20. Avatar de thibault
    thibault

    Fran6 > Finalement, les blogs, c’est comme pour les gens. C’est la première impression qui compte.Pour FeedBurner, il faut activer l’API awarness dans la config de son compte, et utiliser un plugin approprié disponible ici :http://www.insanum.com/?software

  21. Avatar de BLOmiG
    BLOmiG

    salut Fran6,merci beaucoup pour ce commentaire qui m’a fait chaud au coeur…je rejoins complètement ta réflexion concernant la nécessité d’accrocher vite avec un titre qui claque, accrocheur ! c’est le but, je crois, de la mise en place des résumés…on verra le résultat !Je te rejoins encore plus sur la nécessité d’avoir des discussions autour des outils, du design , des fonctionnalités : c’est indispensable pour un bloggeur à  mon avis. toutes ces discussions sont passionnantes ; merci à  toi et à  tous de venir y participer.Et merci, au passage, à  toi Fran6, pour ton blog et l’énorme travail que tu fournis : tu apportes une vraie valeur ajoutée pour tout bloggeur FR…à  bientà´t ! vive les discussions ! :)

  22. Avatar de Fran6
    Fran6

    Merci Thibault pour ces renseignements !! a+

  23. Avatar de thibault
    thibault

    Ben de rien ; C’est un plaisir de rendre service.Au passage, je viens de remarquer la fonction « répondre à  ce commentaire ». C’est super intéressant ! BlOmig, tu utilise un plugin, pour faire ça ?

  24. Avatar de BLOmiG
    BLOmiG

    salut, Oui il s’agit du plugin « Brian’s threaded comments ». à  bientà´t ! :)

  25. Avatar de thibault
    thibault

    BlOmig -> LOmiG, avec toutes mes excuses :(

  26. Avatar de BLOmiG
    BLOmiG

    aucun souci…! BLOmiG c’est le nom du blog, et LOmiG c’est prénom ; c’est le nom du blog lui-même qui incite à  confondre les deux. Tu es tout excusé :)

  27. Avatar de thibault
    thibault

    ok, merci beaucoup pour l’info.

  28. Avatar de DyBlog
    DyBlog

    Des liens pour les blogs et les sites 3 : design, publicité, référencement, outils……Voici le 3ème billet de la série des billets bourrés de liens pour les blogs et les sites dans plein de domaines, après ceux du 3 Mai et du 31 Mai……

  29. Avatar de Mimifred
    Mimifred

    Bonjour,super billet, merci, ça donne bien des idées !En parcourant ton site j’ai trouvé très bien fait le cà´té « Lire la suite>> » qui s’ouvre sur la même page et que l’on peux refermer plutà´t qu’un bête lien.Comment fait on ça !? (secret de fabrication ?)Merci.

  30. Avatar de BLOmiG
    BLOmiG

    salut Mimifred,non il ne s’agit pas d’un secret de fabrication. Il s’agit d’un plugin pour wordpress qui s’appelle « Ajaxified Expand Post NOW ».à  bientà´t !

  31. Avatar de prenom
    prenom

    Bonjour, sur ce poin : « rythme graphique, et analyse des stats facilitee » ; je ne vous suis pas tout à  fait :) billet intéressaznt en tout cas ! toujours un plaisir e vous lire @+

  32. Avatar de BLOmiG
    BLOmiG

    salut Prenom,rythme graphique, c’était pour parler de la page de garde du blog qui est plus rythmée, ça enchaine plus vite TITRE – Résumé – TItre etc…sans que l’on tombe sur un gros bloc de texte.Analyse des stats facilitée : c’est parce que du coup, les lecteurs ne peuvent pas lire l’article complet sur la page de garde. En cliquant sur « lire la suite », ils se retrouvent sur la page de l’article en question, et les utilitaires de stats (comme google analytics) ne peuvent détecter que les passages sur telle ou telle page. Du coup, tu as les vraies stats pour chaque article (puisqu’il n’est lisible que sur sa propre page)j’espère avoir répondu à  tes questions !à  bientà´t !

  33. Avatar de Sylvain
    Sylvain

    Je suis d’accord avec toi sur le fait qu’il est intéressant de proposer des résumés sur la home. cela permet aux nouveaux lecteurs d’appréhender plus facilement l’univers du blog. C’est d’ailleurs ce que j’ai mis en place sur mon blog. C’est en cherchant les solutions techniques que j’ai découvert tes différents articles. J’ai suivi les 4 étapes, j’ai installé le plugin en version 1.03, ça ne marchait pas, le flux était tronqué. Maintenant, j’ai installé la version 1.04 ça ne marche toujours pas. Pourrais tu m’aider ? je suis sur WordPress 2.3.2Merci d’avance pour ta réponse

  34. Avatar de Sylvain
    Sylvain

    Euh ! c’est encore moi. Je voudrais préciser une chose.J’ai mis le mais je n’ai pas fais les modifs « excerpt ». c’est peut-être là  l’origine de mon problème ? Mais là  je suis limité par mes compétences techniques, je ne maitrise pas l’utilisation de cette fonction

  35. Avatar de BLOmiG
    BLOmiG

    salut Sylvain,je viens d’aller sur ton blog…il me semble que tout fonctionne normalement, non ? Moi je n’ai jamais touché aux « excerpt »…je vais aller voir ton flux, ça m’étonne qu’il soit tronqué avec le plugin…à  très bientà´t !

  36. Avatar de BLOmiG
    BLOmiG

    après avoir testé dans Google Reader : ton flux RSS n’est pas tronqué ! tout fonctionne :)tu as du résoudre le problème avant que je ne découvre ton commentaire…merci pour ton passage ici, et n’hésites pas si tu as des questions !

  37. Avatar de Olaf
    Olaf

    Hello tout le monde !Super idée de synthétiser ! Je suis pour un web et des blogs plus propres, lisibles, et non plus avec plein d’informations qui partent dans tous les sens dès la page d’accueil ! Mais par contre, pour s’y retrouver dans les commentaires, c’est pas encore ça, qu’en pensez-vous ? Connaissez-vous Commentag ? Il propose un plugin pour WordPress qui permet d’aller à  l’essentiel lorsque vous lisez les commentaires, par une navigation par nuage de tags sur la discussion. A télécharger librement sur http://www.commentag.com !

  38. Avatar de BLOmiG
    BLOmiG

    Salut Olaf:) ok/… on va aller tester ça. ça peut servir sur les billets o๠il y a beaucoup de commentaires…peut-être sur mon blog politique ?à  bientà´t !

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.