Langages
Pages
Légal
Design Web
Les nouveautés de 2011...
Alain-Marie Carron
20 décembre 2011
vendredi 23 décembre 2011
L’humanité, non le Web, progresse...
À voir ce qui se passe en Syrie, au Soudan, chez Poutine ou Kim Jong-Il en cette fin d’année 2011, il semble douteux que l’humanité progresse.
Mais le Web échappe à cette fatalité; il s’améliore d’année en année, en particulier pour ce qui est du design, de l’ergonomie et de l’architecture des sites Internet.
• Hier, faute de moyens techniques et d’expérience, le rendu graphique était ... bizarre, comme le montrent ces pages du jeu SIM City 2000
vendredi 23 décembre 2011
MSNBC TVNewsBusinessSportsEntertainmentTech/ScienceHealthTravelOpinionsWeatherLocal NewsNewsweekToday ShowNightly NewsMeet the pressDateline NBCMultimediaNews VideoMSNBC ShoppingCalssifiedsNewsbotSearch MSNBC:
Also on MSBCCorrectionsLettersNewslettersCampain 2004CrosswordComicsHoroscopeSports scoresNBC First ReadGossipStock quotesThe week in picturesFantasy sportsMSNBC AlertsWinning getawaysSmarter businessHeart Health
Menus déroulants
Top Stories
Business front page
Lighten up, road warriorsBill would allow deductions for sales tax
Upbeat retail sales data lift Wall Street
Wash Post: Farmers savor the cappucino effect
Stewart : Prison is "what I expected"
Oil prices hit 55$ a barrelAmerican los confidence in October
US Airways gets goahead to cut workers' pay
Sprint to cut 700 jobs, expect charge
Kraft reportedly to sell Life Savers, Altoids
Top SectionsStocks & EconomyPersonal Finances
U.S. Business NewsInternational Business News
Oil & Energy NewsAutomotive News
CNBC TVLocal BusinessBusiness Week
Financial Times HighlightsForbes
Small BusinessSpecial Reports
International Business News front Page
E.U. trade chief lashe out at "euro bashing"
Caesars Entertainment betting in Britain
Report: Russia seeks sales of Yuko's assets
Norwegian, American win Nobel for economics
Le Web abandonne (presque) les menus déroulants
• En 2003 j’avais fait pour RadioCanada une étude de 11 sites d’information liés à de grandes chaînes de télévision.
• Le cauchemar de l’époque, c’était les menus déroutants, pardon, déroulants.
• Sur la page d’accueil de MSNBC il n’y en avait pas loin de 150... un faux mouvement avec la souris et vous étiez mort.
• Sur ce schéma, je n’avais reproduit que les menus déroulants liés à la section Business.
• Comparez avec le site de MSN aujourd’hui: http://www.msnbc.msn.com/
vendredi 23 décembre 2011
Et se libère de la dictature des listes
• Longtemps les sites riches en contenu ont eu beaucoup de peine à concevoir une page d’accueil qui ne ressemblerait pas à un annuaire téléphonique.
• Ci-dessous, l’exemple du site de Desjardins, la banque la plus populaire au Québec, autour de 2009. La situation s’est un peu améliorée depuis: http://www.desjardins.com/fr/#
• Heureusement, à la même époque, des sites comme celui du Figaro osaient se libérer de la dictature des listes en découvrant les bienfaits de ce que l’on appelle les blancs circulants.
vendredi 23 décembre 2011
Pour découvrir le charme de la ligne ronde
Autour de 2009 également, SiteStep, comparateur de prix pour des vols et des voyages (repris depuis par Kayak) applique déjà quelques unes des règles qui caractérisent un bon site aujourd’hui:
• chaque page est essentiellement consacrée à une action, pas à 10.
• les boutons d’action sont peu nombreux, dessinés en volume, et occupent les meilleures places.
• le blanc circulant est partout, la page respire.
• les couleurs sont gaies; on cesse de penser que pour être pris au sérieux il faut avoir l’air emmerdant.
• Les icônes, dessinées avec humour selon un graphisme rond et très lisible, se multiplient.
• Des fonctions complémentaires sont proposées en bas de pages, peu nombreuses, bien séparées les unes des autres.
comparez ce design à ceux qui suivent..
vendredi 23 décembre 2011
vendredi 23 décembre 2011
vendredi 23 décembre 2011
vendredi 23 décembre 2011
Le dessin fait le décor
• De plus en plus de sites font une large place au dessin et à des icônes imaginatives mais très parlantes
http://www.navigant.com/https://secure.vidyard.com/
vendredi 23 décembre 2011
Contraste : en 2011, un design signé 2000
• Constat : il y en a encore des milliers comme celui-là
• Excuse : quand on travaille dans la Sécurité on dédaigne les guirlandes et fantaisies des «artiss»
http://www.globalsecuritymag.fr/
vendredi 23 décembre 2011
(Retour à 2011) Le Web cultive le papier et la typographie
• Dans les milieux les plus créatifs, le Web 2011aime à se prendre pour une feuille de papier et jouer sur la typo.
• Un phénomène devient omniprésent, l’infographie géante avec une débauche de caractères d’imprimerie
http://kilianmuster.com/http://thebolditalic.comhttp://cognition.happycog.com/
vendredi 23 décembre 2011
Vers 2012 : Déplacement horizontal/vertical
• La multiplication des touch screens, que ce soient ceux des tablettes ou des téléphones intelligents est en train de faire du scrolling (désolé pour ce jargonglish) une façon naturelle de visiter un site.
• À l’opposé du site-web-liste- téléphonique, le parcours de l’usager est ici intuitif, quasi physique
• Comportant peu d’éléments, occupant toute la page (une forme de fluid grid est préférable) ces sites sont souvent spectaculaires et permettent aux graphistes de prouver leur talent.
• Pratique pour les sites à faible contenu textuel, où tout est sur la même page, le procédé devient techniquement plus délicat quand on veut marier à ce premier écran un second niveau, riche en textes.
• Ces sites sont «furieusement tendance», comme disent les journalistes de mode
http://www.thinkingforaliving.org/
http://www.ericj.se/
vendredi 23 décembre 2011
Vertical Horizontal
http://deanoakley.com/http://aboard-entrepreneurship.com/
vendredi 23 décembre 2011
Magique, en 4 écrans
1
2
3
4
http://www.pojeta.cz/
vendredi 23 décembre 2011
Voir aussi sur SlideShare (@ Alain-Marie Carron) : Bâtir un site Web (2011), Petite revue du Web (2009), De la ligne claire à la forme ronde (Webdesigntendances)
vendredi 23 décembre 2011
Top Related