Comme tous les mois, je vous propose ma sélection de sites. Je rappelle la règle du jeu : ces sites sont sélectionnés de façon aléatoire et empirique (dès que j’en vois un beau, je le mets de côté et j’en parle le mois suivant).

Commençons avec celui qui fait polémique en ce moment, le nouveau site de la compagnie aérienne Jetblue.

J’étais un peu sceptique en découvrant la nouvelle page d’accueil pour la première fois, mais après la première impression, je troue qu’ils ont fait un très bon travail de design minimaliste avec des choix graphiques très cohérents (formes homogènes, nombre de couleurs réduites…). J’apprécie tout particulièrement les textes très courts, la très bonne lisibilité de la typo, la grille de lecture bien marquée, les boutons qui se détachent bien du fond des cartouches et bénéficient d’une bonne hiérarchisation. Je reste mitigé sur la couleur de fond des champs de la boite TrueBlue, mais j’imagine que c’est pour atténuer l’envie de saisir une recherche ou un N° de vol dedans…

Continuons avec un autre site de commerce en ligne, l’indien Tiket qui vend un peu de tout :

Là encore j’adore l’approche minimaliste et la grille de lecture parfaitement marquée. Les couleurs et les traitements graphiques sont d’une sobriété à toute épreuve, mais cette page d’accueil est d’une efficacité redoutable. Vous noterez néanmoins qu’ils se sont « lâchés » sur des fioritures comme une double bordure pour le moteur de recherche ou un bout de scotch pour le carrousel à droite (truc de ouf !). Et puisque l’on parle du web indien, allez donc faire un tour sur Junglee, une autre boutique à l’efficacité marchande redoutable (cf. L’approche Mobile First adoptée par Amazon en Inde).

Terminons avec Wittlebee, une boutique de fringues d’enfant vendus en packs :

Le minimalisme est toujours de rigueur pour les textes et accroches, par contre nous avons droit à des traitements graphiques un peu plus sophistiqués avec un fond de page à alvéoles, des bordures crénelées ou des photos façon polaroïd. J’apprécie tout particulièrement les intitulés très courts des boutons d’action (« Start« , « Read« , « Like« ) ainsi que les effets au survol de la souris.

La suite le mois prochain.

C’est avec un peu de retard que je vous livre ma sélection de sites beaux et originaux.

Commençons avec le très sombre Blissfully Aware, le bloc-note en ligne d’un indépendant :

Le site est sobre, TRÈS sobre, mais la grille de lecture et la lisibilité de cette page sont exemplaires. Précisions que le noir est une couleur particulièrement complexe à exploiter, et dans le cas présent, ça fonctionne très bien. D’autant plus avec l’utilisation d’un très beau motif en fond de page et d’une typo originale. Vous apprécierez également la position centrale du logo, de même que la très large zone de réserve. Donc un très bel exemple de sobriété et de minimalisme.

Pour compenser cette sobriété, je vous propose de découvrir le très alléchant site de la Chessecake Factory, une chaîne de restaurants US :

Rien de très original dans la mise en page de ce site, par contre un très beau travail sur les textures, le choix des typos et les ornementations (frise colorée, boutons…). J’apprécie également beaucoup les très belles photos en pleine largeur qui donne carrément l’eau à la bouche. Ça fait presque 15 ans que je travaille dans le monde du web, et je n’ai pas honte de dire que je peux encore être émerveillé par le site d’un « simple » restaurant. Tout est affaire de goût (sans mauvais jeux de mots).

Terminons avec Onepager, un service de création de sites web :

Un beau site bien simple et parfaitement lisible comme je les aime. J’adore l’effort particulier pour réduire au minimum le nombre de phrases affichées sur cette page d’accueil : c’est minimaliste, percutant et très simple à comprendre. J’apprécie grandement le gros bouton « Get Started » dont la couleur résonne avec celle du fond de page. Je suis également conquis par la partie basse de la page et ces unités d’information verticale parfaitement découpée. Bref, c’est sobre, carré et parfaitement efficace, du pur bonheur !

La suite le mois prochain.

Noël approche, mais je ne change rien à mes habitudes (quoi que pas tout à fait). Voici donc ma sélection de sites mensuelle.

