2018年12月3日11分

ウェブデザインとスキミング:Webデザインでサイトが変わる

更新日2023年7月25日

私たちは今、革の旗の時代に生きています。あなたが自分のソーシャルネットワークのフィードを経由して移動しているか、少し考えてみてください。または、あなたはこの記事(あなたは人々が知覚していないことを言いましたね?)インターナショナリズムが急速にコンテンツに浸透していく中で、読者が本当に読む速度を落とし、サイト内のすべてのコンテンツを吸収するようになるにはどうしたらよいでしょうか?この目標を達成する方法を理解するために、少しインターネットを離れて、歩行者を虜にしている素晴らしい広告キャンペーンの事例研究をご覧ください。

米国の様々な都市で、RXBARという栄養ドリンクを宣伝する巨大なポスターが登場した。Wieden+Kennedy社が制作したこの宣伝用ポスターは、まったくもって素晴らしい。例えば、「COMIDA」というタイトルの下にある死体のイメージのように。また、ノバ・イオルケの中心部には、このように書かれた電光掲示板がある:「タイムズ・スクエアのRXBARは、ほとんど受け入れられません」。このキャンプはデザイン面でも注目されている。しかし、このような大げさな広告が本当に素晴らしいのだろうか?

その回答は、私たちのオリーブオイルが毎日大量のマーケティングを吸収するために必要なものです。私たちは、常に、そのような大量のマーケティングを吸収しているのです。Wieden+Kennedyのキャンペーンは、このような傾向を表している。彼らは、私たちが期待している宣伝戦略を彷彿とさせるような、ディジェクティブなコンテンツを提示する。超合理的な文章と斬新な切り口で、人々は自分の発言に耳を傾け、耳を傾けるようになる。

バーチャルの世界に移っても、これはあなたが訪問者に与えたいのと同じ種類の効果です。また、あなたが自分のページで発信しようとしているメッセージを、本当に多くの人が吸収するようにするにはどうすればよいのでしょうか(もちろん、あなたがオンライン上で魅力的なプレゼンテーションを作成するために費やした労力を評価されることを望んでいることは言うまでもありません)。あなたのアイデアを伝えるには、訪問者がサイト内を回遊するように誘導し、長い道のりの中で最も重要なポイントを紹介するために、さまざまなデザインテクニックを活用する必要があります。この記事では、"スキミング "と呼ばれる読解のテクニックがどのようなものなのか、また、スキミングがサイト内でのユーザーの体験にどのような影響を与えるのか、さらに、ページ全体にわたってスキミングを続ける読者が情報を読み返すためにウェブデザインをどのように活用できるのかについて説明します。

スキミングとは何か?

ニールセン・ノーマン・グループのヤコブ・ニールセンは、インターネットがまだ "完全なもの "であった1997年頃、インターネットによる読書の最も重要な原則のひとつを明らかにした:それは、"Ninguém lê "である。この結論は、調査対象の79%のユーザーが、インターネットに掲載されている資料に「目を通す」だけしか費やしていないことを知ったからである。

インターネットは当時から大きく変わった。しかし、これらの資料を読む方法は、それほど大きくは変わっていない。現実には、私たちは文章を一字一句読む能力をますます失っている。そのため、「スキミング」と呼ばれる読解法(文章中の文字列を通過させるだけの読解法)があります。しかし、あなたは、可能な限り迅速な形式ですべてのものを読み取るためにそうしていたときに、学校の時代を思い出してください。デジタル版もまったく同じだ。このような読み方とは、あるページを素早く通過するために、特別な単語を探し、自分の感覚に合う要素だけに集中する方法を指します。

インターネット上でのこのようなナビゲーションがなぜ一般大衆の間でこれほど優勢なのかについては、多くの研究がなされている。マリアンヌ・ウルフ教授は、このテーマについて多くの論文を書いているが、インターネットを利用する時間の長さ(2017年の成人の平均は1日約6時間!)が、私たちの脳の神経を変化させていると論じている。彼女は、私たちは印象的な資料の読書体験からますます遠ざかっており、その処理にはより多くの時間が必要であると主張している。インターネットでは、私たちの脳がそうならないように、私たち自身の手で階層構造を構築する最新のビジュアル・デザインと、コンテンツが提供されます。

