{"id":2327,"date":"2013-05-20T15:55:22","date_gmt":"2013-05-20T14:55:22","guid":{"rendered":"http:\/\/www.ralentirtravaux.com\/le_blog\/?p=2327"},"modified":"2013-05-20T20:45:43","modified_gmt":"2013-05-20T19:45:43","slug":"nouveau-ravalement-de-facade","status":"publish","type":"post","link":"https:\/\/www.ralentirtravaux.com\/le_blog\/nouveau-ravalement-de-facade\/","title":{"rendered":"Nouveau ravalement de fa\u00e7ade"},"content":{"rendered":"

L’an dernier – un an jour pour jour – Ralentir travaux avait d\u00e9j\u00e0 connu un l\u00e9ger lifting<\/a> : le code \u00e9tait devenu du HTML 5\/CSS 3, l’apparence du site avait \u00e9t\u00e9 revue, quelques ajouts avaient \u00e9t\u00e9 faits (comme la possibilit\u00e9 de commenter, par exemple).<\/p>\n

C\u2019est qu\u2019il s’agit de proc\u00e9der par petites retouches, au fur et \u00e0 mesure, sans grande r\u00e9volution. Il n’y a pas de grands chantiers quinquennaux, mais une \u00e9volution permanente, rendant, je l’esp\u00e8re, le site plus agr\u00e9able \u00e0 utiliser.<\/p>\n

Design extensible<\/strong><\/p>\n

L’an dernier, j’avais eu un seul regret, c’\u00e9tait de ne pas avoir r\u00e9alis\u00e9 un design extensible. C’est d\u00e9sormais chose faite. Il me semble que cela \u00e9vite d’avoir deux versions du site, qui serait l’une pour les ordinateurs, l’autre pour les appareils mobiles (tels que les tablettes ou les t\u00e9l\u00e9phones).
\nOr je d\u00e9teste cette double interface. Cela encore plus quand la version \u00abnormale\u00bb du site, surcharg\u00e9e d’informations et de pubs, correspond \u00e0 une version mobile an\u00e9mique. Surcharge d’un c\u00f4t\u00e9, uniformit\u00e9 vid\u00e9e de l’autre, il y a des designers qui me semblent d\u00e9m\u00e9riter.<\/p>\n

\"Exemple<\/a>
Exemple de page<\/figcaption><\/figure>\n

Lisibilit\u00e9 et interface \u00e9pur\u00e9e<\/strong><\/p>\n

J’ai donc privil\u00e9gi\u00e9 une interface unique, simple, \u00e9pur\u00e9e (j’ai d\u00e9j\u00e0 clam\u00e9 mon go\u00fbt pour Instapaper<\/a>). Hormis le header et le footer, le site est compos\u00e9 d’une page blanche et du texte. C’est un texte dont la police est pass\u00e9e \u00e0 1.1em (\u00e0 ce sujet, ce site<\/a> m\u2019a bien aid\u00e9 \u00e0 convertir les pixels en em ou en %).
\nSi, la premi\u00e8re fois que j’ai lu que les sites web devraient adopter de telles dimensions, j’ai \u00e9t\u00e9 quelque peu dubitatif, je n’ai, \u00e0 pr\u00e9sent, plus la moindre incertitude. On est tout d’abord \u00e9tonn\u00e9 ; on ne s’en passe plus par la suite. Il n’y a aucune raison de choisir une police trop petite, \u00e0 moins que l’on ne cherche \u00e0 faire comme beaucoup de monde, c’est-\u00e0-dire des sites peu lisibles. Mais peut-\u00eatre ne suis-je qu’un quarantenaire aux yeux fatigu\u00e9s…<\/p>\n

\"Exemple<\/a>
Exemple de page avec image<\/figcaption><\/figure>\n

J’en ai profit\u00e9 pour agrandir la taille des images dont la plupart me semblent d\u00e9sormais bien petites en regard de la police de caract\u00e8re. Je me suis efforc\u00e9 de l\u00e9gender chaque image. Par ailleurs, un cadre qui s\u2019ins\u00e8re dans le corps du texte permet d\u2019y glisser un texte ind\u00e9pendant apportant diverses informations. Enfin, je tenais \u00e0 ajouter une citation du texte dans le corps de l’article sans avoir \u00e0 r\u00e9p\u00e9ter le texte. Cet article<\/a> propose une solution assez \u00e9l\u00e9gante \u00e0 mettre en place gr\u00e2ce au HTML 5 (attribut data-pullquote).<\/p>\n

Cette page<\/a> ou celle-ci<\/a> peuvent donner un bon aper\u00e7u des transformations apport\u00e9es \u00e0 Ralentir travaux.<\/p>\n

Les lecteurs les plus perspicaces remarqueront que le design de Ralentir travaux a \u00e9t\u00e9 quelque peu influenc\u00e9 par les templates propos\u00e9s par Apple dans iBooks Author.<\/p>\n

Quoi d’autre ?<\/strong><\/p>\n

Un tas de choses. Le probl\u00e8me quand on modifie un truc, c’est qu’on bute sur mille et une choses \u00e0 adapter, modifier, transformer… Toujours est-il que j’en ai profit\u00e9 pour refaire le moteur de recherche (made in Google) qui buguait.
\nLa page d’accueil a \u00e9t\u00e9 refaite \u00e9galement : le menu en accord\u00e9on ne me plaisait que moyennement (il n’\u00e9tait pas toujours tr\u00e8s agr\u00e9able \u00e0 utiliser). Et un flux RSS en PHP affiche maintenant les articles les plus r\u00e9cents (merci \u00e0 l’auteur de cet article<\/a>).<\/p>\n

Je ne sais pas si vous l’aviez remarqu\u00e9e, mais une page consacr\u00e9e aux manuels<\/a> a \u00e9t\u00e9 ajout\u00e9e. Elle fait le point sur les parutions sur iPad. Elle fait la somme des articles publi\u00e9s sur ces manuels.<\/p>\n

\"Dons\"<\/a>
Dons<\/figcaption><\/figure>\n

Enfin, un bandeau (que vous pouvez faire dispara\u00eetre) invite le g\u00e9n\u00e9reux visiteur que vous \u00eates \u00e0 faire un don si vous souhaitez participer aux frais d’h\u00e9bergement, d’achat du nom de domaine, etc.<\/p>\n","protected":false},"excerpt":{"rendered":"

L’an dernier – un an jour pour jour – Ralentir travaux avait d\u00e9j\u00e0 connu un l\u00e9ger lifting : le code \u00e9tait devenu du HTML 5\/CSS 3, l’apparence du site avait \u00e9t\u00e9 revue, quelques ajouts avaient \u00e9t\u00e9 faits (comme la possibilit\u00e9 de commenter, par exemple). C\u2019est qu\u2019il s’agit de proc\u00e9der par petites retouches, au fur et […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[28,12],"tags":[],"class_list":["post-2327","post","type-post","status-publish","format-standard","hentry","category-education","category-informatique"],"_links":{"self":[{"href":"https:\/\/www.ralentirtravaux.com\/le_blog\/wp-json\/wp\/v2\/posts\/2327","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ralentirtravaux.com\/le_blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.ralentirtravaux.com\/le_blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.ralentirtravaux.com\/le_blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ralentirtravaux.com\/le_blog\/wp-json\/wp\/v2\/comments?post=2327"}],"version-history":[{"count":22,"href":"https:\/\/www.ralentirtravaux.com\/le_blog\/wp-json\/wp\/v2\/posts\/2327\/revisions"}],"predecessor-version":[{"id":2353,"href":"https:\/\/www.ralentirtravaux.com\/le_blog\/wp-json\/wp\/v2\/posts\/2327\/revisions\/2353"}],"wp:attachment":[{"href":"https:\/\/www.ralentirtravaux.com\/le_blog\/wp-json\/wp\/v2\/media?parent=2327"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.ralentirtravaux.com\/le_blog\/wp-json\/wp\/v2\/categories?post=2327"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.ralentirtravaux.com\/le_blog\/wp-json\/wp\/v2\/tags?post=2327"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}