Commençons avec H.J. Mews, une boutique d’accessoires pour chats :

J’ai tout de suite été séduit par les couleurs en rupture avec celles qui sont habituellement utilisées sur le web. J’apprécie également les petits raffinements graphiques omniprésents sur cette page comme les bordures des photos ou du panier dans le header, le logo qui déborde sur le bandeau supérieur ou le séparateur de pied de page. Vous noterez également l’utilisation d’une police spéciale pour faire ressortir l’accroche en haut de page ainsi que certains titres. J’adore enfin le soin apporté aux descriptions courtes des produits : elles sont riches, variées et bien formulées. Bref, une boutique qui sort de l’ordinaire pour des produits pas ordinaires.

Poursuivons avec Sweet Hat Club, le club des porteurs de chapeaux :

Une page à la grille de lecture parfaitement marquée avec des unités d’information bien découpées. Certes, ça fait beaucoup de boites,mais comment se lasser de ces cadres façon Polaroïd ? J’aime également la position centrale du logo (une figure de style largement sous-estimée), le contraste intéressant entre le fond de page et les têtières, le rendu sépia des photos ainsi que l’utilisation d’une police de caractère spéciale. Vous noterez que la construction même de la page oeuvre fortement pour concentrer l’attention sur le logo en position centrale avec les deux flèches qui l’encadrent et le choix d’une mise en page à deux colonnes qui coupent la page en deux et fait immanquablement remonter l’oeil vers le logo. Au final, nous avons un site sans prétention, mais qui fonctionne parfaitement bien.

Terminons avec Rice Bowl, une organisation caritative :

Une page à très fort contraste pour faire ressortir le carrousel central, mais qui véhicule également une ambiance rassurante (jaune + brun = stabilité, confort, sécurité). La texture du bandeau qui porte le logo tranche avec le traitement très sobre du reste de la page, les illustrations sont également très simples, mais parfaitement lisibles. Bon par contre, je reste sceptique quand à la prolifération des styles de typo : gras/maigre, majuscules/minuscules, droit/italique… tout ça est un peu trop chaotique à mon goût et mériterait une harmonisation. Ceci étant dit, le résultat final n’en reste pas moins très réussi et véhicule parfaitement le message.

Puisque c’est bientôt Noël, je vous propose exceptionnellement une quatrième sélection qui me laisse perplexe. Il s’agit de la toute nouvelle page d’accueil du magazine Inc., réputé pour la sobriété de son site web et qui a encore accentué le trait.

J’ai toujours été un grand fan des mises en page allégées et du minimalisme, mais là… je trouve qu’ils y sont allés un peu fort. Certes, ce site propose une lisibilité maximale avec une très grande cohérence dans les traitements graphiques, mais quand même… toute cette sobriété ne nuit-elle pas au site ? Avouez que vous aussi vous avez envie de vous pendre, non ? Le site du NYTimes propose également une charte ultra sobre, mais avec un minimum de couleurs, alors que là… Bref, n’hésitez pas à me donner votre avis.

Ce mois-ci, le commerce en ligne est à l’honneur avec non pas une mais deux boutiques découvertes sur le Rhooo de Patrice Cassard (qui vient d’ailleurs de lancer son nouveau projet : Neeed.com).

Commençons avec Tinkering Monkey, une boutique en ligne d’objets en bois :

La page d’accueil de cette boutique propose une mise ne page très sobre, très aérée avec un excellent travail sur les couleurs (fond de page, titres, liens…) pour donner cette sublime sensation de chaleur et de bien-être. Notez également au passage le choix des typos ainsi que la sophistication du panier en haut à droite.

Poursuivons avec Cometshop, une boutique française (oui môsieur) :

Là encore, nous avons une mise en page minimaliste avec un maximum d’espace blanc pour faire ressortir les produits. J’apprécie particulièrement le soin apporté au panier et au bandeau de navigation. Le logo est également très intéressant avec son fort contraste et la sophistication de sa typo.

Terminons avec The Verge, un site de test de gadgets :