このことは、自分のメッセージが大衆に届くことを確信したいサイト提供者にとっては、現実的に困難なことです。幸いなことに、インターネット上で人々がどのように情報をやりとりしているかが、ますますわかってきています。例えば、文章を読むときに、文字列を探したり、文字列から目を離したりするような、ある種の読書法を使うことは、あまり知られていない。また、眼球運動の研究では、サイト訪問者が「Z」(視覚ベースのサイト)または「F」(テキストベースのサイト)に従って文章を読む傾向があることが示されている。このページでは、これらのテクニックをウェブデザインに取り入れることで、より多くの人に読んでもらえるような戦略を立てる方法を紹介します。

Z教材デザイン

このスタイルは、視覚的要素の少ないページや、ボタン、フォーム、小さな説明文などの視覚的要素が多い入口ページ(ランディングページ)に特に適しています。もしそれがあなたの求めるものであれば、あなたのコンテンツをZの形に変換する方法について学び続けてください。

Zのレタリングは、上部のカントから始まり、下部のカントで終わり、サイトの訪問者のために作成したフラックスの各エタパスを通過します。挨拶をしてZフォーマットに移行する前に、まず、どのような情報を含めるかを決定する必要があります。その決断をするために、訪問者がサイトにアクセスした最初の瞬間を思い出してください。

  • 訪問者の視線を即座に集めるには、ページのどの要素が必要ですか?
     

  • リストアップした要素のうち、重要な順番は?1番目、2番目、3番目、そして最後に登場するのは?
     

  • あなたのページが指示する最終目標は何ですか?Zの最終目標を達成するために、あなたが望むことは何ですか?商品の購入やウェビナーへの登録など、具体的な目的を入力してください。

この3つの質問に答えると、自分の考えをデザインに集約することができます。

Z パッドトップ:この最初の水平線は、キャブサルの位置です。ライターの音声がまず横のカントへ誘導されたら、ロゴを配置するのに最適な場所です。ロゴがない?Wixのロゴ作成ツールで解決できます。あなたのビジネスに関するいくつかの質問に答えるだけで、すぐにパーソナライズされたプロフェッショナルなロゴを受け取ることができます。これは、訪問者に瞬時に魅力的な印象を与え、自社のアイデンティティを向上させる方法です。

あなたのロゴはすぐに、そして確実にローカルに配置され、あなたはあなたの方向へ誘導することができます。あなたのネゴシアンについて、訪問者がロゴを認識することが最も重要であるとお考えですか?Seu slogan?Links para as redes sociais onde você tem uma forte presença?あなたのミスについての簡単な宣言?

また、トップページにあるこのレストランは、メニューを置く場所にもなります。多くのページを持つ伝統的な形式であっても、長い長いサイトであっても、訪問者に必要な情報を提供することは、訪問者の生活をより豊かにします。ただし、入り口ページ(ランディングページ)が小さい場合は、メニューの一部を表示することも可能です。逆に言えば、このナビゲーションの要素は重要です。

訪問者は、多くの場合、トップページのナビゲーションオプションを簡単に見つけることを望んでいます。お気に入りの写真を購入するなど、特別な目的でサイトにアクセスした場合は、トップページを確認して、ギャラリーやバーチャル・ショップへのリンクがあるかどうかを確認することをお勧めします。サイト内のすべてのコンテンツをバランスよく整理し、次のようなさまざまなカテゴリに整理してください:商品コレクション、"Sobre"ページ、よくある質問とFAQ、バーチャル・ショッピング・センター、"Contato "ページ、その他あなたのビジネスに関連すると思われるページ。

Zパッドの対角線:この線は、上部の縦方向から下部の横方向に向かって表示され、四角形のエスカレーターのように機能します。この機能の目的は、訪問者がトップページのどこにいるのか、そして、あなたが確認し続けたい場所まで、訪問者を素早く移動させることです。あなたがこのスペースに入るためには、訪問者の注意を引く必要があります。そうすることで、訪問者はZの最終目的である、前述した目的を達成するのに十分な時間、関心を持ち続けることができます。

