ウェブデザイン101:タイポグラフィーが変換にどのように影響するか

ウェブデザイン101:タイポグラフィーが変換にどのように影響するか
この話はもともとKISSmetricsに掲載されました。 インターネットのマーケティング担当者として、転職は私たちのパンとバターです。リンク先ページを最適化する方法を熟考して時間の大部分を費やすことを保証できます。コピーやデザインのようなものは、私たちが一緒に遊ぶのが好きな明白な機能です。 しかし、しばしばコンバージョンに及ぼす影響が過小評価されている要素が1つあります。 私はタイポグラフィーについて話しています。 あなたのランディングページを考えてみましょう。パワフルな見出しと、コピーのすべての重要な要素を完全に例示するデザイン構造があっても、実質的なコンバージョンが見られない場合は、この記事を最後までお読みください。 タイポグラフィとは何ですか? 簡単に言えば、タイポグラフィはアートがテキストと出会う場所です。タイプの配置を指します。それは15世紀半ばの可動型の発明の後に始まりました。タイポグラフィーは、テキストに個性とスタイルを追加するためのツールです。 訪問者があなたのセールスページまたはランディングページを開いたとき、最初に起こるのは、ページ全体で 見る ことです。彼らは情報

この話はもともとKISSmetricsに掲載されました。

インターネットのマーケティング担当者として、転職は私たちのパンとバターです。リンク先ページを最適化する方法を熟考して時間の大部分を費やすことを保証できます。コピーやデザインのようなものは、私たちが一緒に遊ぶのが好きな明白な機能です。

しかし、しばしばコンバージョンに及ぼす影響が過小評価されている要素が1つあります。

私はタイポグラフィーについて話しています。

<!ほとんどのマーケティング担当者にとっては未知の話題ですが、マーケティングの重要性は科学的に証明されています。この記事では、タイポグラフィーの世界と変換に影響を与える能力について深く見ていきます。

あなたのランディングページを考えてみましょう。パワフルな見出しと、コピーのすべての重要な要素を完全に例示するデザイン構造があっても、実質的なコンバージョンが見られない場合は、この記事を最後までお読みください。

<! - 2 - >

タイポグラフィとは何ですか?

簡単に言えば、タイポグラフィはアートがテキストと出会う場所です。タイプの配置を指します。それは15世紀半ばの可動型の発明の後に始まりました。タイポグラフィーは、テキストに個性とスタイルを追加するためのツールです。

訪問者があなたのセールスページまたはランディングページを開いたとき、最初に起こるのは、ページ全体で

見る ことです。彼らは情報の提示方法、テキストの見た目、文字の大きさ、線の長さなどをスキャンし、無意識のうちに自分のウェブサイト上の問題を解決する可能性を無意識に判断します。あなたのページに単語が表示されます。それはすべて数秒で起こります。私たちは皆それをやる! <! - 3 - >

タイポグラフィーを理解することができます。これは、読者があなたが伝えようとしている情報を把握して理解しやすくするためのツールです。

タイポグラフィの主要要素

タイポグラフィの技術を構成する要素はいくつかあります。主な要素を見てみましょう:

書体

  1. - 書体はフォントと同じではありません。これは、同じデザインを共有する文字、文字、数字のグループを指します。たとえば、Garamond、Times、Arialはフォントではなく、フォントであり、よくある誤解です。 フォント
  2. - 幅、サイズ、および重さが設定された書体の特定のスタイル。たとえば、ジョージアは書体です。 9pt Georgia Boldはフォントです。タイプデザインコミュニティの人々は、フォントが配信メカニズムであり、書体が創造的な作業であると考えています。 行の長さ
  3. - 1行の左右の余白の間にあるテキストが占める距離を指します。 リーディング
  4. - ベースライン(文字が並んでいる行)の間のスペースで、ポイント単位で表されます。 カーニング
  5. - この用語は、個々の文字または文字の間の空白を指します。多くのフォントには、文字間のスペースをより自然に見せるのに最適なデフォルトのカーニング値が付いています。 トラッキング
  6. - 文字間隔とも呼ばれ、文字の範囲全体にわたって均一にスペースを調整するために使用されます。追跡は、通路の文字の密度に影響を与える可能性があります。 タイポグラフィーはなぜ重要なのですか?

個々の手紙があまりにも近く、書体のサイズが小さすぎたり、単語が近くにあるために、ある単語を他の単語と区別することが難しいと思われる場合は、コピーを読むのが難しい場合は、 2つの方法のうちの1つで行動する。

彼らは退去してコンバージョン率を低下させるか、またはコピーを通って苦労し、疲れているため終了に至らない可能性が最も高いです。その後、訪問者が覚えているのは、あなたが渡そうとしているメッセージではなく、そのコピーを理解するために必要な努力です。

タイポグラフィは、情報の理解と把握のプロセス全体を楽にすることができるため、重要です。活字的に整形されたコピーは、内容を読むのに必要な努力ではなく、コンテンツに焦点が当てられていることを保証します。