Autant la page d’accueil n’a que très peu d’intérêt, autant je suis littéralement stupéfait par la sophistication apportée à la mise en page des articles (ex : Kindle Fire Review ou Galaxy Nexus Review). C’est bien simple, je n’ai pas souvenir d’avoir croisé un site à gros volume de contenu avec une mise en page aussi agréable : parfaite lisibilité des paragraphes, belle combinaison de typos pour les titres et inter-titres, très bonne intégration des photos, beaucoup d’ingéniosité dans l’utilisation du menu latéral statique ou de la barre de haut de page. Bref, je suis réellement impressionné par le travail de maquettage réalisé, un modèle du genre (et les pages de comparaison ne sont pas en reste : Smartphone Comparison).

La suite le mois prochain…

-

Comme chaque mois, je vous propose une sélection de trois sites qui m’ont tapé dans l’oeil. Ce mois-ci, la sélection est à majorité germanique, mais je ne saurais vous expliquer pourquoi…

Commençons avec Flaek, une marque de chaussure allemande :

Beaucoup de sobriété sur cette page d’accueil qui privilégie avant tout la mise en avant des produits grâce à une photographie en pleine largeur. Sur cette photo en particulier il y a un petit problème de lisibilité, car le texte ne ressort pas forcément bien sur un fond noir, mais dans les pages intérieures c’est beaucoup mieux. Je vous engage d’ailleurs à cliquer sur les liens à droite de l’écran pour parcourir les différentes pages : la transition se fait avec un scrolling vertical du plus bel effet. Et tant que vous y êtes, faites donc un passage par leur blog.

Restons en Allemagne avec Amonda, une boutique de chapeaux et couvre-chefs en tous genres :

Là encore, la sobriété est de mise (euphémisme), mais vous noterez néanmoins des effets stylistiques discrets, mais de très bons goûts comme le relief de la barre de navigation ou son ombre portée. La grille de lecture est d’une parfaite rigueur, chaque élément bien aligné sur celui du dessus (à l’Allemande). La page est blanche, très blanche, mais les fonds de couleur du carrousel et des trois produits mis en valeur apportent juste ce qu’il faut de chaleur. Les produits, photos et logos en bas de page sont en prime très bien détourés. Bref, c’est propre et carré, tout ce que j’aime, jawohl !

Terminons avec Quarterly, un service assez déroutant. Le principe est de vous proposer une liste de personnalités (des gens travaillant dans la mode ou le design), à laquelle vous vous abonnez pour recevoir de leur part un objet tous les trimestres. Oui je sais, le principe est un peu déroutant, mais l’expérience doit être intéressante, à mi-chemin entre Think Geek et une AMAP.

