Visite guidée

Publié le 29 mars 2010 et mis à jour le 6 mars 2013 -

Un blog est un véri­table logi­ciel ! Quand on en prend soin, on l’enrichit régu­liè­re­ment de nou­velles fonc­tion­na­li­tés. C’est mon cas et avec beau­coup de fait-maison. Appré­ciant la maî­trise de l’ensemble des com­po­santes de mon blog, je fais en sorte d’y inté­grer un maxi­mum de nou­veau­tés. Cela com­prend l’ajout de plug-ins mais aussi du déve­lop­pe­ment ou de la modi­fi­ca­tion de cer­tains d’entre eux. Ayant un passé de déve­lop­peur, je ne peux m’empêcher de m’impliquer dans cette par­tie de la créa­tion du blog. L’architecture du blog est d’ailleurs lar­ge­ment docu­men­tée dans une autre page.

Le design du blog “Opi­nions Libres” a régu­liè­re­ment évolué depuis sa créa­tion au prin­temps 2006. L’actuel date dans son look de mars 2010 après l’abandon des cou­leurs chaudes qui ont tenu quatre ans. Il uti­lise un style bleu/gris plus clas­sique et d’actualité. Ce design assez dépouillé a plu­sieurs sources d’inspiration : les codes cou­leur du site d’Apple, la sim­pli­cité de l’interface uti­li­sa­teur de Win­dows Phone 7, et l’interactivité du moteur de recherche de Google.

Mais der­rière ce design assez dépouillé et stable se cachent de nom­breuses fonc­tion­na­li­tés qui évoluent régu­liè­re­ment et que voici donc :

• Blog de lar­geur variable

Le contenu s’adapte à la lar­geur de votre navi­ga­teur et il s’affiche cor­rec­te­ment sur les écrans de toute réso­lu­tion et en par­ti­cu­lier sur les net­books dotés d’écrans de 1024x600 pixels. Depuis avril 2010, le blog est passé de trois à deux colonnes, ren­dant la lec­ture plus agréable. La page d’accueil pré­sente les posts les plus récents avec leur pre­mière illus­tra­tion et quelques lignes de texte (sans hyperliens).

• Page d’accueil en “infi­nite scroll”

J’ai intro­duit cette nou­veauté qui s’inspire du fonc­tion­ne­ment de Google Image et de Pin­te­rest : affi­cher indé­fi­ni­ment la liste des posts pré­sen­tés dans la page d’accueil du blog au fur et à mesure de la navi­ga­tion (scroll) dans votre brow­ser. Cela per­met de remon­ter dans le temps dans les archives sans pas­ser par le module d’archives, qui vaut aussi le détour comme vous le consta­te­rez plus loin.

• Export PDF et impres­sion des articles

Les articles peuvent être expor­tés au for­mat PDF et bien mis en page, y com­pris avec les illus­tra­tions. J’ai du sup­pri­mer ces der­nières quelque temps en 2011 car la mémoire de mon héber­geur 1&1 ne per­met­tait pas leur exé­cu­tion. En février 2012, un chan­ge­ment de for­mule d’hébergement m’a per­mis d’augmenter cette mémoire (sans chan­ge­ment de tarif…) et j’ai pu réin­té­grer les images dans les PDF générés.

Les articles peuvent aussi être affi­chés dans un for­mat “prin­ter friendly” avec l’icone adap­tée, à droite de l’icone PDF. Un bou­ton dans l’écran généré per­met de déclen­cher immé­dia­te­ment l’impression. Vous pou­vez alors béné­fi­cier des fonc­tions de pré­vi­sua­li­sa­tion d’impression de votre navigateur.

• De nom­breux conte­nus téléchargeables

Ce blog vous pro­pose de nom­breux conte­nus télé­char­geables et en Crea­tive Com­mons. Les Rap­ports de Visite du Consu­mer Elec­tro­nics Show publiés en jan­vier chaque année depuis 2006, le Guide des Star­tups High-Tech en France régu­liè­re­ment mis à jour aussi depuis 2006 et bien d’autres encore. Je publie égale­ment un cer­tain nombre de sup­ports de pré­sen­ta­tion ou de cours. Les conte­nus com­prennent aussi une petite  revue de presse.

• Recherche dyna­mique

