ホームページ > ウェブフロントエンド > htmlチュートリアル > 優れた Web サイト フッターを作成する方法 (Web サイト フッター)_html/css_WEB-ITnose

優れた Web サイト フッターを作成する方法 (Web サイト フッター)_html/css_WEB-ITnose

WBOY
リリース: 2016-06-24 12:07:07
オリジナル
1402 人が閲覧しました

多くの人にとって、フッターの作成はデザイナーが簡単に行うだけの作業です。それは簡単なようで、取るに足らないもののように思えます。多くの人は、Web サイトの下部を読む人はほとんどいないと考えており、フッター内のすべてのリンクのクリックスルー率 (CTR) が最も低いのに、なぜわざわざ読む必要があるのでしょうか。

本当にそうなんですか?以下でそれを分析してみましょう。

フッターと CTR (クリックスルー率)

CTR が低いという事実は真実かもしれませんが、それは全体像を示しているわけではありません。CTR が低いのは主に、フッターを見る人がほとんどいないという事実の結果です。そもそもフッターです。

それで、これについては私なりの理論があります。

どうやら、このテーマに関しては研究が行われていないようです(少なくとも私は見つけることができませんでした。もしあればお気軽に参加してください)いくつかのデータがあります)、ページを下までスクロールした人だけをカウントした場合、フッターの CTR は実際には非常に高いと思います。

これをさらに調べるために、CrazyEgg アカウントで簡単な数値計算を実行しました。 (スクロール マップ ツールを使用して) 私のフッターを見た人の推定数と、フッターが生成する合計クリック数を比較すると、14 パーセントから 20 パーセントの人が一度何かをクリックすることになることがわかります。フッターを参照してください (テストされるページによって異なります)。

もちろん、これはかなり小さなデータを使用した非常に単純なテストであるため、信頼できる結論を引き出すのは困難です。また、私のフッターは膨大です。画面の 55 ~ 60% なので、何かをクリックせずにはいられません。とにかく、欠点はあるものの、結果は依然として非常に興味深いものです。

レッスンは簡単です…

フッターは重要です。

フッターを適切に素晴らしいものにするためにできること

1. フッターを SEO ゴミ箱として扱わないでください

フッターにキーワード リンクを使用してランキングを上げようとする人がいます。そして、それが難しいことは私も知っています。抵抗するのは簡単すぎますし、リンクは場違いにさえ見えません。しかし、これは 2014 年には絶対に避けるべきです。主な理由は、Google がフッターを認識してリンクに名前を付けるのはそれほど難しいことではないからです。 SEO の価値が低いです。

全体のやり方は 2008 年並みか、それよりもひどいです。

実際、ランド フィッシュキンがこれが効果的ではないと話していたのは 2008 年のことでした。

2. 階層を導入する

常にいくつかの要素があります。は他のものよりも重要であり、フッター内の配置、スケール、配置を通じてこの考えを強化する必要があります。

たとえば、Smart Passive Income にアクセスすると、オプトインしてもらうことが最も重要であることがわかります。パットの目標。サイトの各ページのフッターは大きな購読ボックスで始まります。

その後、追加のリンクと開示が続きます。

重要なものから始めて、次に続けてください。その他すべて。

3. コンバージョンを獲得するために最後にもう一度試してください

オプトインといえば、最近では、誰かにオプトインしてもらうことが最も人気のある Web サイトの目標の 1 つであり、サイト所有者はそのためのほぼすべてのことを喜んで実行します。

正直に言って、それを責めるのは難しいです

それは、個々のケースでのコンバージョンが何を表すかに関係なく、それを活用してください。チャンスです。あなたのサイトの主な目標はあなたの責任です。

たとえば、これは Codeinwp.com のフッターです。私が所属している PSD から WordPress へのサービスを提供する会社です。フッターは巨大で、主な目標が 1 つあります。 ? 人々に自分のデザインを提出してもらい、それを実用的な WordPress テーマに変えてもらうためです。

4. ホワイトスペースを使用する

ホワイトスペースは現在、非常に過小評価されています。フッターにさらに強調を加えて、リンクをより目立つようにする他の簡単な方法はありません。

例については、ここで下にスクロールしてフッターを確認するだけです。

5. 試してみましょう。 「著者について」ブロック