人間がウェブをどのように読んでいるかを調べると、読書パターンがはっきりと分かります。このパターンは変更できますが、ビジュアル階層の助けを借りてのみ変更できます。タイポグラフィは、重要な要素をサイズ、色、またはスタイルで目立たせることで、視覚的な階層を作成するのに役立ちます。たとえば、利益や製品の機能を紹介する優れた方法は、弾丸です。

完璧な視覚的階層を創造する芸術を真に習得するためには、人々がどのように情報を組織し、知覚するのかを最初に理解する必要があり、ゲシュタルトの知覚の原則がこれをうまく説明します。

人間として、私たちはすべてを整理するのが大好きです。この習慣は、人間の心の中に無生物の顔を知覚するように夢中になっています。ゲシュタルト理論によれば、人間は視覚的要素を5つのコンテキストに基づいてグループにまとめると述べている:

類似性

  1. 継続
  2. 閉鎖
  3. 近接
  4. 図と地面
  5. 例えば、あなたのコピーのゲシュタルトの理論では、相似の原則を使用してページ上のすべての要素を視覚的に似ていますが、行動を促す言葉を除いて、あなたはそれを際立たせることができます。

テキストを整理するとき、情報を保持するための認知プロセスを容易にすることが目標です。あなたは、&ldquo;パーツ&rdquo;最も注目を必要とするものは顕著である。

リサーチ・ショーは何をしていますか?

2012年7月、Errol Morrisは

The New York Times というタイトルで&ltdquo;の実験を行いました。あなたは楽観主義者ですか、悲観主義者ですか? &rdquo;読者にはDavid Deutschの本 「無限の始まり 」の一節がありました。この後、読者にDeutschの主張を支持しているかどうか、そして彼らの答えにどれくらい自信があるかを尋ねる2つのイエスかノーの質問が続きました。ここに興味深い部分があります。 Morrisは、Deutschの主張について、あるいは彼らが楽観主義者であるか悲観主義者であったかについて、人々が考えていたことに興味はなかった。彼は実際に、書体が提示された情報を人々がどのように知覚するかに影響するかどうかを知ることに興味を持っていました。言い換えれば、書体が書かれたテキストの信頼性に影響を与えることができますか?

40,000人の参加者が気づいていなかったのは、すべてが同じパッセージで提示されていたのとは違った書体の中にあったということでした。この実験では、Baskerville、Helvetica、Comic Sans、Computer Modern、Georgia、Trebuchetの6種類の書体を使用しました。

その結果、Comic Sansの発言は、最も高い意見の相違に影響を与えたことが示されました。 Helveticaはそれほど遅れていませんでした。彼らは読者と信憑性の要素を発することに失敗した。

結果は、人々がBaskervilleで発表されたときに、その声明に同意する可能性がより高いことを示した。

インターネットマーケティング担当者のための教訓

ここで、前述のクイズの作成を手伝った心理学者David Dunningは、なぜBaskervilleが勝ったのかを述べなければならなかった:

&ldquo;フォントは異なる性格を持っています。あなたがBaskervilleについて言うことができるのは、それがもっと正式であるか、より正式に見えるということです。 &rdquo;

あなたの販売ページを見てください。あなたのフォントはあなたが描写しようとしているメッセージを正しく反映していますか?あなたのニッチを考えてみてください。あなたの聴衆は正式なトーンを必要としますか?もしそうなら、あなたのフォントの設定はどれくらいうまくいきますか?

文字サイズは重要ですか?

フォントサイズが重要かどうかを調べるために、Usability Newsのマイケル・バーナード(Wichita State Universityのソフトウェアユーザビリティ・リサーチ・ラボラトリー製)は、Courier New、Georgia、Arial、Century Schoolbook、Times Newローマ、コミックサン、タホマ、ヴェルダナ。それらは、10,12、および14ポイントのサイズで分析した。この研究には合計60人の参加者がいた。

ここで彼らが見つけたのは:Verdana、Arial、Comic Sansは、それぞれ10,12、および14ポイントのサイズで最も好まれたフォントでした。

TimesのテキストNew RomanとArialは一番速かった。データでは、より大きな書体が読み易いことが示されたとしても、その結果は統計的に有意ではなかった。

この調査では、ArialとCourierが最も読みやすい書体であり、Comic Sansが最も判読不能な書体であることが示されています。さらに、Tahomaは10ポイントの大きさで、Courierは12、Arialは14で最も読みやすいとされています。Serif vs. Sans Serif Debate

研究の範囲では、serifまたはサンセリフが良いです。しかし、一般的なコンセンサスが得られる限り、オンラインでの読書に関しては、小文字の書体は小文字であってもシンプルで読みやすいため、読みやすいです。これは、書体を解読するよりも、メッセージに集中して時間を費やすことができるということです。

タイトルとサブタイトルのコピーとセリフのボディには、サンセリフがおすすめです。