魅力的な動画の背景やインタラクティブなギャラリ-、または観客を魅了するアニメーションなど、ビジュアル要素をページに取り入れることは、それを達成するための最も重要な方法です。これらの要素はどれも、自分のビジネスがどのようなものであるかを示すものである。もしあなたがカフェを持っているのであれば、カフェの粒が小さく見えるような背景は、あなたがどんな人なのかを瞬時に伝えてくれます。斜めに配置することも可能で、その場合は、訪問者をページの長さ方向に誘導し、最終的な目的地に到達させることができます。

Zパッドの最終調整:これで、目的に向かってボールを浮かせる準備が整いました。この文字書式の最後の水平線は、あなたの "注文 "を確認するための最終調整と同じです。このように、ここに掲載する情報は、訪問者が信頼を寄せる前に抱くあらゆる質問に答えるという二重の目的を持つものでなければなりません。このコース・トレンチのアイデアとしては、自社製品の利点を強調する簡潔なテキストや、ファンタジックな評論、あるいは自社の「歴史」についてのちょっとしたフレーズを添えた小さな小冊子を使うことです。

今、あなたは、説得力があり、興味深い情報によって、あなたのZの道を歩んでいます!訪問者は、レターの最後まで読んでくれたはずです。今こそ、あなたのCTAを表示する時です。このCTAは、ニュースレターへの登録、商品の購入、関連商品のダウンロード、予約など、さまざまな形で利用することができます。あなたが選択する質問は、あなたの会社の目的と一致している必要があります。

