

{"id":3815,"date":"2015-05-24T13:10:04","date_gmt":"2015-05-24T13:10:04","guid":{"rendered":"http:\/\/localhost:10003\/fr\/?p=3815"},"modified":"2016-06-15T15:35:08","modified_gmt":"2016-06-15T15:35:08","slug":"vos-typographies-transmettent-de-lemotion","status":"publish","type":"post","link":"https:\/\/app.racontr.com\/fr\/vos-typographies-transmettent-de-lemotion\/","title":{"rendered":"Vos typographies transmettent de l&rsquo;?motion"},"content":{"rendered":"<p>[vc_row type=\u00a0\u00bbimage\u00a0\u00bb bg_image=\u00a0\u00bb3816&Prime;][vc_column][vc_separator color=\u00a0\u00bbcustom\u00a0\u00bb accent_color=\u00a0\u00bbrgba(0,0,0,0.01)\u00a0\u00bb][vc_single_image image=\u00a0\u00bb3819&Prime; img_size=\u00a0\u00bbfull\u00a0\u00bb alignment=\u00a0\u00bbcenter\u00a0\u00bb][\/vc_column][\/vc_row][vc_row][vc_column][vc_separator color=\u00a0\u00bbcustom\u00a0\u00bb accent_color=\u00a0\u00bbrgba(0,0,0,0.01)\u00a0\u00bb][vc_row_inner][vc_column_inner width=\u00a0\u00bb2\/3&Prime;][vc_column_text]<\/p>\n<h3>Vos typographies transmettent de l&rsquo;?motion !<\/h3>\n<p><strong>Les polices d??criture<\/strong> ont un r?le essentiel dans la <strong>qualit? visuelle<\/strong> et le message que doit transmettre un auteur.<\/p>\n<p>L?un des ?l?ments cl?s d?un <strong>projet fructueux<\/strong> est le choix d?une ligne graphique <strong>claire<\/strong> et <strong>adapt?e<\/strong>.<\/p>\n<p>N?oubliez pas : les typographies, plus que de simples lettres, <strong>sont des vecteurs d??motions !<\/strong>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=\u00a0\u00bb1\/3&Prime;][vc_column_text]<strong>Carnet de route \ud83d\ude15<\/strong><\/p>\n<p><a href=\"http:\/\/joelcrawfordsmith.com\/closest-font\/\" target=\"_blank\">Whats the closest Google Font ?<\/a><\/p>\n<p><a href=\"http:\/\/www.dafont.com\/fr\/\" target=\"_blank\">La?r?f?rence pour trouver pleins de?Fonts<\/a><\/p>\n<p><a href=\"http:\/\/www.arte.tv\/fr\/l-histoire-de-l-ecriture\/7360080,CmC=7389854.html\" target=\"_blank\">L?histoire de l??criture<\/a><\/p>\n<p><a href=\"http:\/\/typographisme.net\/post\/Les-formats-de-polices-typographiques-pour-le-Web\" target=\"_blank\">Les formats de polices sur le Web<\/a>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][vc_row_inner][vc_column_inner][vc_column_text]Tant dans le <strong>Web Design<\/strong> que la <strong>publicit?<\/strong> ou un simple <strong>projet interactif<\/strong>, elle aura un impact consid?rable?sur votre cible.<br \/>\nSur le <strong>Web<\/strong>, les codes sont sensiblement les m?mes qu?en <strong>print<\/strong> : en optimisant et en harmonisant la taille, la couleur et la mise en page, vous am?liorerez grandement <strong>le confort de lecture<\/strong> de votre audimat.[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][vc_row_inner][vc_column_inner width=\u00a0\u00bb1\/2&Prime;][vc_column_text]<\/p>\n<p style=\"text-align: center;\"><strong>You can!<\/strong><\/p>\n<p>[\/vc_column_text][vc_single_image image=\u00a0\u00bb3835&Prime; img_size=\u00a0\u00bbfull\u00a0\u00bb alignment=\u00a0\u00bbcenter\u00a0\u00bb][vc_column_text]<a href=\"http:\/\/www.cbnews.fr\/hit-parade\/france-is-in-the-air-a1011737\" target=\"_blank\">Cette campagne de publicit?<\/a> Air France ? l?aspect un peu vintage va droit au but avec des typographies claires et fluides.[\/vc_column_text][\/vc_column_inner][vc_column_inner width=\u00a0\u00bb1\/2&Prime;][vc_column_text]<\/p>\n<p style=\"text-align: center;\"><strong>You can&rsquo;t!<\/strong><\/p>\n<p>[\/vc_column_text][vc_single_image image=\u00a0\u00bb3838&Prime; img_size=\u00a0\u00bbfull\u00a0\u00bb alignment=\u00a0\u00bbcenter\u00a0\u00bb][vc_column_text]<\/p>\n<p style=\"text-align: left;\"><a href=\"http:\/\/sport24.lefigaro.fr\/le-scan-sport\/buzz\/2014\/09\/01\/27002-20140901ARTFIG00143-flocage-des-maillots-illisible-le-president-du-racing-metro-plaide-coupable.php\" target=\"_blank\">Le flocage des maillots illisibles<\/a> du Racing-M?tro a ?t? un vrai flop.<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][vc_row_inner][vc_column_inner][vc_column_text]<\/p>\n<p style=\"text-align: center;\"><em>??Pour la marque, une identit? visuelle forte est une n?cessit? car seule la marque imm?diatement reconnue sert de s?same dans le labyrinthe d?un magasin moderne??<\/em><\/p>\n<p style=\"text-align: center;\">Georges Lewi.<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][vc_row_inner][vc_column_inner width=\u00a0\u00bb2\/3&Prime;][vc_column_text]<\/p>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<p>Bien souvent, la typographie et les <strong>jeux de couleurs<\/strong> sont la raison d?un engouement autour d?un produit ou d?un projet.<\/p>\n<\/div>\n<\/section>\n<div class=\"hr hr-invisible avia-builder-el-22 el_after_av_textblock el_before_av_image \"><\/div>\n<p>[\/vc_column_text][vc_single_image image=\u00a0\u00bb3829&Prime; img_size=\u00a0\u00bbfull\u00a0\u00bb alignment=\u00a0\u00bbcenter\u00a0\u00bb][vc_column_text]<\/p>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<p><strong>Monoprix<\/strong> a mis? sur une campagne de publicit? con?ue essentiellement sur un m?lange de <strong>taille<\/strong> et de <strong>couleurs<\/strong> de typographie.<\/p>\n<p><em>?L?id?e est de faire de chaque produit un ambassadeur de la marque. Chaque produit doit ?tre beau, intelligent, vecteur du langage de Monoprix.?<\/em><br \/>\nR?mi Babinet, Pr?sident fondateur d?Havas City.<\/p>\n<\/div>\n<\/section>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<p>Offrir ? vos projets et cr?ations <strong>des m?canismes de lecture<\/strong> ad?quate vous permettra de capter de mani?re efficiente l?attention : nous allons en passer en revue un certains nombre.<\/p>\n<\/div>\n<\/section>\n<p>[\/vc_column_text][vc_column_text]<\/p>\n<div class=\"flex_column av_two_third first avia-builder-el-20 el_after_av_one_full el_before_av_one_third column-top-margin\">\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<h3>Comprendre vos lecteurs<\/h3>\n<h3><\/h3>\n<\/div>\n<\/section>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<p>La lecture n?a lieu que lorsque le regard est immobile par rapport au texte regard? !<\/p>\n<p>Nous lisons progressivement, par arr?t de regard sur la ligne, il faut donc <strong>bien d?couper son texte pour cr?er des groupes de signes.<\/strong><\/p>\n<p>L?humain devine plut?t qu?il ne lit ! La visibilit? de vos interfaces graphiques doit ?tre intrins?quement li?e ? la sc?narisation de vos textes et contenus.<\/p>\n<p>Pensez au confort et ? la facilit? de lecture ! M?me avec la plus belles des typographies, un texte n??tant pas a?r? est fastidieux ? lire. L?une des solutions est d?augmenter <strong>le corps du texte et son interlignage.<\/strong><\/p>\n<\/div>\n<\/section>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<h3><\/h3>\n<h3>Questions essentielles au choix d?une font :<\/h3>\n<p>&nbsp;<\/p>\n<\/div>\n<\/section>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<ul>\n<li>Cette font reste-t-elle lisible en grande taille comme en petite ?<\/li>\n<li>La Police comporte-t-elle tous les caract?res sp?ciaux dont j?ai besoin ?<\/li>\n<li>Les caract?ristiques graphiques de la font sont-elles en accord ou coh?rentes avec le reste de mes choix graphiques ?<\/li>\n<li>Est-elle disponible en plusieurs graisses ?<\/li>\n<li>Les diff?rentes tailles ou graisses de la Police sont-elles coh?rentes entre elles ?<\/li>\n<li>La Police comporte-elle tous les glyphes de la langue fran?aise ?<\/li>\n<li>Dans le cas d?un site multilingue, la police comporte-elle les glyphes des langues concern?es ?<\/li>\n<li>Les glyphes de la Police ont-ils ?t? dessin?s au format PostScript (voir sur le site de l??diteur) ?<\/li>\n<li>C?est pour du titrage ou du contenu ?<\/li>\n<li>Quel sera l?usage ? Bas de casse ou haut de casse ?<\/li>\n<\/ul>\n<p><a href=\"http:\/\/demontiers.com\/2014\/03\/comment-choisir-une-fonte\/\">Source<\/a><\/p>\n<\/div>\n<\/section>\n<\/div>\n<div class=\"flex_column av_one_third avia-builder-el-35 el_after_av_two_third el_before_av_one_third column-top-margin\"><\/div>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=\u00a0\u00bb1\/3&Prime;][vc_column_text]<em><strong>Coca Cola<\/strong> a fait le choix depuis sa cr?ation de garder sensiblement le m?me logo, alors que <strong>Pepsi<\/strong> a prit le partie d??purer avec le temps la typographie pour la rendre de plus en plus claire.<\/em>[\/vc_column_text][vc_single_image image=\u00a0\u00bb3832&Prime; img_size=\u00a0\u00bbfull\u00a0\u00bb alignment=\u00a0\u00bbcenter\u00a0\u00bb][\/vc_column_inner][\/vc_row_inner][vc_row_inner][vc_column_inner width=\u00a0\u00bb1\/4&Prime;][vc_single_image image=\u00a0\u00bb3826&Prime; img_size=\u00a0\u00bbfull\u00a0\u00bb][\/vc_column_inner][vc_column_inner width=\u00a0\u00bb3\/4&Prime;][vc_column_text]<\/p>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<h3>La mise en page<\/h3>\n<\/div>\n<\/section>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<p>Il est important <strong>d?a?rer vos contenus<\/strong>, voici quelques <strong>tips<\/strong>.<\/p>\n<p>Une taille de police id?ale, par d?faut <strong>14px<\/strong>, moins de <strong>10px<\/strong> rendra le texte illisible.<\/p>\n<p>Pour bien distinguer vos blocs textes, pensez ? mettre des <strong>espaces significatifs<\/strong> entre eux.<\/p>\n<p>L?interligne permet d?harmoniser vos paragraphes, en g?n?ral il est compris entre <strong>1,3 et 1,6.<\/strong><\/p>\n<p>La touche finale :?la longueur de votre texte (en moyenne <strong>100<\/strong> caract?res par ligne) et l?alignement ? gauche pour ?viter les espacements irr?guliers.<\/p>\n<\/div>\n<\/section>\n<p>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][vc_row_inner][vc_column_inner width=\u00a0\u00bb3\/4&Prime;][vc_column_text]<\/p>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<h3>Style et contraste<\/h3>\n<p>&nbsp;<\/p>\n<\/div>\n<\/section>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<p>Bien ?videmment, pour une bonne lisibilit?, il est important de ne pas mettre de background ayant?une couleur de police trop proche : g?n?ralement, nous utilisons u<strong>n fond blanc avec une police noire.<\/strong><\/p>\n<p>Vous pouvez vous faire une id?e du rendu et du contraste id?al pour votre projet?<a href=\"http:\/\/www.snook.ca\/technical\/colour_contrast\/colour.html#fg=6BFF33,bg=C0B033\" target=\"_blank\">sur ce site.<\/a><\/p>\n<\/div>\n<\/section>\n<section class=\"av_textblock_section\">\n<div class=\"avia_textblock \">\n<p>Il est?pertinent de?mettre quelques mots du texte en <strong>gras <\/strong>ou en<strong>?<em>italique <\/em><\/strong>pour en faire ressortir les points forts.<\/p>\n<p>Au niveau de <strong>l?architecture<\/strong> de vos zones de texte, ?gardez une harmonie entre les tailles de police des diff?rents titres ou sous-titres.<\/p>\n<p>Entre la taille des caract?res, la graisse, l?interlignage, la couleur et les milliers de polices pr?sentes sur le web, vous avez donc un large panel de possibilit?s ? exploiter pour vos projets??!<\/p>\n<p>Que votre support soit print ou multim?dia, la typographie est <strong>l?outil adapt? pour donner la parole ? toutes vos id?es !<\/strong><\/p>\n<\/div>\n<p><strong>Axel Boeykens<\/strong><\/p>\n<\/section>\n<\/div>\n<\/section>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=\u00a0\u00bb1\/4&Prime;][vc_single_image image=\u00a0\u00bb3823&Prime; img_size=\u00a0\u00bbfull\u00a0\u00bb][vc_column_text]<em>A l?image d?un bureau bien rang?, de belles typographies et une architecture visuelle de vos blocs textes ad?quate rythmeront harmonieusement vos projets<\/em>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>[vc_row type=\u00a0\u00bbimage\u00a0\u00bb bg_image=\u00a0\u00bb3816&Prime;][vc_column][vc_separator color=\u00a0\u00bbcustom\u00a0\u00bb accent_color=\u00a0\u00bbrgba(0,0,0,0.01)\u00a0\u00bb][vc_single_image image=\u00a0\u00bb3819&Prime; img_size=\u00a0\u00bbfull\u00a0\u00bb alignment=\u00a0\u00bbcenter\u00a0\u00bb][\/vc_column][\/vc_row][vc_row][vc_column][vc_separator color=\u00a0\u00bbcustom\u00a0\u00bb accent_color=\u00a0\u00bbrgba(0,0,0,0.01)\u00a0\u00bb][vc_row_inner][vc_column_inner width=\u00a0\u00bb2\/3&Prime;][vc_column_text] Vos typographies transmettent de l&rsquo;?motion ! Les polices d??criture ont un r?le essentiel dans la qualit? visuelle et le message que doit transmettre un auteur. L?un des ?l?ments cl?s d?un projet fructueux est le choix d?une ligne graphique claire et adapt?e. N?oubliez pas : les typographies, plus que de [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":3842,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[36],"tags":[],"class_list":["post-3815","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-le-temps-dun-cafe"],"_links":{"self":[{"href":"https:\/\/app.racontr.com\/fr\/wp-json\/wp\/v2\/posts\/3815","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/app.racontr.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/app.racontr.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/app.racontr.com\/fr\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/app.racontr.com\/fr\/wp-json\/wp\/v2\/comments?post=3815"}],"version-history":[{"count":0,"href":"https:\/\/app.racontr.com\/fr\/wp-json\/wp\/v2\/posts\/3815\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/app.racontr.com\/fr\/wp-json\/wp\/v2\/media\/3842"}],"wp:attachment":[{"href":"https:\/\/app.racontr.com\/fr\/wp-json\/wp\/v2\/media?parent=3815"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/app.racontr.com\/fr\/wp-json\/wp\/v2\/categories?post=3815"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/app.racontr.com\/fr\/wp-json\/wp\/v2\/tags?post=3815"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}