{"id":251616,"date":"2023-07-10T06:40:00","date_gmt":"2023-07-10T03:40:00","guid":{"rendered":"https:\/\/inform.click\/effets-de-la-typographie-sur-lexperience-utilisateur\/"},"modified":"2023-07-10T06:44:00","modified_gmt":"2023-07-10T03:44:00","slug":"effets-de-la-typographie-sur-lexperience-utilisateur","status":"publish","type":"post","link":"https:\/\/inform.click\/fr\/effets-de-la-typographie-sur-lexperience-utilisateur\/","title":{"rendered":"Effets de la typographie sur l&rsquo;exp\u00e9rience utilisateur"},"content":{"rendered":"<p>\n  La typographie est un art et une technique qui gagne de plus en plus en popularit\u00e9 au fil du temps. C&rsquo;est une comp\u00e9tence cruciale que chaque designer doit avoir, quel que soit son domaine de pr\u00e9dilection.\n<\/p>\n<p>\n  Si vous \u00eates quelqu&rsquo;un qui dirige une entreprise, veut ou est simplement un designer, la typographie ne fait pas autant parler de lui sans raison. Avec l&rsquo;aide de la typographie, vous pouvez avoir un impact durable sur vos lecteurs et utilisateurs.\n<\/p>\n<p>\n  Bien que cela puisse sembler \u00eatre un tas de mots assembl\u00e9s pour certaines personnes, ce tas est assembl\u00e9 de mani\u00e8re tr\u00e8s logique et technique, o\u00f9 chaque \u00e9l\u00e9ment est pr\u00eat\u00e9 attention au th\u00e9. C&rsquo;est un facteur important dans la conception qui ne doit pas et ne doit pas \u00eatre ignor\u00e9.\n<\/p>\n<p>\n  Si vous ne savez pas pourquoi vous devriez faire attention \u00e0 la typographie, pour faire simple, c&rsquo;est ainsi que vous pouvez garder l&rsquo;attention de votre lecteur sur votre illustration, votre marque ou votre design. Oui, les images peuvent valoir mille mots, tout comme votre logo et autres illustrations. Mais la typographie joue un peu sur la dur\u00e9e pendant laquelle ils regardent votre travail et l&rsquo;impact que cela a sur eux.\n<\/p>\n<p>\n  Importance dans la conception graphique\n<\/p>\n<p>\n  Dans la conception graphique, la typographie se rapporte aux techniques et aux r\u00e9sultats de l&rsquo;agencement des caract\u00e8res de telle mani\u00e8re qu&rsquo;elle repr\u00e9sente le plus fid\u00e8lement possible la marque et l&rsquo;entreprise sur lesquelles vous travaillez et donne aux gens une id\u00e9e de ce dont il s&rsquo;agit vraiment.\n<\/p>\n<p>\n  Plus votre typographie est bonne, meilleures sont vos chances d&rsquo;\u00eatre remarqu\u00e9. \u00c0 tel point que, surtout avec les logos, certaines entreprises ont laiss\u00e9 derri\u00e8re elles des images et ont fait leur logo avec des lettres stylis\u00e9es de mani\u00e8re tr\u00e8s sp\u00e9cifique.\n<\/p>\n<p>\n  Cela facilite la m\u00e9morisation des marques, l&rsquo;un des exemples les plus courants \u00e9tant Coca Cola. Il y a toute une <a href=\"http:\/\/www.coca-cola.co.uk\/stories\/the-logo-story\" target=\"_blank\" rel=\"noopener\">histoire<\/a> derri\u00e8re le logo Coca Cola, qui montre exactement comment tout est arriv\u00e9 et l&rsquo;impact qu&rsquo;il a eu sur toutes les parties du monde est assez \u00e9vident.\n<\/p>\n<p>\n  Le logo Coca Cola en est le meilleur exemple puisque vous pouvez voir exactement combien de ses \u00e9l\u00e9ments sont associ\u00e9s \u00e0 la marque elle-m\u00eame.\n<\/p>\n<p>\n  Un graphiste intelligent sait comment explorer la typographie de mani\u00e8re \u00e0 communiquer clairement les aspects visuels et verbaux du design et de la marque.\n<\/p>\n<p>\n  Maintenant, qu&rsquo;entend-on exactement par \u00ab<strong>&nbsp;aspects visuels et verbaux<\/strong>&nbsp;\u00bb&nbsp;?\n<\/p>\n<ul>\n<li>\n    <strong>Visuel<\/strong> &#8211; Le sens cr\u00e9\u00e9 par l&rsquo;apparence visuelle de l&rsquo;illustration&nbsp;; \u00e0 la fois texte et image. Le caract\u00e8re de la typographie et la fa\u00e7on dont elle vous fait sentir contribuent \u00e0 sa qualit\u00e9 visuelle.\n  <\/li>\n<li>\n    <strong>Verbal<\/strong> \u2013 Signification litt\u00e9rale des mots ou de la phrase utilis\u00e9s dans l&rsquo;illustration.\n  <\/li>\n<\/ul>\n<p>\n  Lorsqu&rsquo;ils sont combin\u00e9s de la bonne mani\u00e8re, les aspects visuels et verbaux peuvent avoir un impact \u00e9norme sur l&rsquo;exp\u00e9rience utilisateur, et d\u00e9montrer et transmettre une vari\u00e9t\u00e9 de messages.\n<\/p>\n<p>\n  Un autre exemple de logo tr\u00e8s fort avec des aspects visuels et verbaux \u00e9quilibr\u00e9s est le <a href=\"https:\/\/www.nestle.co.uk\/aboutus\/history\/blog\/posts\/kitkatnohyphen\" target=\"_blank\" rel=\"noopener\">logo KitKat<\/a>.\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-292452-6382eb12be534.webp\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-292452-6382eb12be534.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Cette \u00e9tude, <a href=\"http:\/\/sheltonography.com\/resources\/Articles\/thangaraj.pdf\" target=\"_blank\" rel=\"noopener\">ici<\/a>, montre tr\u00e8s clairement comment la typographie peut avoir un effet sur nous et comment les marketeurs peuvent l&rsquo;utiliser \u00e0 leur avantage. Cela montre que les polices utilis\u00e9es par certaines soci\u00e9t\u00e9s populaires telles qu&rsquo;IBM, Mercedes, Nivea et Marlboro sont reconnues internationalement et c&rsquo;est exactement la raison pour laquelle ces soci\u00e9t\u00e9s ont investi dans la conception et le droit d&rsquo;auteur des polices de marque.\n<\/p>\n<p>\n  Si vous ne le croyez pas, jetez un \u0153il \u00e0 l&rsquo;image ci-dessous d&rsquo;une campagne publicitaire de Greenpeace&nbsp;:\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-292452-6382eb14ec5a7.webp\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-292452-6382eb14ec5a7.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Bien qu&rsquo;il ne dise pas KitKat, votre esprit cr\u00e9e instantan\u00e9ment une connexion reconnaissable avec la marque.\n<\/p>\n<h3>\n  Effets de la typographie<br \/>\n<\/h3>\n<p>\n  Kevin Larson et Rosalind Picard ont pr\u00e9sent\u00e9 leurs d\u00e9couvertes sur la fa\u00e7on dont la typographie affecte les humeurs dans leur article, The Aesthetics of Reading, qui traitait \u00e9galement des avantages d&rsquo;une bonne typographie.\n<\/p>\n<p>\n  Voici un exemple tr\u00e8s simple, le premier de l&rsquo;\u00e9tude. Selon vous, lequel est le plus beau et le plus agr\u00e9able \u00e0 lire&nbsp;?\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-292452-6382eb16d3e85.webp\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-292452-6382eb16d3e85.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  La seule chose qui diff\u00e8re dans les deux documents est la mise en page et le placement du texte. La deuxi\u00e8me image est tr\u00e8s clairement plus facile \u00e0 lire et la plupart seraient m\u00eame ravis de la lire. C&rsquo;est net et clair, et la mise en page est largement pr\u00e9f\u00e9r\u00e9e \u00e0 l&rsquo;autre.\n<\/p>\n<p>\n  La premi\u00e8re image semble assez d\u00e9routante et presque comme si c&rsquo;\u00e9tait trop \u00e0 traiter. Cela peut vous embrouiller l&rsquo;esprit et n&rsquo;est tout simplement pas agr\u00e9able \u00e0 regarder.\n<\/p>\n<p>\n  Ces processus se produisent tout le temps dans notre cerveau et refl\u00e8tent grandement notre humeur et les choix que nous faisons par la suite.\n<\/p>\n<p>\n  De m\u00eame, l&rsquo;article teste \u00e9galement la mani\u00e8re dont un texte est \u00e9crit, y compris les ligatures, les petites majuscules, les chiffres, les caract\u00e9ristiques en indice\/exposant, etc.\n<\/p>\n<p>\n  M\u00eame les espaces entre chaque lettre, mot, phrase et paragraphe affectent votre humeur et votre productivit\u00e9 sur certaines t\u00e2ches cognitives.\n<\/p>\n<p>\n  L&rsquo;article montre que la sym\u00e9trie est bien plus pr\u00e9f\u00e9r\u00e9e que l&rsquo;\u00e9paisseur et l&rsquo;espacement irr\u00e9guliers des traits entre et \u00e0 l&rsquo;int\u00e9rieur des caract\u00e8res.\n<\/p>\n<p>\n  Ce sont tous des facteurs qui doivent \u00eatre pris en compte lorsque vous travaillez en ligne et hors ligne.\n<\/p>\n<p>\n  Cela \u00e9tant dit, il est pr\u00e9f\u00e9rable d&rsquo;avoir votre logo ou votre illustration espac\u00e9s optiquement plut\u00f4t que math\u00e9matiquement. L&rsquo;image ci-dessous montre la diff\u00e9rence entre les deux.\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-292452-6382eb18b90f5.webp\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-292452-6382eb18b90f5.webp\" alt=\"\" \/><\/a><\/p>\n<h5>\n  Humeur positive, meilleurs r\u00e9sultats<br \/>\n<\/h5>\n<p>\n  Il est \u00e9vident que plus votre illustration induit de positivit\u00e9, plus ils seront attir\u00e9s par votre marque et votre entreprise. L&rsquo;\u00e9tude ci-dessus prouve qu&rsquo;une bonne typographie am\u00e9liore \u00e9galement les performances cognitives.\n<\/p>\n<p>\n  La v\u00e9rit\u00e9 est que la typographie peut \u00e9galement avoir un impact sur le jugement. Le New York Times a men\u00e9 une \u00e9tude intitul\u00e9e \u00ab\u00cates-vous optimiste ou pessimiste? Bien que l&rsquo;\u00e9tude ait discut\u00e9 des sentiments de s\u00e9curit\u00e9 des participants lors d&rsquo;\u00e9v\u00e9nements catastrophiques, elle portait davantage sur les effets que la police de caract\u00e8res peut avoir sur vous. Et puisqu&rsquo;aucun mal n&rsquo;a \u00e9t\u00e9 caus\u00e9, peut-\u00eatre pourrait-on aussi l&rsquo;appeler \u00e9thique.\n<\/p>\n<p>\n  Les polices utilis\u00e9es \u00e9taient Comic Sans, Computer Modern, Trebuchet, Helvetica, Georgia et Baskerville. L&rsquo;\u00e9tude a \u00e9t\u00e9 men\u00e9e sur environ 45 000 participants et les r\u00e9sultats ont montr\u00e9 que les gens avaient tendance \u00e0 \u00eatre d&rsquo;accord avec la police Baskerville 1,5 % de plus que les autres.\n<\/p>\n<p>\n  1,5&nbsp;% peut sembler un petit pourcentage, mais il est suffisamment substantiel pour montrer que la police de caract\u00e8res, apr\u00e8s tout, affecte le jugement.\n<\/p>\n<p>\n  Plus vous utilisez de polices dans le m\u00eame texte, plus vous le personnalisez et plus il sera expressif et cr\u00e9atif. Honn\u00eatement, votre police de caract\u00e8res agit \u00e0 peu pr\u00e8s comme votre langage corporel et nous savons tous \u00e0 quel point le langage corporel est important. Cela peut soit cr\u00e9er un lien \u00e9motionnel entre vous et le client, soit ruiner compl\u00e8tement votre argumentaire marketing.\n<\/p>\n<p>\n  Et quand il s&rsquo;agit d&rsquo;une bonne typographie, c&rsquo;est simple \u00e0 comprendre mais pas tellement \u00e0 ex\u00e9cuter. Plus votre texte est facile \u00e0 comprendre, et il d\u00e9veloppera un fort sens du caract\u00e8re sur lequel votre public pourra se concentrer.\n<\/p>\n<h5>\n  Typographie dans la conception Web<br \/>\n<\/h5>\n<p>\n  Lors de la conception d&rsquo;un site Web, vous devez garder \u00e0 l&rsquo;esprit que vous allez probablement avoir beaucoup d&rsquo;informations dessus, c&rsquo;est donc une meilleure id\u00e9e de garder la police et le style coh\u00e9rents plut\u00f4t que d&rsquo;essayer de trop les m\u00e9langer, ce qui ne fera que \u00eatre p\u00e9nible \u00e0 lire.\n<\/p>\n<p>\n  Une bonne page compos\u00e9e indique au lecteur et \u00e0 l&rsquo;utilisateur exactement o\u00f9 commencer la lecture et comment continuer la page. Ce qui est important et ce qui ne l&rsquo;est pas n&rsquo;est pas clairement indiqu\u00e9 par des mots, mais simplement par la mani\u00e8re dont le texte est dispos\u00e9 sur la page du site Web.\n<\/p>\n<p>\n  Les couleurs sont \u00e9galement tr\u00e8s importantes et doivent \u00eatre r\u00e9duites au minimum ou seulement un ensemble doit \u00eatre utilis\u00e9 sur l&rsquo;ensemble du site Web. Trop sauter peut encore une fois, simplement confondre vos lecteurs et rendre le point du site Web ou de la page plus difficile \u00e0 comprendre.\n<\/p>\n<p>\n  De m\u00eame, ne restez pas trop simple au point qu&rsquo;il n&rsquo;y ait aucune diff\u00e9rence entre le titre et son contenu.\n<\/p>\n<h5>\n  Typographie dans le marketing de contenu<br \/>\n<\/h5>\n<p>\n  Avoir un impact sur le lecteur et appeler votre entreprise par le biais du contenu, c&rsquo;est ce qu&rsquo;est le marketing de contenu. Il est presque impossible de lire n&rsquo;importe quel type de texte sans qu&rsquo;il transmette une \u00e9motion, c&rsquo;est pourquoi il est pr\u00e9f\u00e9rable de savoir quelle \u00e9motion vous voulez transmettre, la meilleure police pour l&rsquo;\u00e9crire et tout ce qui va dessiner attention.\n<\/p>\n<p>\n  Une autre astuce \u00e0 retenir est que le <strong>gras attire l&rsquo;attention<\/strong> tandis que l&rsquo;italique n&rsquo;a pas beaucoup d&rsquo;impact sur le lecteur. Mais mettre le contenu en italique peut apporter un peu d&rsquo;\u00e9l\u00e9gance et de sophistication \u00e0 votre texte.\n<\/p>\n<p>\n  Les informations sont \u00e9galement plus faciles \u00e0 traiter lorsqu&rsquo;elles sont pr\u00e9sent\u00e9es sous forme de puces plut\u00f4t que dans d&rsquo;\u00e9normes blocs de paragraphes que, honn\u00eatement, personne n&rsquo;a le temps de parcourir.\n<\/p>\n<p>\n  Alors que lorsque vous utilisez une police de caract\u00e8res \u00ab\u00a0nette\u00a0\u00bb telle que Calibri, vous faites valoir votre point de vue de mani\u00e8re tr\u00e8s pr\u00e9cise et solide.\n<\/p>\n<h3>\n  Commencer<br \/>\n<\/h3>\n<p>\n  Eh bien, vous devez savoir exactement ce que vous essayez d&rsquo;accomplir. L&rsquo;objectif de votre projet de typographie doit \u00eatre clair. Savoir ce que vous voulez que vos lecteurs ressentent est important, puis travailler en gardant cette pens\u00e9e \u00e0 l&rsquo;esprit vous aidera \u00e0 mettre clairement l&rsquo;accent sur les \u00e9l\u00e9ments.\n<\/p>\n<p>\n  Essayez diff\u00e9rents styles de police, tailles, couleurs, soulignez le texte, mettez-le en gras, mettez-le en italique ou tout ce que vous devez faire pour qu&rsquo;il transmette cette ambiance exacte qui permettra aux gens de conna\u00eetre votre travail et non seulement d&rsquo;attirer leur attention \u00e0 premi\u00e8re vue, mais gardez-le l\u00e0 pendant un certain temps. Si vous \u00eates un profane, vous pouvez simplement essayer vous-m\u00eame un outil de cr\u00e9ation de logo et voir ce qui fonctionne pour vous et ce qui ne fonctionne pas.\n<\/p>\n<p>\n  N&rsquo;oubliez pas non plus qu&rsquo;il est tr\u00e8s important que votre texte soit lisible, m\u00eame en petits caract\u00e8res. Les caract\u00e8res doivent pouvoir \u00eatre identifi\u00e9s correctement et faciliter la lecture de votre texte sans avoir \u00e0 investir beaucoup d&rsquo;efforts pour comprendre uniquement la premi\u00e8re lettre.\n<\/p>\n<p>\n  Voici quelques \u00e9l\u00e9ments dont vous allez clouer l&rsquo;application et la compr\u00e9hension pour am\u00e9liorer vos comp\u00e9tences en typographie.\n<\/p>\n<h5>\n  \u00c9l\u00e9ments de typographie<br \/>\n<\/h5>\n<ul>\n<li>\n    <strong>Polices de caract\u00e8res<\/strong>&nbsp;: style de texte utilis\u00e9 (par exemple, Times New Roman, Calibri, Ariel, etc.).\n  <\/li>\n<li>\n    <strong>Polices<\/strong>: style sp\u00e9cifique de police, ainsi que sa largeur, sa hauteur et sa taille (par exemple, Century, taille 12, gras), souvent utilis\u00e9 comme synonyme de police de caract\u00e8res.\n  <\/li>\n<li>\n    <strong>Tracking<\/strong>: Espace entre les caract\u00e8res d&rsquo;un texte.\n  <\/li>\n<li>\n    <strong>Cr\u00e9nage<\/strong>: Semblable au suivi mais fait \u00e9galement r\u00e9f\u00e9rence \u00e0 l&rsquo;espace blanc entre les lettres et les caract\u00e8res dans un texte.\n  <\/li>\n<li>\n    <strong>Leading<\/strong>: Mesure de la distance entre une ligne de texte et les lignes au-dessus et en dessous.\n  <\/li>\n<li>\n    <strong>Longueur de ligne<\/strong>: Comme son nom l&rsquo;indique, longueur du texte dans une ligne.\n  <\/li>\n<\/ul>\n<h4>\n  En conclusion<br \/>\n<\/h4>\n<p>\n  La typographie est une forme d&rsquo;art qui se concentre sur la composante visuelle du mot \u00e9crit. Juste en le visualisant de mani\u00e8re appropri\u00e9e pour votre public cible, vous pouvez cr\u00e9er un impact inoubliable. Pour tout designer, il est crucial de porter une attention particuli\u00e8re \u00e0 la typographie et de s&rsquo;efforcer de ma\u00eetriser ses comp\u00e9tences s&rsquo;il souhaite d\u00e9velopper et am\u00e9liorer sa carri\u00e8re dans l&rsquo;industrie du design.\n<\/p>\n<p>\n  La typographie est le langage corporel et fait ou d\u00e9fait la premi\u00e8re impression qu&rsquo;un utilisateur a de votre marque.\n<\/p>\n<p>\n  Et bien, comme le dit Cyrus Highsmith, \u00abLa typographie est le d\u00e9tail et la pr\u00e9sentation d&rsquo;une histoire. Il repr\u00e9sente la voix d&rsquo;une atmosph\u00e8re ou d&rsquo;un cadre historique quelconque. Il peut faire beaucoup de choses.\n<\/p>\n<\/p>\n<div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">\n  Source d&rsquo;enregistrement: <a target=\"_blank\" rel=\"noopener nofollow\" data-pssr=\"\" href=\"http:\/\/www.instantshift.com\/2018\/01\/19\/typography-effect-on-user-experience\/\">instantshift.com<\/a>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>La typographie est un art et une technique qui gagne de plus en plus en popularit\u00e9 au fil du temps. C&rsquo;est une comp\u00e9tence cruciale que chaque designer doit avoir, quel que soit son domaine de pr\u00e9dilection. Si vous \u00eates quelqu&rsquo;un qui dirige une entreprise, veut ou est simplement un designer, la typographie ne fait pas autant parler de lui sans raison. Avec l&rsquo;aide de la typographie, vous pouvez avoir un impact durable sur vos lecteurs et utilisateurs. Bien que cela puisse sembler \u00eatre un tas de mots assembl\u00e9s pour certaines personnes, ce groupe est assembl\u00e9 de mani\u00e8re tr\u00e8s logique et technique\u2026<\/p>\n","protected":false},"author":1,"featured_media":131571,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[197,145,54],"tags":[],"class_list":["post-251616","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-creation-de-sites-web","category-trucs-et-astuces-web","category-web-et-wordpress"],"_links":{"self":[{"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/posts\/251616","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/comments?post=251616"}],"version-history":[{"count":0,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/posts\/251616\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/media\/131571"}],"wp:attachment":[{"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/media?parent=251616"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/categories?post=251616"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/tags?post=251616"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}