読者の気分と認知能力に及ぼす影響

Dr.MicrosoftのKevin LarsonとMITのDr. Rosalind Picardは、タイポグラフィが気分や認知能力に影響を与えるかどうかを調べました。研究は2つの部分に分けられ、3つの異なる測定が行われた:相対対象期間、リカートスケール、および認知課題。

この研究には20人の参加者がいましたが、そのうちの半分は良いタイポグラフィでテキストを取得し、残りの半分はタイポグラフィーが悪いテキストを取得しました。研究の最初の部分では、相対的な被験者の持続時間について、良好なタイポグラフィを有するテキストを得た参加者は、3分の読書時間を過小評価した。研究の第2部では、参加者が読書セッションの17分に中断されたとき、彼らは5分21秒の時間を過小評価した。

これは、パッセージが書式的に整形されているときに、人々がその人物に夢中になったので、読書に費やした時間を過小評価していることが分かりました。次に、彼らはリッカート尺度を与えられました。研究の最初の部分では、リカート尺度は統計的に有意な結果をもたらさなかったが、研究の第2部分では、尺度は良好な捺染法を支持することが判明した。最後は認知課題であり、これは研究の2つの部分で異なっていた。最初の部分では、参加者にはろうそくの問題が与えられ、2番目の部分では遠隔の関係者のテストが与えられました。キャンドルの問題では、良いタイポグラフィーグループの参加者のうち4人がテストをうまく完了したが、貧しいタイポグラフィーグループの参加者は0人でした。

リモートアソシエイトタスクでは、優れたタイポグラフィグループの参加者はタスクの52%を6395msの平均速度で完了し、貧弱なタイポグラフィグループの参加者はタスクの48%を6715msで完了しました。

認知課題における優れたタイポグラフィグループの成功は、人々が良い気分に陥っていることが原因である可能性があります。

より良い変換のために適切な書体を選択する方法

表現力が有用性に影響を与えないようにします。その&ldquo;をクリックするフォント&rdquo;私たちは非常に多くの品種が提示されており、キャンディストーリーのようなものです。しかし、複雑な書体は必ずしも読みやすいとは限りません。はい、彼らはきれいに見えるかもしれませんが、かわいいと売り上げが必ずしも同じではありませ

選択した書体は、それを圧倒するのではなく、テキストを補完するものであることに注意してください。あなたのコピーを読んだら、人々はあなたのメッセージを覚えていなければなりません。

書体のペアリングについては、対応とコントラストという2つの原則で行うことができます。

対応の原則では、読者が潜在的に2つのフォントを比較するのを防ぐのに十分なほど類似している2つの書体をペアにして、情報を消費することを第1の目的としています。たとえば、HelveticaとArialです。

コントラストの原則では、異なった2つのタイプフェイスをペアにし、ほとんどの面でコントラストが得られますが、少なくとも1つの共通の特性を共有することによって、互いに補完し合います。

  1. バラエティは良いですが、外に出ないでください。あなたのコピーはあなたのお気に入りの書体の表示であってはなりません。シンプルさが重要です。
  2. 完璧な書体を見つけるには、あなたのニッチとあなたの聴衆を調べます。書体は正式であるか非公式である必要がありますか?もっと大きくする必要がありますか?答えは、必要に応じて簡単な市場調査を行うことで見つけることができます。しかし、あなたが20/20ビジョンを人々に与える製品を販売している場合、ほとんどの場合、ターゲットオーディエンスは視覚障害のある人で構成されます。したがって、この場合、シンプルな大型の書体を使用するのは簡単なことではありません。
  3. あなたのテキストを見やすく読むことができる書体を選択してください。それを行う1つの方法は、大きいカウンター(全体または部分的に囲まれた文字の領域)を持つ書体を選ぶことです。

すべての単語、またはあなたのコピーのすべての単語の最初の文字を大文字にしないでください。人々がオンラインで読むテキストの90%は小文字です。

行の長さに関しては、目を絶えず移動する必要があるため、読みにくくなりすぎるので、短すぎないようにしてください。一方、長すぎる行は、読者が次の行を見つけるのを困難にする可能性があります。

  1. 正しい密度の文字間隔を最適化して、単語が窮屈にならないようにし、混乱させてしまいます。
  2. タイポグラフィは重要です。スティーブジョブズもそう思った!
  3. そして、私は今日フォントを選択する理由がある人であるSteve Jobsについて話をしなくても、この記事を終わらせることができます。
  4. 概要
  5. インターネットマーケティング担当者にとって、最も重要なことは、コピーを補完して強化するためにタイポグラフィを使用することです。適切に実行されると、適切な感情、気分、さらには訪問者のコンバージョンを達成するために必要なアクションが発生します。
  6. もちろん、タイポグラフィの有効性をテストするにはA / Bテストが最適です!コンバージョンにつながったリンク先ページが既にある場合は、異なる書体の間でテストして最適化を次の段階に進めてください。テストは行く方法です!