どのようなCTAを選択するにしても、どのような形で質問を投げかけるかが重要です。ページの他の部分とは対照的な太い角や、"pedido "をクリックするためのボタンやフォントのようなデザインの効果を利用しましょう。デザインの観点からこの課題に取り組む方法については、本当にコンバージョンにつながるCTAフォントの最適な組み合わせのアイデア、デザインの原則をサイトに適用する方法(特に#2!)の完全ガイドをご覧ください。このパスを達成するために、あなたは訪問者にこれらの時間を指示する必要があります。H.H.の時間だけで、訪問者たちが戻ってくることはありません。

最後までよく頑張った!とはいえ、Zフォームだけでは不十分です!入口ページ(ランディングページ)に複数のセクションがあったり、CTAをいくつか(例えば、企業が提供する4つのサービスそれぞれに1つずつ)挿入したい場合は、最初のZの最後にこのフォームを追加するだけです。訪問者を最初から最後まで飽きさせないようにするには、視差効果によってページに活気を与え、訪問者がページを回り続けるようにすることができるかを調べてみてください。

資格取得のためのデザイン F

もしあなたがブログを作ろうと決めたり、自分のページが自然にたくさんのテキストで埋め尽くされたりするのであれば、このデザインパッドはあなたのためにあります。誰かが自分のページにFの文字を書いたと想像してみてください。行の長さに含まれるエリアは、本文中で最も重要な情報やフレーズを挿入する場所です。訪問者のコンバーターや、自分の仕事に妥協しないライターになるための秘訣は、自分の言葉がどこに向かっているのかに注意を向けることです。あなたのホームページを飾るために心に留めておくべきいくつかの原則をご覧ください:

F見出しの水平線:訪問者にそのページで何を見つけたいのか、そしてここに来る価値があるのかを素早く説明するために、見出しとサブタイトルを作成することが重要です。F "の書式のトップは、一般的に、自分の名前と自分の画像を探す場所であり、その上の2番目の行は、多少なりとも、テキストより少し離れたサブタイトルを入力する場所です。これは、あなたが自分のブログの記事や次の記事を書式設定していることを意味します。H1やH3のタイトルは、読者の興味を引くだけでなく、サイトのSEOを大幅に向上させることができ、Google の検索インデックスからテキスト全体が検索されやすくなります。

この構造は、このページの冒頭の2つの写真があるエリアにおいて、大きな意味を持つ。そのため、訪問者がページの長さ方向にエスクローダで移動しているエリア内に直接配置する必要があります。この順序の最後に到達した時点で(あるいは、2つ目の段落の最後が、その段落の最後に到達した時点で)、自分の "gancho "を含めることができることを、自分の記事のタイトルや、自分の記事の冒頭部分で証明すること。

Zの場合、訪問者がCTAにたどり着くまで、この書式の長さを維持するために、文字列の各部分が使用されたことがわかりますか?このように、"F "形式の水平方向の2つの平面は、同じ目的を達成するために使用されています。

Fページの垂直方向:ページ上部の水平方向の長さをすべて確認した後、読者は自然に垂直方向から下へ移動し、左側のはしっこを離れます。私たちの仕事は、このスペースを、そのページからはみ出るような興味深い要素で埋めることです。そうすることで、読者が瞬時に読むリズムを止め、本当に最後までフレーズを読み続けることができるのです。

そのために使えるいくつかの戦略をご覧ください。

  • パラグラフ、タイトル、マーカー付きリストで、単語をチェックすることができます:読者が自分の言いたいことを理解するために文末まで読み続けることを妨げない。例えば、"Receitas veganas para experimentar e-casa" は、"Experimentes these receitas em-casa para a boa culinária vegana" よりも説得力のあるサブタイトルです。2つ目の選択肢では、あなたは非常に高いところからアプローチし、あなたの読者が、あなたが言いたいことを理解するために、最後までチェックをすることは、非常に小さな挑発的である。このような、より聴きやすい読者には、このような読書は勧められない。

  • 書式要素:文章や画像、記号や数字によるリストなど、スタイル・エレメントをコンテンツに挿入してください。また、これらの要素は、ページ全体を囲み、また、ページの長さを通過する際に、読者を呼びやすくするための目印にもなります。もう一つの簡単な方法は、数字を文字で入力する際にアルガリズムを使うことです。アルファベットの文字との対比は、テキストを際立たせ、注意を引くためのもう一つの方法となります。

F言語を使用する際に考慮すべき原則:オンライン上で文章を書くのに必要な容量は、簡潔なフレーズのみです。その理由を理解するためには、Twitterの文字数の限界や、フィードに投稿された記事を見たときにどのような印象を受けるかについて考えてみましょう。Twitterを利用する際には、この原則を念頭に置いてください。情報はアクセスしやすく、理解しやすいものでなければなりません。自分の言いたいことを理解するために、読者に努力や努力を要求することは、読者を捕捉するための最善の策ではありません。

私たちは、あなたの会社が行うことは決して単純なことではないと理解しています。もちろん、自社の製品やサービスを読者に提供するために、自社のアイデアの質を下げる必要はありません。ただ、多様性を持たせるために、無限のフレーズで読者を視覚化するのではなく、別の方法を探す必要があるということです。より詳しく紹介したいアイディアがある場合は、そのアイディアを関連する他の情報(例えば、あなたが以前に書いた他の記事や投稿へのリンクを追加する)に関連づけるか、または理解度を高めるために画像やインフォグラフィックを使って文章を補完してください。また、訪問者が絵文字やコメントで祝福してくれることもあります。

あなたは自分のページでZまたはFの適切な書式ですべてのコンテンツを設定しました。今はどうですか?まず、読みやすさテストツールのようなツールを使って、あなたの文章の読みやすさを評価しましょう。次に、友人や家族、同僚など、信頼できる人に更新されたサイトを送り、フィードバックをお待ちしていることを伝えましょう。その際、自分のページで最も注目されている人物にすぐに投票するようにしてください。そのリストを、訪問者の心をつかむと期待される要素を元のプランと一致させてチェックし、期待される結果を得るために調整を行いましょう。そして、今、その準備が整った!

探検家であるインターナショナーたちが、夢中になって読むように。 今すぐこのデザイン・パッドをあなたのサイトに適用してください。!

エクイップ・ウィックス

#dicasdewebdesign #ディカスパラブログ #Psicologia