La recherche de texte dans les articles à par­tir de la barre de menus donne un résul­tat qui s’affiche dyna­mi­que­ment dans une colonne bleue dans la colonne de droite du blog. Les 12 pre­miers résul­tats sont affi­chés. Un lien est fourni pour lis­ter la tota­lité des résul­tats, notam­ment au cas où il y en aurait plus que 12, et à concur­rence de 60. Pour les anciennes ver­sions d’Internet Explo­rer (avant la 5.5), le bou­ton recher­cher avec la loupe fonc­tionne comme d’habitude et lance une page avec le début des articles cor­res­pon­dant au résul­tat de la recherche.

• Archives mul­ti­cri­tères

Les archives de ce blog sont faci­le­ment consul­tables avec la fonc­tion “Articles” du menu “Archives”, avec un clas­se­ment par année et par mois des articles et une indi­ca­tion pour cha­cun d’entre eux du nombre de com­men­taires et de pages vues. C’est une des ori­gi­na­li­tés “open data” de ce blog. Différents modes de consul­ta­tion sont pro­po­sés avec un tri par popu­la­rité (par nombre de pages vues), par nombre de com­men­taires ainsi que par lon­gueur des posts et par taille d’article (indi­qué en nombre de signes et de mots). Vous pou­vez même iden­ti­fier les articles sans commentaires !

Enfin, les archives peuvent être for­ma­tées avec la liste des articles, la liste avec les pre­mières lignes, les articles au com­plet pour lire l’intégrale d’une année de ce blog et enfin, juste les images des articles sélec­tion­nés si la photo vous intéresse.

• Com­men­taires imbriqués

Les com­men­taires des articles sont pré­sen­tés de manière imbri­quée, per­met­tant de bien suivre les conver­sa­tions. Pen­sez à uti­li­ser la fonc­tion “Répondre” en des­sous de chaque com­men­taire. Les com­men­taires de l’auteur sont mis en évidence par une cou­leur de fond dif­fé­rente du reste des commentaires.

Et petit plus au pas­sage, lorsque vous répon­dez à un com­men­taire, la réponse s’effectue juste des­sous ce com­men­taire. Comme cela, vous n’êtes plus per­dus et vous savez à qui vous répon­dez et dans quel contexte.

J’ai aussi ajouté un méca­nisme d’importation dans les com­men­taires des Tweets reliés aux articles. Il fonc­tionne avec modé­ra­tion côté admi­nis­tra­teur et je ne retiens que les Tweets “à valeur” ajou­tée qui com­mentent les articles, pas les ret­weets (RT) simples. Un com­men­taire pro­ve­nant de Twee­ter est pré­senté dans un cadre bleu et l’indication Twee­ter per­met d’ouvrir la page Twee­ter de la per­sonne concer­née. Les Tweets de l’auteur de l’article sont en gris comme pour les commentaires.

Enfin, vous pou­vez vous abon­ner aux com­men­taires d’un article en cli­quant un simple bou­ton après avoir sou­mis votre propre commentaire.

• Pré­vi­sua­li­sa­tion des commentaires

Vos com­men­taires mis en page sont visua­li­sés dyna­mi­que­ment en des­sous de la zone de capt­cha et au fur et à mesure de leur sai­sie, ce qui est par­ti­cu­liè­re­ment pra­tique si vous y inté­grez des balises HTML (réfé­rences avec <a> ou mise en forme avec <strong>).

• Navi­ga­tion dans les commentaires

Dans les der­niers com­men­taires affi­chés dans la colonne droite du blog comme dans les com­men­taires à la suite des articles, il est pos­sible de navi­guer sans perdre le contexte des conversations.

Ainsi, pour les der­niers com­men­taires, l’icone à gauche per­met de répondre direc­te­ment au com­men­taire, le lien sur le pseudo per­met d’afficher tous les com­men­taires sai­sis sous ce pseudo depuis la créa­tion du blog et le lien sur l’article per­met d’afficher le com­men­taire dans son contexte.

Enfin, en février 2012, après l’intégration des com­men­taires pro­ve­nant de Twit­ter, j’ai indi­qué la pro­ve­nance de ces com­men­taires avec “dans Twit­ter” sachant que le mot Twit­ter contient un lien sur la page web du compte Twit­ter de la per­sonne ayant fait ce commentaire.

• Contri­bu­teurs de commentaires

Cette page acces­sible à par­tir du menu “Archives” et la fonc­tion “Com­men­taires” liste les contri­bu­teurs par ordre décrois­sant du nombre de com­men­taires dans ce blog. En cli­quant sur leur nom, le texte inté­gral de leur com­men­taire s’affiche en des­sous de la liste. Comme par­tout ailleurs dans le site, vous pou­vez répondre à ce com­men­taire en cliquant

