View
7.314
Download
1
Category
Preview:
Citation preview
Web2day . Datagif . juin 2015 .
Design et refontede site media
Design
Design ? Le but : inventer, améliorer ou faciliter l’usage d’un produit ou d’un service pour faciliter la vie et améliorer le confortdes utilisateurs.
Média
Média ? Au coeur de la création, du traitementet de la circulationde l’information.
@Datagif
Datagif Nous sommes une équipe de 12 personnes,et le design est notre métier. Nous accompagnons des marques et des médias dans la création ou la refontede leur site ou de leurs supports print.
Entendulors de briefs
Idées reçues Nousallons prendre quelques minutes pour questionner nos idées reçues,qui semblent tellement évidentes lors du design de pages d’un site media.
“ÉVIDEMMENT QU’IL FAUT DES ESPACES PUB PARTOUT ”
Un clientRéunion, 2015
“BIEN SÛR QU’IL FAUT DES BOUTONS DE PARTAGE EN DÉBUT ET EN FIN D’ARTICLE”
Un clientRéunion, 2015
“OUI IL FAUT LES NOMS DESRUBRIQUES SUR TOUTES LES PAGES”
Un clientRéunion, 2015
“TOUT DOIT TENIR DANS LE PREMIER ÉCRAN, IL FAUT UN
MINIMUM DE SCROLL”
Un clientRéunion, 2015
“LÀ IL RESTE DU BLANC, ON PEUT METTRE UNE PUB ? ”
Un clientRéunion, 2015
Votre futurlancement de site
L’annonce de lanouvelle formule
Phrases clé Au lancement de votre futur site, après des mois de travail, vous aurez envie de leprésenter. Voici unesélection des vraies phrases clé qui reviennent le plus souvent, parmi un corpus d’une dizaine de sites medias français.
« FAIT PEAUNEUVE »
« PLUS ÉLÉGANTE, PLUS SOBRE, PLUS
ÉPURÉE »
« PLUS AUDACIEUX,
PLUS SURPRENANT, PLUS INFORMÉ »
« PLUSMODERNE »
« S’ADAPTE À TOUS VOS ÉCRANS »« TEMPS RÉEL » « NOUVEAU PROJET
ÉDITORIAL »
« MUTATION PASSIONNANTE »
« UNE NOUVELLE MANIÈRE DE CONSOMMER L’ACTUALITÉ »
« MET L’ACCENT SUR CES NOUVEAUX
USAGES »
« UNE NOUVELLE EXPÉRIENCE »
« LE MÉDIA DE LA MOBILITÉ »
« RÉVOLUTION NUMÉRIQUE»
« S’ADAPTE À TOUS VOS ÉCRANS »« SE RÉINVENTE » « NOUVEAU PROJET
ÉDITORIAL »
« CHAUDET CALÉ, BEAUET DÉCALÉ »
La réactiondes lecteurs
Haters gonna hateImmanquablement, vos lecteurs réagiront.Voici un florilège decommentaires choisis auhasard à la suite de ces articles. Pas de panique,il y a des haters partout.
Les commentairesqui acceuillent les nouvelles formules
BONSOIRMERDIQUE CETTEPRÉSENTATION
SUR CE SITE
SITE MAL CONSTRUIT,
ILLISIBLE, SANS FIL DIRECTEUR, ET ÇA A DU COÛTER UN BRAS
Les commentairesqui acceuillent les nouvelles formules
FIASCO COMPLET.JE ME RETIRE, C’EST
TROPCOMPLIQUÉ POUR MOI.
REVOYEZ VOTRE COPIE
D’URGENCE.
VIREZ VOSINFORMATICIENS !
DIMINUEZ LA TAILLE DES
POLICES, PAR PITIÉ. LA LECTURE EST DEVENUE ASSEZ DÉSAGRÉABLE
ET FASTIDIEUSE, IL FAUT SCROLLER EN PERMANENCE...
BROUILLON, ET PAS PRATIQUE.
MAIS ON S’HABITUERA.
C´EST NUL ET ARCHI-NUL !
200CMS CARRÉS POUR NOUS FORCER
À REGARDER LES POSTS LES PLUS MALINS ...PLUS
MALINS POUR QUI ?GROS CARACTÈRES,
IMPOSSIBLES À RÉDUIRE
IL FAUT AVOIR BAC + 20 POUR
CHERCHER LES INFOS QUE L’ON SOUHAITE.
NOUVELLE PRÉSENTATION
COMPLÉTEMENT CON. VITE REVENEZ
À L’ANCIENNE. LA PUB EST
INNOMMABLE. JE NE LA REGARDE PLUS ET JE REFUSE
D’ACHETER LES MARQUES
PRÉSENTÉES
POURQUOI FAIRE SIMPLE QUAND ON PEUT TOUT COMPLIQUER ...
MAINTENANT ON SE CROIRAIT À LAS VEGAS : ÇA BRILLE DE PARTOUT, ÇA CLIGNOTE, ÇA
OUVRE DES TRUCS EN PASSANT SA
SOURIS SANS QU’ON NE DEMANDE RIEN, ON NE SAIT PAS OÙ IL FAUT POSER SES
YEUX...
Faut-il tuerla homepage ?
SIZE DOES MATTER
SIZE DOES MATTER
Une question de taille Est-ce que la homepage doit tout contenir ?Ou doit-elle êtrela plus courte possible ?
Quels contenus pourla homepage ?La question de la taille dépend en réalité du contenu. Posons-nous les bonnes questions pour déterminer ce qu’on y retrouve.
A.Je mets
tout mon contenu dansla homepage parce que ça sert à ça lahomepage.
Quels contenus pourla homepage ?
A.Je mets
tout mon contenu dansla homepage parce que ça sert à ça lahomepage.
B.Je mets
tout mon contenu dansla homepage mais de toute
façon personne n’y va.
Quels contenus pourla homepage ?
A.Je mets
tout mon contenu dansla homepage parce que ça sert à ça lahomepage.
C.Je ne
mets qu’une sélection de mon contenu
car je suis chez moi après
tout.
B.Je mets
tout mon contenu dansla homepage mais de toute
façon personne n’y va.
Quels contenus pourla homepage ?
A.Je mets
tout mon contenu dansla homepage parce que ça sert à ça lahomepage.
C.Je ne
mets qu’une sélection de mon contenu
car je suis chez moi après
tout.
B.Je mets
tout mon contenu dansla homepage mais de toute
façon personne n’y va.
D.Je ne
mets qu’une sélection mais
uniquement ce que tous les lecteurs auront
déjà lu.
Quels contenus pourla homepage ?
A.Je mets
tout mon contenu dansla homepage parce que ça sert à ça lahomepage.
C.Je ne
mets qu’une sélection de mon contenu
car je suis chez moi après
tout.
B.Je mets
tout mon contenu dansla homepage mais de toute
façon personne n’y va.
D.Je ne
mets qu’une sélection mais
uniquement ce que tous les lecteurs auront
déjà lu.
E.Je ne mets
rien, puisque de toute façonla homepage
ça ne sert plusà rien.
Quels contenus pourla homepage ?
Selon le NYT, la homepage est de
toute façon déjà morte.
:’(
Divisé par deux En deux ans, le New York Times a vu le trafic de sa homepage se diviser par deux. Les internautes ne viennent plus consulter les actus via la home, mais davantage par des liens extérieurs. On est passéà une consommation plus éclatée de l’actualité.
Source :rapport d’innovationNew York Times, mai 2014
2011 2012 2013
160
60
0
100
40
80
20
120
140
MillionsR.I.P.
Qz old version
Pas de homepage À son lancement, la homepage de Quartz faisaitentrer l’internaute directement par un article.
Qz version actuelleUne home raisonnée Puis Quartz aréintroduit une homepage, présentant une va-leur ajoutée : le brief (mémo de l’actu)et une sélection des meilleurs articles. Car le media s’est rendu compte que ses lecteurs avaient une circulation les faisant revenirsouvent revenir sur la «home», donc sur un article déjà lu.
Qz version actuelle
La peur du scrollVS l’acceptationdu scrollLa maladie de l’Internet Beaucoupd’éditeurs de sites sont persuadés que les internautes ne scrollent pas. Cette peur est un cercle vicieux : en créant des pages ultra condensées, les internautes n’ont en effet pas envie d’en voir davantage.
Contenu important
Articles à la une..
Pub..
Articles récents..
Top..
Pub..
Article partenaire..
Les plus lus..
Articles à la une..
Pub..
Articles récents..
Top..
Pub..
Article partenaire..
Les plus lus..
Contenu peu important
La peur du scrollVS l’acceptationdu scroll
PEUR PAS PEUR
Prioriser l’important Le réflexe basique est de vouloir tout caser en haut de la page, et tout devient important, au mêmeniveau. Sans peur du scroll, on libèretotalement la navigation et on peut ainsi avoir une hompage mieux construite, plus équilibrée, et plus agréable pour l’internaute.
Libération Alors que nous travaillons sur la refonte de Liberation.fr, nous avons proposé un fil conducteur pour lanouvelle home.
Libération
Top Scroll En suivant ce Top 100, l’internaute défile la homepage, sans avoir peur de scroller. Celaimplique plus de place pour les contenus, une meilleure hierarchisation, plus d’espaces potentiels pour les publicités.
Slate
Une home flexible Lors de notre travail de refonte de Slate.fr, la rédaction a émis le souhait de tout remettre à plat. Sonapproche magazine et le recul sur les sujetsd’actualité nous ontpermis de construire le haut de la homepage sous forme d’ensemble de contenus qui vivent tout au long de la journée dans différents espaces.
Reader
Le flux Lorsque nous avons travaillé sur le site Reader.fr, l’approchea été différente : le site est un flux global ; la homepage n’est plus un portail nécessaire,l’internaute entredirectement par les contenus.
Faut-il tuerla homepage ?
notre réponse : ça dépend
Faut-il tuerl’habillage ?
habillage
pavé
Vampirisation Alors que les habillages publicitaires étaient des formatsévénementiels, ils sont devenus automatisés, contraignant lesmedias à se conformerà des contraintes de taille drastiques. Comment construire une homecorrecte avec seulement 1000 px de large ?
habillage
pavé
1000 px
habillage
pavé
Vice
Non Vice France fait partie des rares médias qui ont dit non à l’habillage et proposent d’autres formats. L’habillage a tendance à disparaître mais résiste bien dans le paysage français.
Libération Dans notreaccompagnement deLibération, nous avonssoutenu l’abandon del’habillage en homepage. Libération.fr a eu le courage de s’en défaire et sera l’un des premiers grands médias français à oser s’en passer, au profit d’autres formats dont voici quelques exemplesd’alternatives.
Faut-il tuerl’habillage ?
notre réponse : oui
Faut-il tuerles générateurs
de liens sponsos ?
Oui.
VOUS AIMEREZ AUSSI
RTL
Les fausses relances Les liens sponsorisés sont ces blocs que l’on retrouve à la suitedes articles sur la plupart des médias. Ils prêtent à confusion sur le parcours de l’internaute.
VOUS AIMEREZ AUSSIDÉCOUVREZ LA VÉRITABLE
RECETTE DES GALETTESDE POMMES DE TERRE
France MontagnesELLELes EchosMes idées recettesChampagne-ArdenneGet The Look
RTL
Audience perdue Dans cet exemple, RTL recommande à sesvisiteurs 6 autresmédias ou sitespublicitaires comme suite de lecture. Pourquoi s’acharner à garder son lectorat sur son support pour ensuite l’offrir à des concurrents ?
Le Figaro
Confusion Exactement la même structure sur la plupart des médias : on mélange contenu sponsorisé et contenu de circulation interne, pour la plus grande incompréhension du lecteur
Nouvel Obs
L’Express
OKLMCes générateurs de liens détruisent le travail des rédactions.
Faut-il tuerles générateurs
de liens sponsos ? notre réponse : si ça ne tenait qu’à nous…
Faut-il tuerla pub display ?
Sur un article,quel score adblock ?
18 22 13 18 7 18 5 15 13 8
LibérationLe Monde
L’ObsLe Figaro
20 minutes
Le Parisien
L’Express
Le Point Europe 1
BFMTV
Multiplication des pains Certains médias affichent des scores de nombre d’emplacements pub impressionnants.
57 % des pubs affichées
ne sont pas vues par des internautes
Kantar Media, octobre-décembre 2014
1 s50 %
Vue ? Pour être considérée comme vue, une publicité soit être à minima affichée 1 seconde, avec 50 % de sa surface visible.
1 s70 %
Contraintes L’IAB reconnaît qu’atteindre100 % est impossible,et recommande donc de fixer le seuil minimalà 70 % de surfaceaffichée.
25 % des internautes qui consultent
des sites médias sont équipés d’adblock
“NOUS SOMMES UNE RÉPONSE À L’INCAPACITÉ DE L’IAB DE FAIRE ÉVOLUER LES CHOSES”
Till FaidaFondateur d’Adblock Plus
octobre 2013
Wired
Des alternatives possibles De nombreux supports explorent le «native advertising» pourproposer du contenu éditorial en lien avec les sujets des annonceurs.
Buzzfeed
La place de la marque BuzzFeed offre une place à l’annonceur, qui s’intègre dans la maquette au même titre que les autres contenus. La frontière devient ténue...
NY Times
Medium
Faut-il tuerla pub display ?
notre réponse : ça se tente
Faut-il tuerle hamburger ?
1981
Pas si neuf Le burger menu nous vient tout droit du passé : il a été inventé chez Xerox lors de lacréation des premières interfaces
2008
Mobile Facebook lance son application mobile, avec cette icone pour le menu
2009
Mieux Peu de temps après, Facebook rajoute une ligne
2010 - aujourd’hui
Le classique Finalement, c’est la version des trois ligne qui à partir de 2010 sera communément utili-sée. Une icône simple, qui contient son sens :efficacité et universalité.
Chez Slate Nous l’avons utilisée pour afficher le menu : l’ensemble des rubriques se déploie dans un volet
Trop de burgers tuent le burger Attention à l’abus : sur cette page de Google Apps, on a 4 formes différentes de l’icône de menu, aux fonctions et interprétations variables. Beurk.
Faut-il tuerle hamburger ?
notre réponse : non
Faut-il tuerles relances ?
Que lire après votrearticle ? Un article a un début et une fin ; laquestion essentielle pour les médias est de garder son lecteur le plus longtemps sur son site en lui faisant consulter unmaximum de contenus.
Les relances Da manière assez classique, ons’attend à ce qu’uninternaute termine salecture pour qu’on luipropose d’autrescontenus, parfois enmultitude.
Avant la fin Sauf que certains lecteurs n’atteignent jamais le bas de l’article ; les médias ont donc pensé à placer desrelances avant la fin, avec l’inconvénient de créer de la distraction. C’est reconnaître que son contenu n’est peut-être pas suffisammentpertinent.
Dans le texte Autre ten-dance : ajouter des relances directement dans le corps du texte. À ce stade, l’internaute adavantage de sollicitations de lecture que de contenu d’unarticle en lui-même.
Le scroll vers le haut Nous avons observé que les internautes quiparcouraient un article sans le lire avaient un comportement différent : ils scrollent vers le haut pour revenir au header. C’est pourquoi nous avons prévu dans certains de nos projets d’afficher les relances uniquement lorsque l’internaute remonte.
Le choix multiple n’est pas plus efficace Contrairement à ce que l’on pourrait imaginer,proposer une multitude de relances ne contribue pas à faciliter la vie del’internaute, bien au contraire. En lui proposant un choix principal, vous le guidez dans sa navigation et augmentez les chances qu’il reste chez vous.
Huff post
Relances en prioritéSur la version mobile du Huffpost, il faut cliquer pour déployer le reste de l’article après le premier paragraphe. La conséquence del’observation du parcours d’internautes quiconsultaient peu l’article en entier après avoircliqué.
Faut-il tuerles relances ?
notre réponse : non
Faut-il tuerle site ?
39 / 50Sur une étude de 50 médias définis, 39 sont davantage consultés via un mobile plutôt qu’un ordinateur
Battle mobile / pas mobile
Pew Research center, avril 2015, USA.
Mobile 2 mn
Desktop 2,45 mn
Temps moyen par visiteOn passe davantage de temps sur un ordinateur mais la consommation est plus nombreuse et plus éclatée sur mobile.
Pew Research center, avril 2015, USA.
CNNBleacher ReportChicago Tribune
ViceChron
GawkerSalon
BostonMashableLA Times
Le top 10Top 10 des médias US principalement consultés sur mobile.
Pew Research center, avril 2015, USA.
Fev 2013 Oct 2013 Juin 2014 Fev 2015Juin 2013 Fev 2014 Oct 2014Avr 2013 Déc 2013 Août 2014 Avr 2015Août 2013 Avr 2014 Déc 2014
Le mobile n’a pastué votre ordinateur
1000
600
200
800
400
0
900
500
100
700
300
Mobile
Ordinateur
En réalité, le mobile a créé de nouvelles fenêtres temporelles de consultation du web.
Total de minutes passées en ligne en milliardsComScore, 2015
Faut-il tuerle site ? notre réponse : non
Faut-il tuerles boutonsde partage ?
J’aime
J’aime
J’aime
J’aime
J’aime
J’aime
J’aime
20K J’aime
Moche
Plus gros le logo Lesboutons sont de plus en plus gros et de plus en plus nombreux. Mais sont-ils réellement efficaces ? Comment mieux les intégrer ?
Que faire denos boutons ?
A.Est-ce utilede mettre
le bleu Facebook ?
Que faire denos boutons ?
A.Est-ce utilede mettre
le bleu Facebook ?
B.Est-ce utile
de mettre desboutons de
partagepartout ?
Que faire denos boutons ?
A.Est-ce utilede mettre
le bleu Facebook ?
C.Est-ce utile
de mettre desboutons de
partage si gros ?
B.Est-ce utile
de mettre desboutons de
partagepartout ?
Que faire denos boutons ?
A.Est-ce utilede mettre
le bleu Facebook ?
C.Est-ce utile
de mettre desboutons de
partage si gros ?
B.Est-ce utile
de mettre desboutons de
partagepartout ?
D.Est-ce utilede mettre
le logo Facebook ?
Que faire denos boutons ?
A.Est-ce utilede mettre
le bleu Facebook ?
C.Est-ce utile
de mettre desboutons de
partage si gros ?
B.Est-ce utile
de mettre desboutons de
partagepartout ?
D.Est-ce utilede mettre
le logo Facebook ?
E.Est-ce utile de ne rien
mettre du tout ?
Que faire denos boutons ?
Partager Partager Partager
BFMTV
3
Nombre de boutonsde partage dans un article
Partager Partager Partager Partager
Libération
4
Nombre de boutonsde partage dans un article
Partager Partager Partager Partager Partager
Le Figaro
5
Nombre de boutonsde partage dans un article
Partager Partager Partager Partager Partager
Partager
Europe 1
6
Nombre de boutonsde partage dans un article
Partager Partager Partager Partager Partager
Partager Partager Partager
Slate, Quartz
8
Nombre de boutonsde partage dans un article
Partager Partager Partager Partager Partager
Partager Partager Partager Partager
Le Parisien, 20 minutes, Le Point
9
Nombre de boutonsde partage dans un article
Partager Partager Partager Partager Partager
Partager Partager Partager Partager Partager
Partager
FranceTVinfo
11
Nombre de boutonsde partage dans un article
Partager Partager Partager Partager Partager
Partager Partager Partager Partager Partager
Partager Partager
L’Express
12
Nombre de boutonsde partage dans un article
Partager Partager Partager Partager Partager
Partager Partager Partager Partager Partager
Partager Partager Partager Partager
Le Monde, L’Obs
14
Nombre de boutonsde partage dans un article
Partager Partager
Medium
2
Nombre de boutonsde partage dans un article
“WE’VE FOUND EFFECTIVELY NO CORRELATIONBETWEEN SOCIAL SHARES
AND PEOPLE ACTUALLY READING”
Tony HaileCEO de Chartbeat
2 février 2014, sur son compte Twitter
Faut-il tuerles boutons de
partage ? notre réponse : il faut sérieusement y songer
Faut-il tuerles messages
à proposdes cookies ?
j’accepte
j’accepte
j’accepte
j’accepte
À vie
Nous sommes condamnés à toujours cliquer sur “fermer” ou “j’accepte” toute notre vie.
Faut-il tuerles messages
à proposedes cookies ?
notre réponse : on est tous d’accord, oui
Bonus
Quelle estnotre vision
d’un media coolpossible ?
@Datagif
Recommended