Cette page d’accueil impressionne avant tout par la très bonne combinaison de couleurs (beige, marron clair et bleu), de même que le logo positionné au centre. Le service n’est pas évident à comprendre, mais le large bandeau apporte des explications claires et visuelles (vous pouvez le refermer en cliquant sur « Oh, I got it« . Les mini-portraits affichés directement sous les explications sont également porteurs d’une image sobre et sophistiquée, comme en témoignent la photo et le choix typographique. Vous apprécierez également la construction en trois colonnes que l’on devine avec l’alignement du lien « Contributors« , du second séparateur et de l’extrait du blog. Le fond de page à motif participe également à réchauffer le tout et donne un côté artisanal (ça ne vous rappele rien ?).

La suite le mois prochain.

Comme tous les mois, je vous propose une sélection de sites qui m’ont tapé dans l’oeil. Je ne serais pas vous expliquer pourquoi, mais la sélection de ce moi-ci a été draconienne tellement il y avait de candidats.

Commençons avec Square, le fameux service de paiement par smartphone :

Un bel exemple de site minimaliste puisqu’il n’a qu’une seule page, ou plutôt un seul gabarit avec des contenus adaptés en fonction des cibles. La mise en page est très simple, mais terriblement efficace : une illustration à droite, la promesse, le formulaire et les éléments de réassurance à gauche. La hiérarchisation de l’information au sein du cadre est particulièrement soignée avec des titres et accroches qui ressortent bien, une densité de l’information facilitant la lecture et la concentration de l’attention. Bref, c’est tout bon.

Poursuivons avec Teechan+lax, une agence web US :

Le découpage en 3 blocs permet de bien cloisonner les unités d’information (navigation, promesse et publications) et le choix des couleurs facilite le repérage et la lisibilité. J’apprécie particulièrement la vidéo floutée et sont effet hypnotisant qui permet d’attirer le regard sur la promesse. Même si la vidéo est en fait une boucle d’à peine 10 secondes, j’ai vraiment cru qu’ils avaient branché une webcam dans les bureaux !

Terminons avec Pancake, un service en ligne de gestion commerciale et facturation :

Là encore, le découpage en trois zones permet de dissocier la navigation, la promesse et explications, et le détail des fonctionnalités. Vous noterez au passage l’association judicieuse du visuel et des typos pour attirer l’attention sur la promesse au centre de l’écran (les espaces vides autour participent également) de même que la mise en scène du bouton d’action et du prix. Rien de très révolutionnaire dans cette page, mais une belle exécution et une grande cohérence dans les traitements graphiques.

Comme j’avais beaucoup de « candidats », je vous donne également les autres URLs que j’avais mises de côté et que je laisse à votre libre appréciation : Seamless, Fork CMS, 89Bytes et Skinnyo.

La suite le mois prochain…

C’est bientôt les vacances, donc je vous propose ce mois-ci une petite sélection estivale de sites qui m’ont tapé dans l’oeil.

Commençons avec Cinemur, un agrégateur d’avis et de bandes-annonces de films à aller voir pendant vos vacances :

Particulièrement dépouillée, la page d’accueil propose un mur d’affiches de films avec une barre de filtres en haut de page. En fait ce n’est pas réellement un site web, mais plutôt une application sociale (vous pouvez connecter votre compte Facebook pour remonter les avis de vos amis). En tout cas la réalisation est soignée et l’idée plutôt originale (mettre en avant les oeuvres).

Poursuivons avec Punchfork, un agrégateur de recettes de cuisine à tester pendant vos vacances :

Là encore, l’essentielle de la page d’accueil est consacrée aux photos des plats. La couleur de fond d’écran donne une ambiance chaleureuse à cette page, de même que les petits pictos et les intitulés très courts (navigation et filtres). Étant fan de minimalisme, je ne peux qu’applaudir le travail réalisé sur cette page qui se concentre sur l’essentiel.

Terminons enfin avec Yogi, une marque de thé à l’inspiration indienne (une destination sur laquelle je fantasme depuis des années) :

Ce site contraste fortement avec les deux précédents, car il mise avant tout sur le raffinement graphique avec un fond de page façon parchemin, des fioritures dans tous les sens, une police de caractère exotique, des boutons et cadres aux formes atypiques… Bref, ça sent bon le dépaysement et les aromates. J’apprécie particulièrement les illustrations qui débordent des cadres en bas de page ainsi que les animations à l’ouverture de la page. Un site qui aurait mérité un traitement HTML5 et CSS3 pour alléger le code-source et se passer de l’utilisation de Flash.

La suite à la rentrée…

Pour ma sélection mensuelle de beaux sites web, je vous propose cette fois trois candidats très différents les uns des autres.

Commençons avec Launchlist Pro, une application en ligne :

La densité d’information de cette page d’accueil est plutôt élevée, mais la lisibilité reste bonne grâce à un bon contraste. L’illustration centrale donne un très bon résumé du service et les choix de couleur (contrastant fortement avec le reste de la page) permettent d’attirer l’attention de façon efficace, de même que pour l’essai gratuit en bas de page. J’apprécie également l’effet métallisé des pictos et du fond de page. Au final : une page avec une forte personnalité qui compense quelques problèmes (caractères trop petits, titres en majuscules…).

Poursuivons avec Saville’s Dovecotes, un fabriquant de colombiers et abris à oiseaux (oui monsieur, c’est un métier !) :

Que dire si ce n’est que j’adore ces sites minimalistes exploitant une gamme de couleurs très neutre. Les illustrations centrales sont de très bonne qualité (un fond transparent sous le texte aurait amélioré la lisibilité), les photos des produits parfaitement mis en valeur grâce à la bordure façon Polaroid. L’espace blanc du haut de page permet de bien faire ressortir la marque ainsi que le panier. Le reste du site est dans la même veine avec ce côté épuré et très sérieux. Ça me donnerait presque envie d’en acheter un (mais l’idée de voir des pigeons s’y installer parasite ma prise d décision…).

Terminons avec The Casette, une boutique française de chaussures estivales :

Une boutique en ligne très originale avec cette vidéo pixelisée en fond de page qui donne du style sans ponctionner trop de bande passante.  Les quatre cartouches de produits ressortent parfaitement bien, même si les boutons d’action sont un peu trop timides (d’ailleurs ça ne devrait pas être des boutons, mais des liens). Les éléments de réassurance sont très bien mis en scène grâce à la police de caractère. Au final il se dégage une très bonne énergie et beaucoup de convivialité de ce site, une réussite !

La suite le mois prochain…

Ce mois de mai 2011 aura été une succession de belles journées ensoleillées, je vous propose donc une sélection de sites qui sentent bon l’été.

Il y a tout d’abord Wee Nudge, un projet original de deux web designeurs qui ont compilé une série de sources pour pouvoir argumenter plus facilement leurs choix de conception :

J’adore la simplicité de cette mise en page avec beaucoup d’aération sur la partie haute et les côtés de la page. L’impression de vide que peuvent engendrer des espaces dégagés comme ceux-ci est néanmoins atténuée par le motif du fond de page. J’apprécie également l’utilisation astucieuse du rouge pour mettre en valeur le titre ainsi que les liens et les boutons. Un site sans prétention, mais qui fonctionne parfaitement.

Continuons avec le site de Sacred June, un groupe folk US :

Encore une belle page nettoyée de tout le contenu inutile et une très belle illustration en (quasi) pleine page. Vous apprécierez la belle harmonie des couleurs dans les tons bruns (couleur de la terre, donc des racines et de la stabilité) ainsi que le raffinement du bord des photos. Bon par contre, je ne comprends pas pourquoi ils ont impérativement tenu à faire déborder sur le haut de la page le lecteur et pourquoi ils ont utilisés des items de navigation en lettre capitale (une affreusemanie de bon nombre de designeurs). Notez qu’ils proposent également une version mobile.

Terminons en beauté avec Olasul, une marque de fringues d’été :

Même si encore une fois les titres sont en majuscules (Grrrrrr!), cette page d’accueil est un modèle de sobriété qui fait un parfait usage des espaces vides (« white spaces » en anglais, cf. les liens dans le premier site). La grande photo sert à poser l’ambiance de la marque et la promesse est immanquable (livraison gratuite). Le reste du site capitalise sur cette tendance minimaliste et renforce le contraste entre le fond blanc des pages et les fringues de couleur.

La suite le mois prochain.

J’ai un peu de retard pour vous livrer mes 3 sites coup de coeur, mais comme on dit chez nous « L’attente, c’est la moitié du plaisir ».

Commençons donc avec OakStreet BootMaker, un fabricant de bottes et chaussures :

La mise en page très sobre laisse un maximum de place aux photos, la typo particulièrement fine apporte de la sophistication malgré un traitement très minimaliste. Le fond de page réchauffe intelligemment une ambiance qui aurait pu être glaciale. J’apprécie particulièrement les deux accroches de chaque côté du logo (positionné au centre). Voici donc une boutique parfaitement sobre et élégante, j’adore !

Continuons avec Pointless Corp, un portfolio de projets créatifs réalisés par l’agence Viget :

L’ambiance rétro de cette page est bien mise en valeur par les textures, le choix des illustrations et des typographies. Toutes ces polices et couleurs ne facilitent pas le lisibilité, mais le schéma qui occupe la partie droite de l’écran permet de clarifier la présentation du site et sa fonction. L’ensemble fonctionne très bien mais je regrette le manque de rigueur dans l’utilisation des typos (parfois avec serif, parfois sans).

Terminons enfin avec so1o, une application en ligne de gestion de projet :

Ce n’est pas tant la page d’accueil qui m’a séduit, malgré une construction très originale, mais plutôt les différents écrans de l’application en elle-même. Le tableau de bord (présenté dans la capture d’écran) est en effet un modèle de concision et de style. Les autres écrans ne sont pas en reste et témoignent d’un gros travail de structuration de l’information et de mise en forme. Ça nous change de MS Project !

La suite le mois prochain…