Une navigation faussement horizontale intelligente sur We Are Tennis

Au mois de décembre dernier [1], j’ai été invité par BNP Paribas (merci Marie) à l’open de tennis de Bercy, l’occasion pour moi de voir deux matchs sympas en loge, de me gaver de petits fours, et de découvrir We Are Tennis, le site du groupe BNP Paribas dédié au… tennis, ah ben ça alors.

We are tennis

Si vous me suivez un tant soit peu sur Twitter (et ailleurs), vous ne pouvez pas ne pas savoir que j’aime le tennis. J’y joue (souvent, trop même aux dires de ma femme), j’en regarde énormément, et je m’enquille un peu tout ce qui passe sur le sujet d’une manière générale. We Are Tennis n’était pourtant pour moi qu’une page de publicité (de plus) dans mon Tennis Magazine mensuel.

Quand je suis arrivé sur le site, j’ai eu trois réactions – dans l’ordre :

  • Mais c’est quoi noir et vert à la Matrix ? On dirait mon site de hacking en 1998 !
  • Rhaaaa encore un site en Flash ?
  • Euh, mais c’est pas un peu bordélique là ?

Un petit coup de Matrix reloaded ?

On va commencer par les choses qui fâchent : je n’aime pas les couleurs. Autant je travaille toute la journée avec un éditeur de texte à fond noir, autant le vert fluo du site m’explose un tout petit peu les yeux, en particulier le carousel qui mange près de la moitié de l’écran en 1440x900. Heureusement, la consultation des articles se fait en blanc sur fond noir, et dans ce cas l’image de fond n’est pas trop gênante, mais il est impossible de se débarrasser de la barre latérale autrement qu’à grands coups de Firebug.

Encore un site en Flash ?

Eh bien non, pas cette fois, c’est une des bonnes surprises réservées par l’utilisation de Firebug pour virer cette saloperie de <header /> vert fluo : header, nav, b, i… le site est en HTML5, même si les Javascripts (chargés en bas de page, on voit que les bonnes pratiques ont fait du chemin depuis mon passage chez BNP Paribas IE6 only il y a 5 ans) montrent le chargement de SWF Object.

Une bonne utilisation de la navigation horizontale

J’en arrive au point le plus intéressant – et le plus contestable après l’utilisation du vert fluo – l’utilisation d’une navigation faussement horizontale. Le site est divisé en 7 rubriques, toutes affichées sur la même page, d’où l’impression de bordel, mais sans scroll horizontal. L’utilisateur passe d’une section à une autre soit via le menu situé en haut de page, soit en cliquant sur l’en-tête de la section suivante, le tout avec un joli effet de transition latérale. Une fois la section choisie, le défilement se fait naturellement de haut en bas.

C’est une utilisation très astucieuse du scroll horizontale, là où ce mode de navigation me donne juste envie de fermer la fenêtre : elle permet au contenu de prendre tout l’espace de la fenêtre aussi importante soit votre résolution, mais sans perdre en confort de lecture avec des lignes de 2 kilomètres. J’ai eu un peu de mal à comprendre comment ça fonctionnait, probablement parce que mon ascenseur se situe tout à droite de la fenêtre, et que le défilement ne se fait que sur la section en cours, et non sur la page entière, ce qui est un peu déroutant.

Et le contenu dans tout ça ?

Côté contenus, on n’est pas en restes. Le site propose l’actualité du tennis professionnel, des résultats, le calendrier de l’ATP et la WTA, un blog plein d’analyses avec lesquelles je suis plutôt d’accord : le Federer - Djokovic en demi finale de Roland Garros était le match du siècle, mais si vous n’y étiez pas, vous ne pouvez probablement pas comprendre. On y trouve enfin une section dédiée à l’engagement de la BNP qui se présente comme la banque de tous les tennis. Et c’est sur ce point que j’ai été le plus déçu : il manque clairement une section dédiée au tennis local, il y a autre chose dans la vie que l’ATP et la WTA.

[1] Je sais je suis à la bourre, mais cet article m’était sorti de la tête jusqu’à ce matin, et l’ouverture de la vente des places de Roland Garros, aux licenciés de la FFT seulement, les autres il vous faudra attendre.

Publié le 10 janvier 2012 à 07h54 Publié sous et Labels blogging, navigation, blog

À propos

Frédéric de Villamil

Je m'appelle Frédéric de Villamil, et quand je ne déploie pas ma mauvaise humeur et ma mauvaise foi sur le Web, je suis un super héros chargé de sauver le monde. Vous pouvez me suivre sur Twitter.

  1. Gameplayer le 10 janvier 2012 à 12h59

    C’est dommage que le site soit aussi buggé sur firefox9…

    J’ai eu droit aux menus qui ne réagissent plus après quelques clics, aux rubriques qui se mélangent si on clique trop vite…

  2. Frédéric de Villamil le 10 janvier 2012 à 13h43

    J’ai testé le site avec Firefox 8 et Chrome 16 Mac, pas rencontré de soucis, je leur remonte le problème.

  3. Christophe C le 10 janvier 2012 à 15h00

    Concept fort intéressant. Testé sur portable Apple avec souris/pad tactile, ainsi que testé sur écran tactile, et la navigation devient hélas moins évidente car tout le contenu central est déplaçable. Une version “mobile/pad” doit à mon avis accompagné une telle interface. Pour la souris/pad tactile sur portable, là c’est autre chose…

  4. ToSiMpHaL le 10 janvier 2012 à 16h37

    Article intéressant !

    Merci pour ces remarques !

    Le design est osé ! Disons que ça change des sites actuels, non ?

    Prêt pour l’Open d’Australie ? J-6

    @Gameplayer : merci, je fais remonter l’info now !

    ToSiMpHaL, Commuity Manager WeAreTennis

  5. photo serie le 17 janvier 2012 à 17h51

    La navigation est simple même si elle peut en perturber beaucoup je pense, normal ce n’est pas habituel. Par contre… au niveau référencement il vont bien galérer je pense.

Réagir à Une navigation faussement horizontale intelligente sur We Are Tennis

Afin de maintenir le niveau global de ce site, les commentaires font l'objet d'une politique de modération qualitative basée sur des critères non écrits et totalement subjectifs, donc injustes.

Les commentaires écrits en langage SMS, inutiles, déplacés, injurieux ou relevant du spam seront systématiquement supprimés sans avertissement préalable.

Les trackbacks sont fermés pour cause de spam.