De plus, vous pou­vez cli­quer sur chaque nom de contri­bu­teur autant dans les articles que dans la liste des der­niers com­men­taires à droite du blog pour accé­der aux autres com­men­taires de ce contri­bu­teur. Si le contri­bu­teur a généré plus de 4 com­men­taires, son nom est alors mis en évidence dans la liste des contri­bu­teurs qui s’affiche au des­sus des commentaires.

Les com­men­taires étant ouverts sans ins­crip­tion ou iden­ti­fi­ca­tion unique, plu­sieurs contri­bu­teurs dif­fé­rents peuvent se cacher der­rière le même pseudo ou pré­nom. Dans ce cas, il est pré­cisé le nombre d’emails dif­fé­rents cor­res­pon­dants à ce pseudo, sans les révé­ler pour autant pour pré­ser­ver la confi­den­tia­lité. Oui, il fau­drait que je les trie par email sans affi­cher l’email. Plus tard… !

• Abon­ne­ment email

Vous pou­vez vous abon­ner à l’envoi d’emails vous aver­tis­sant de la publi­ca­tion d’un nou­vel article. Vous rece­vrez alors un email vous aver­tis­sant de leur publi­ca­tion avec un lien sur l’article. L’email ne contient pas les articles en entier.

• Réseaux sociaux

Ils sont tous sous la main dans le menu du site : ma page Face­book, mon pro­fil Lin­ke­dIn, mon compte Twit­ter, mes albums pho­tos sur Dar­q­room, quelques vidéos sur You­Tube et pour ter­mi­ner le flux RSS du site à inté­grer dans votre agré­ga­teur d’information pré­féré. Vous en trou­ve­rez un inven­taire que j’ai pu réa­li­ser il y a quelques temps sur ce post. Vous avez notam­ment le choix entre agré­ga­teurs fonc­tion­nant en mode web comme Google Rea­der, ou bien des solu­tions fonc­tion­nant en mode “client riche” comme Fee­drea­der, que j’utilise depuis quatre ans.

Les articles com­prennent un bou­ton Tweet et Like de Face­book depuis décembre 2010, un bou­ton Lin­ke­dIn et un bou­ton Google+ depuis juillet 2011. Ce der­nier est désac­tivé si vous navi­guez sur ce site à par­tir d’un smart­phone ou d’une tablette, Google ne le sup­por­tant pas dans le web mobile.

A noter de plus que depuis mars 2013, le blog sup­porte les Twit­ter Cards qui per­mettent d’afficher une image et un petit des­crip­tif tex­tuel des articles dans les flux Twit­ter lorsque un article est cité.

• Flux RSS

La liste des caté­go­ries per­met de s’abonner aux flux RSS pour cha­cune d’entre elles, manière de suivre sélec­ti­ve­ment le contenu de ce blog en fonc­tion de vos centres d’intérêt.

Au pas­sage, une caté­go­rie est réser­vée aux articles écrits en anglais. Mais ceux-ci sont rares au vu du lec­to­rat fran­co­phone du blog.

• Alertes Twit­ter et Facebook

En sui­vant @olivez ou sur mon pro­fil Facebook.

Le flux de mes Tweets ainsi que des Tweets citant @olivez est par ailleurs dans un wid­get Twit­ter inté­gré dans la colonne droite du blog.

• Ver­sion mobile du blog

Ce blog est dis­po­nible en ver­sion web mobile, opé­ra­tion­nelle sur les smart­phones du mar­ché dis­po­sant d’un navi­ga­teur Inter­net. Cela concerne notam­ment l’iPhone, Google Android, Win­dows Mobile, les Black­berry ainsi que les smart­phones Nokia comme le N97.

Les fonc­tions sup­por­tées sont l’affichage des titres des der­niers posts, l’affichage des posts, et l’ajout de com­men­taires en ligne avec sup­port du capt­cha. En bas de la page de cette ver­sion mobile se trouve un bou­ton per­met­tant de désac­ti­ver cette vue et de bas­cu­ler vers la vue nor­male du site.

Voilà pour la visite ! Enjoy !

Vous pou­vez bien entendu me faire d’autres pro­po­si­tions per­met­tant d’améliorer le confort d’usage et de lec­ture de ce blog. Je ferai tout mon pos­sible pour les satisfaire !

Publié le 29 mars 2010 et mis à jour le 6 mars 2013 Page de Olivier Ezratty | 23622 lectures