Abandon du design moche
Vous avez été nombreux à vous plaindre de la laideur du précédent design du site. Mais d’autres projets ne m’ont pas permis de me consacrer pleinement à la refonte du site, d’autant qu’Une araignée au plafond a beau être un site semi-professionnel, je ne l’utilise pas pour attirer de nouveaux clients dans mes filets. Ceci dit, une chose est de ne pas pêcher, une autre est de faire fuir les poissons. Bref, même si l’essentiel des lecteurs du présent site suivent les actualité via les flux RSS, un nouvel habillage s’imposait. C’est donc chose faite ! Je vous propose de faire le point sur les objectifs de cette nouvelle mise en page.
Aperçu du nouveau web design
La nouvelle mise en page est composée essentiellement de trois écrans principaux. Tous ont été développés dans un souci de lisibilité, d’ergonomie et d’efficacité.
Une page d’accueil en damier
Ambiance générale
Le site ne cherche pas à agresser le visiteur, mais lui apporter une atmosphère calme propice à la concentration et à la réflexion. Il faut dire que bon nombre de mes articles sont assez longs pour en rebuter plus d’un, aussi, le calme des tons bleus paraît indispensable pour permettre au lecteur d’aller jusqu’au bout. Le fond externe noir permet de bien capter l’attention du lecteur sur le contenu du site, sur fond blanc.
Par ailleurs, l’entête du site est discret. L’image retenue est celle d’une vision « globale » du monde, celui d’Internet (certes, c’est très prétentieux de ma part). La position du champ de recherche — qui permet d’omettre de longs menus de catégorisation plus ou moins maladroits — disposé sur la planète suggère bien sa fonction, tout comme les lignes vaguement horizontales qui suggèrent des liens.
Je ne peux prétendre à une quelconque notoriété avec le titre de ce blog, par conséquent, il n’y a aucune raison que je mette ce titre en avant. Inutile donc de placarder un entête gigantesque qui ne saurait que gêner la lisibilité du contenu du site. Si le contenu présenté convainc le lecteur, il saura s’en souvenir, le titre Une araignée au plafond est suffisamment facile à mémoriser pour être retenu sans difficulté, le jeu de mots avec le web (la toile) n’est pas assez subtil pour être manqué.
Page d’accueil
Trop souvent, les blogs mettent en avant l’actualité la plus récente, de sorte que le lecteur se contente du dernier article mis en ligne. Or, Une araignée au plafond n’est pas connu pour suivre l’actualité, mais plutôt pour partager une expérience du web qui se veut relativement intemporelle.
La mise en page s’inspire librement de celle du moteur de recherche Cuil, ou encore de la tendance du look magazine qui semble apparaître sur certains sites plus ou moins tendance. Cette disposition en damier de trois cases sur trois permet de mettre l’accent sur le contenu textuel du site sans pour autant rebuter le lecteur de passage. Il faudrait cependant à l’avenir que je veille à avoir une introduction de taille fixe, avec que cet aperçu paraisse plus homogène.
Toujours est-il que l’objectif de la page d’accueil est d’inviter le visiteur à poursuivre sa lecture sur l’un des articles ainsi mis en avant.
Une mise en page des articles condensée
Pages d’articles
La mise en page des articles se veut minimale, mais suffisante, d’un point de vue du contenu présenté et de la navigation.
Lorsqu’un nouveau visiteur arrive, il vient lire un article précis sur un sujet donné. Il ne vient pas pour lire les derniers commentaires postés ou d’autres articles sans rapport avec le texte courant. Par conséquent, on trouve le contenu qui intéresse le lecteur à l’emplacement le plus important pour les Occidentaux : à gauche en haut. Le titre est mis en évidence par une fonte prédominante sans être trop grande. L’introduction qui résume généralement l’article permet d’annoncer la couleur. Le visiteur sait d’avance ce qui l’attend et s’il poursuit sa lecture ou non.
Souvent, la marge d’un site web permet aux webmasters d’y inclure moult informations totalement inutiles pour le lecteur attiré par un article en particulier. Parmi ces informations peu pertinentes on trouvera les derniers commentaires du site, ou encore les derniers articles publiés. Ce sont des informations qui intéressent les habitués, mais non les nouveaux lecteurs. Or, pour convaincre les nouveaux lecteurs de devenir abonnés, encore faut-il répondre à leurs attentes. De plus, une fois abonnés aux flux RSS, les habitués ne viennent plus sur le site, en particulier sur un site à vocation technologique et Internet.
Par conséquent, la marge du site est dédiée à l’article principal, permettant par exemple au lecteur de promouvoir l’article sur l’un de ses réseaux sociaux favoris, s’il le trouve pertinent. Suit ensuite le classement de l’article, que ce soit la date ou sa catégorie. Les tags sont totalement cachés ici, car s’ils permettent d’améliorer le classement des articles pour une recherche ciblée, je ne peux prétendre être une source encyclopédique où les lecteurs éplucheraient des tonnes d’informations. Une simple catégorie suffit alors. Les tags servent donc juste aux outils automatiques pour suggérer des articles connexes qui apparaissent plus loin. Avant ces derniers, la présentation de l’auteur permet d’améliorer le contexte de l’article. J’ai plus de poids dans mes domaines de compétence plutôt que dans ceux où je suis néophyte. Enfin, si le lecteur a apprécié ce qu’il a lu, il peut s’abonner aux flux RSS. Bon nombre de lecteurs mettent en avant les liens d’abonnement, alors qu’en toute logique, l’abonnement devrait plutôt suivre un premier article à l’essai.
Page récapitulative des résultats de recherche
Pages récapitulatives
Les autres pages du site sont des pages récapitulatives, comme la page récapitulative des articles d’une catégorie, ou encore la page présentant les résultats de recherche.
Actuellement, le classement est celui par défaut de WordPress et commun aux blogs : la page la plus récente est placée en entête des résultats. A l’avenir, cependant, j’essaierai de classer les articles par pertinence, car c’est bel et bien ce qui intéresse le lecteur, la date n’ayant aucune influence sur la pertinence de l’article sur ce blog qui ne suit pas l’actualité.
Qu’en disent les lecteurs ?
Mais le meilleur des web designs ne peut exister sans la critique de ses utilisateurs. Aussi, quelle que soit mon introduction ou ma justification à la mise en page actuelle, celui qui juge de sa pertinence, c’est toi, cher lecteur. Aussi, cher juge, je te propose de donner ton avis sur cette nouvelle mise en page dans un commentaire ! Qu’apprécies-tu ? Que détestes-tu ? Pourquoi ? A toi de travailler, maintenant !
J’étais passé hier sur le site sans trouver de formulaire de commentaire! Voici donc le problème réglé et ce design me plait. Mais à vrai dire : ça m’est égal. Pourquoi ? Parce qu’étant abonné au flux rss, je lis les articles (souvent en entier) directement dans GReader. Je viens sur le site uniquement pour commenter (comme ici).
En tout cas, la mise en page de la page d’accueil me plait aussi. Sans doute parce qu’elle me rappelle celle de mes archives : http://bbxdesign.com/cat/xthml-css/ :)
Je préférais la couleur de l’ancien, le bleu ici fait légèrement old school :)
Etonnante home page…
Impossible de me souvenir si il y avait un tags cloud dans la précedente version mais je trouve que, là, ça manque.
En effet, tu évoques souvent des sujets qui m’interesse mais qui ne correspondent pas à ce que je fais dans l’instant et lorsque je cherche à retrouver un article je me souviens du thème et là je cherche le tags cloud ….
Le fond noir tranche trop avec le fond du texte en blanc.
J’opterais pour une couleur moins contrastée (gris clair peut être?).
D’autre part l’interligne de la rubrique « à propos de l’auteur » est trop grand, cela rend la lecture difficile.
@jthomas : Il est possible que les formulaires de commentaires étaient désactivés hier soir, je faisais quelques modifications sur le site.
@Julien Pellegrain : L’avantage du bleu ou d’une couleur dite « froide » en général est qu’elle se prête mieux à un espace de réflexion, là où des couleurs vives se prêtent mieux à un espace d’action. Mais je suis peut-être un peu old school moi-même ? À l’avenir, j’essaierai de rédiger des introductions plus homogènes, de sorte que la page de garde sera mieux garnie, limitant les « trous » qui y apparaissent actuellement lorsque des introductions d’articles de longueur très différentes se cotoient.
@Fabrice : Il y a bien eu un nuage de tags précédemment, mais son utilité me paraissait limitée. Note que tu as un champ de recherche mieux mis en avant et il devrait te permettre à l’avenir de mieux trouver les articles recherchés que les seuls tags. D’ailleurs, tu me fais penser que je ferais bien de coller un widget Ajax à base de Yahoo! BOSS sur ce champ de recherche afin d’en améliorer la pertinence ! Du coup, avec une recherche de meilleure qualité, tu ne devrais plus avoir de problème pour trouver le sujet que tu cherches !
@Renoh : Je vais essayer de trouver des tons moins contrastés qui mettent bien l’accent sur le principal, à savoir le contenu. Je vais aussi réduire l’interligne, car tu as raison, elle est excessive, d’autant que le gris clair utilisé est assez discret. Oh, il faudrait que je teste l’affichage sur un PC dont le gamma par défaut est différent de celui d’un Mac…
Bah dis donc les grands esprits se rencontrent, je viens aussi (vendredi en fait) de modifier mon template mais pas pour un changement aussi radical que le tien :D
Par contre je vais être le relou de service: je préférais les anciennes couleurs, le bleu a beau être une couleur froide et appréciée par tous, il manque une couleur chaude et rassurante à mon avis. Non?
Bref, toujours un plaisir de te lire Martin^^
Bonsoir,
Je suis ravi de ce changement de design qui me rappelle beaucoup celui du lecteur de fils RSS du navigateur norvégien Opera quand il pré-visualise les fils (Avant l’abonnement).
À l’instar de jthomas, je ne viens que rarement sur ce site lisant les articles depuis le fil RSS grâce à mon navigateur de norvège, toutefois j’ai un commentaire à faire sur… Les commentaires :
Ils sont relativement peu lisibles, gris sur blanc ça me fait un peu mal aux yeux, j’aimerais une couleur plus… sombre :) .
Bonne continuation en tout cas à ce blog particulièrement intéressant.
Un peu trop dépouillé à mon goût… Trop de blanc, et surtout le le gris clair des commentaires est illisible…
Nouveau design très positif. Et je trouve ton analyse très instructive. Mais une question: considères-tu que dans l’idéal ce serait à toi, le webmaster, de faire le design, ou est-ce plus par défaut que tu le fais?
@Antoine : Le temps doit être au changement ! Je vais essayer de rendre le bleu un peu plus gai, notamment en reprenant le bleu turquoise du bas de page qui fait penser aux vacances dans les pays chauds.
@Arnaud Lefort : Opera est aussi mon navigateur par défaut et je regrette sincèrement que l’essentiel des sites web l’ignorent — au mieux — ou l’empêchent de fonctionner, car c’est l’un des navigateurs les plus respectueux des standards tout en étant des plus performants.
Pour ce qui est des commentaires, je viens de les distinguer autrement que par un ton gris : désormais, texte principal et commentaires, tout comme les textes dans la marge, sont affichés avec un niveau de contraste plus marqué, afin de faciliter la lecture. Pour ce qui est des commentaires des lecteurs, ceux-ci sont mis en évidence par une pseudo-boîte bleue-turquoise. Je pense que Marc-OH va lui aussi être plus satisfait de cette mise en page qui devient plus fournie, pour le coup.
@Roman Age : Je fais du web design parce que je souhaite obtenir un résultat unique, d’une part, et correspondant à mes attentes, d’autre part. Je suis adepte des sites moches, à savoir que je considère que l’aspect visuel n’a pas ou peu d’importance sur les objectifs commerciaux, marketing ou encore en ergonomie. Par conséquent, j’ai conscience de faire du moche et je n’en suis pas gêné. En revanche, ce qui me gêne, c’est une ergonomie inadaptée, qu’il s’agisse de la disposition des éléments ou des fonctionnalités présentées. D’ailleurs, en matière de fonctionnalités, je préfère les limiter pour mieux les maîtriser plutôt que de les multiplier sans aucun avantage réel.
Par conséquent, je fais du web design parce que j’ai la prétention de croire que je le fais mieux, compte tenu de mes propres critères d’évaluation, que d’autres. Par ailleurs, cela me permet aussi de me faire plaisir en apprenant de nouvelles choses, en particulier sur mes erreurs que je comprends beaucoup mieux lorsque je les commets moi-même.
Oh, merci beaucoup pour le nouveau design des commentaires, c’est vraiment mieux !
Je trouve aussi que Opera n’est pas assez considéré, même si étant utilisateur d’Opera depuis 2005 je trouve qu’il y a de forts progrès de la part des Webmestres.
Ah bah voilà ! C’est beaucoup plus lisible là !
Quand je suis revenu sur UneAraigneeAuPlafond.fr hier, j’ai été (agréablement) surpris par la nouvelle page d’accueil: tout bonnement géniale. Je me suis aussi demandé depuis quand elle avait changé, j’ai ma réponse ici, avec une explication de texte en prime, merci Martin ;-)