単一著者のサイト/ブログをデザインしている場合、多くの場合、利用可能なスペースを使って素敵な「著者について」ブロックを表示することをお勧めします。

さて、ここでの目標はCTR が増加することはありません。ユーザーが作成者ブロックをクリックすることはめったにありません (少なくとも私のテストでは) が、現時点でどのページが表示されていても、作成者が誰であるかを明確にすることができます。仕事を残すから:

6. 必須のリンクを忘れないでください

次のリンクのいくつかがないフッターを想像するのは非常に困難です:

  • 概要
  • 連絡先
  • ホーム
  • ブログ(ある場合)
  • それらが不可欠である理由は簡単です。長年にわたり、人々はそれらのページをフッターに表示することに慣れてきました。それは慣習となっており、それを破ることが報われることはほとんどありません。

    フッターで言及する内容を選択するときに、次のことを自問するのが良い方法です。

    視聴者はフッターにこのリンクが表示されることを期待していますか? ?

    7.ソーシャル メディアのリンクを表示します

    ソーシャル メディアとフッターの最も一般的な 2 つのアプローチを次に示します:

  • デフォルトのボタンを使用します。たとえば、Facebook の「いいね!」ボタンを取得するには、開発者エリアのこのセクションに移動します。公式な性質のため、効果的になる傾向がありますか?人々はそれらに非常に慣れており、それを見たときに何をすべきかを正確に知っています。
  • いくつかのカスタム ボタンを使用します。同じ CTR を持たない場合もありますが、特に少数のボタンを表示しようとする場合は、これらのボタンのクリックを常に最適化する必要はありません。 TechCrunch を見てアイデアを得る:
  • 8.サブフッターの使用を検討してください

    サブフッターは、メインのフッター領域の後に来る部分です。これは、さまざまな法的リンクや、必ずしも人々にクリックしてほしくないその他のものを表示するために最も一般的に使用されますが、操作の一部を規制および開示します。

    私が話しているのは、プライバシー ポリシー、規約、収益などです。開示、著作権条項、DMCA など

    SugarSync.com からの例:

    9.社会的証明、バッジ、安全シールを紹介します

    作業しているサイトのビジネスの種類によっては、追加の社会的証明を表示すると、サイト全体の信頼性を高めることができます

    Pat をもう一度見てみましょう。 Flynn のサイトで例を取得します (今回はホームページです):

    これらの会社のロゴはクリックできず、さらにコントラストが非常に低いです。しかし、実際にはそれ以上は必要ありません。ロゴは社会的証明を提供するためにあり、あまり注目を集めるためではありません。

    10.最高のコンテンツへのリンク

    これは、ブログやオンライン出版サイト全般でうまく機能します。ビジネスサイトや製品サイトではそれほど多くはありません。

    主な考え方は、人気のあるコンテンツには通常、人気があるのに理由があるため、それをフッターに表示することで読者数をさらに向上させることができるということです。

    これは単純なルールですか?すでに人気のあるものの人気を高めることは、そうでないものの人気を高めるよりもはるかに簡単です。

    newInternetOrder.com による例:

    11.フッターを「マスター ナビゲーション」に変えることには注意してください

    これは、まさにこのリストの最初の項目に戻ります。フッターを SEO のゴミ箱として扱います。

    フッターは SEO のゴミ箱でも、マスター ナビゲーションでもありません。

    フッター内のすべてのリンクを詰め込むべきではありません。これは読者に良い影響を与えません。

    より良いアプローチは、カスタム アーカイブ ページを作成し、フッターからそのページにリンクすることです。そうすれば、読みやすく明確なフッターが残り、誰かが特定のリソースを見つけたい場合は、アーカイブから検索できます。

    あなたのフッターはどうしたのですか?

    正直に言うと、いつこの投稿のデータを収集して書いたところ、自分のサイトで使用しているフッターに少なくともいくつかの問題があることがわかりました。そこで私の質問は簡単です。フッターのどこが間違っているのでしょうか?そしてもっと重要なのは、それを修正するために何をしますか?

    ソース:php.cn
    このウェブサイトの声明
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
    人気のチュートリアル
    詳細>
    最新のダウンロード
    詳細>
    ウェブエフェクト
    公式サイト
    サイト素材
    フロントエンドテンプレート