Webデザインはここ数年で劇的に変化しました。
そして、今日でも存在するウェブサイトデザイン技術のいくつかは、変換を妨害しています。
彼らはあなたの回心を殺している偽物です。
あなたのウェブサイトは美しくなければなりませんが、機能的でもあります。あなたは両方の世界の長所を持っている必要があります。
しかし、多くのマーケターは依然として、(コンバージョンを促進するのではなく)見栄えを良くするという1つの目的にしか役立たない設計手法を使用しています。
しかし、それらは機能しますか?美しくデザインされたウェブサイトは、変換されなければ意味がありません。
あなたのサイトはこれまでに作られた最初のウェブサイトの1つのように見えるかもしれませんが、それが変換される限り、あなたは幸せでなければなりません。
そして残念ながら、多くのマーケターは、コンバージョンにどのように影響するかを考えずに、スタイルベースのWebサイトを選択しています。
平均2〜3%を超えるコンバージョン率が必要な場合は、コンバージョンを妨げるWebデザインの間違いを排除する必要があります。
あなたのウェブサイトはあなたが良い印象を与えなければならない唯一のチャンスです。
人々があなたのサイトを気に入らなければ、彼らは跳ね返り、二度と戻ってこないでしょう。
しかしありがたいことに、顧客を変えるのにどのウェブデザインの偽物が良くないかを正確に示したいくつかの研究があります。
ここにあなたのコンバージョンを殺している4つのウェブデザインの間違いがあります—そしてあなたがそれらを修正する方法。
ニール・パテルとの相談
私の代理店があなたのウェブサイトへの大量のトラフィックをどのように促進できるかをご覧ください
SEO-大量のSEOトラフィックのロックを解除します。実際の結果をご覧ください。
コンテンツマーケティング-私たちのチームは、共有され、リンクを取得し、トラフィックを引き付ける壮大なコンテンツを作成します。
有料メディア-明確なROIを備えた効果的な有料戦略。
電話を予約する
1.カルーセルスライダー
最近、カルーセルスライダーが大流行しています。ほぼすべてのWebサイトにアクセスすると、何らかの形のカルーセルスライダーが表示されます。
これらは表面上はすばらしいツールですが、使用法を分析すると、大きく異なる画像が表示されるようになります。
私はそれらを使用するウェブサイトをバッシングしていません。
実際、私は実際にカルーセルスライダーがどのように見えるかが大好きです。
非常に人気があることを指摘しておきます。
Squareがサイトでどのように使用しているかの例を次に示します。
貼り付けた画像0751
そしてそれは美しいですよね?完全に。
過去にホームページでも使ったことがあるので、その魅力がよくわかります。
そして、それらはホームページで使用されるだけではありません。カルーセルスライダーは、標準のWebサイトの複数の異なるポイントまたは場所にあります。
貼り付けた画像0768
これは、それらを使用してさまざまなオプションを披露できることを意味します。
スライダーの全体的なアイデアは、人々が自分のホームページを凝縮し始めたいと思ったときに浮かび上がりました。
これにより、ユーザーを圧倒することなく、より多くの情報、より多くの画像、およびより多くのコンテンツを1つのページに含めることができます。
いいアイデアですね。もちろん。
見た目も機能も機能しているようですが、そうですか?
絶対違う。実際、コンバージョンを殺しているのはWebデザインの偽物です。
「カルーセルを使用する必要がありますか?」という質問専用のサイトもあります。
貼り付けた画像0771
そして、評決は次のとおりです。確かに、しっかりしていません。
なんで?カルーセルスライダーは画面領域の大部分を占めるため、データはそれらが変換されないことを示しています。
彼らは、人々が得ると思う牽引力、クリック数、またはインタラクションを単に得られません。
そして残念ながら、あなたは彼らと一緒に大量の画面スペースを浪費している可能性があります。
コンバージョン最適化のエキスパートであるPeepLajaによると、スライダーが機能することはめったになく、ホームページから外したほうがよいとのことです。
Peep Lajaは、ホームページで静止画像を使用するか、少なくとも、自動的に回転しないカルーセルスライダーを使用することをお勧めします。
たとえば、ヒルトンはサイトでカルーセルスライダーを使用していますが、特定の時間が経過しても自動的に移動しません。
貼り付けた画像0757
これにより、ユーザーはエクスペリエンスを制御できるようになり、画面を操作することに決めない限り、画面の変更に煩わされることはありません。
それで、あなたは代わりに何をしますか? Evernoteのような長い形式のホームページを試してみてください。
貼り付けた画像0803
これにより、コンバージョンを妨害するWebデザイン機能を使用せずに、必要なすべてのコンテンツをホームページに表示できます。
2.スピード
ああ、古き良きウェブサイトの速度。これは私が今でも見ている最大の失敗の1つです。
カルーセルスライダーやアニメーショングラフィックスなどの重いページ要素は、ページの速度をすぐに低下させる可能性があります。
そして、スピードは、ウェブデザイン、SEO、そして訪問者をより長い時間維持することに関してはゲームの名前です。
あなたのウェブサイトが遅い場合、あなたはより低いコンバージョン率を期待することができます。
Googleの最新のPageSpeedベンチマークデータによると、ウェブサイトの読み込みに時間がかかるほど、バウンスの可能性が高くなります。
貼り付けた画像0782
実際、ウェブサイトの読み込みに10秒かかる場合、バウンスの可能性は123%増加します。
そして、私はあなたにそれを壊すことを嫌います、しかしあなたはおそらく1秒か2秒の範囲にいません。
Googleのデータによると、ほとんどの業界はベンチマークにさえ近づいていません。
貼り付けた画像0800
これは、ほとんどの業界のサイトの大部分が、ページ速度が遅いという理由だけで顧客を失っていることを意味します。
残念ながら、それだけではありません。
の最大の原因の1つ
ウェブサイトの速度が遅いのは、平均ページ重量が原因です。私たちの大多数は、重いページを持っていることで罪を犯しています。
貼り付けた画像0767
スピードは、最大ではないにしても、今日最大のWebデザインの偽物の1つです。
また、最大のコンバージョンキラーの1つです。
TruConversionのデータによると、ウェブサイトの訪問者の83%は、サイトが3秒以内に読み込まれることを期待しています。トップeコマースストアの平均読み込み時間は10秒です。
貼り付けた画像0810
速度を1秒向上させるだけでも、コンバージョン数が7%増加する可能性があります。
速度を固定して高速にすることが非常に重要です。
スピードはあなたにコンバージョン、そして最終的にはお金を犠牲にするでしょう。
貼り付けた画像0787
あなたのサイトが毎日$100,000を稼いでいる場合、ページ速度の1秒の遅延は、年間250万ドル以上の費用がかかる可能性があります。
もちろん、ほとんどのサイトはおそらく1日あたり100,000ドルをもたらしていませんが、ポイントは得られます。
ウェブサイトの速度が不足すると、コンバージョンに費用がかかり、ROIが低下し、ユーザーが不満を感じることになります。
したがって、速度の問題を修正することの潜在的な利点は次のとおりです。
貼り付けた画像0798
400ミリ秒などのわずかな改善で、Yahooはトラフィックを9%増やすことができました。
Mozillaは、速度を2秒上げたときに、変換を15%以上改善しました。
それで、今日あなたがあなたのスピードを上げ始めることができる方法はここにあります。
コードをクリーンアップします
まず、コードをクリーンアップすることから始めます。
膨張したコードは、Webサイトが遅い最大の理由の1つです。
Varvyなどのツールを使用して、コードをテストし、クリーンアップすることができます。
貼り付けた画像0774
URLを入力し、[実行]をクリックするだけで、どのスクリプトとコードがスペースを取りすぎているかを確認できます。
貼り付けた画像0789
たとえば、赤と黄色で強調表示されたスクリプトは大きすぎます。彼らは私の速度の一部を妨げている可能性があります。
ここでの目標は、速度の問題の原因を特定することです。ほとんどの場合、それは貧弱なコーディングを中心に展開します。
PageSpeedInsightsをテストします
GoogleのPageSpeedInsightsツールは、サイトの速度をテストし、変化するベンチマークに常に対応するための私のお気に入りの方法の1つです。
貼り付けた画像0806
このツールは、サイトの速度が低下する原因を正確に把握できるため、優れています。
その上、それはあなたにそれを改善する方法についての詳細な指示を与えるでしょう。
したがって、技術的なWebサイトの詳細にそれほど熟練していない場合は、Webマスターを使用または送信するためのガイド付きの手順があります。
まず、ウェブサイトのURLを入力し、[分析]をクリックします。
貼り付けた画像0779
このツールは、あなたが正しいことをしていること、そしてさらに重要なことに、あなたが間違っていることを正確に示します。
たとえば、[可能な最適化]アイテムをクリックすると、何が問題で、どのように修正するかについての詳細が表示されます。
貼り付けた画像0805
また、モバイルサイトもスキャンします—それを最適化する方法がわからない場合。
貼り付けた画像0775
これは、サイトの欠陥をテストして速度を向上させるための優れた方法です。
いくつかの改善を行ったら、サイトに戻ってもう一度テストし、どの改善が最大の違いをもたらしたかを確認します。
3.ソーシャル共有ボタンはありません
ソーシャルシェアは、ビジネスを成長させ、コンテンツを宣伝し、サイトの周りに話題を集めるための生命線になる可能性があります。
私は毎日ソーシャルメディアを使用してコンテンツを宣伝し、トラフィックを増やしています。
実際、これはバイラルコンテンツを宣伝するための私のお気に入りの方法の1つです。私は自分のサイトで公開されるすべてのブログ投稿にこれを使用しています。
しかし、人々があなたのコンテンツを共有できない場合はどうなりますか?これは、今日のWebデザインで見られる最大の失敗の1つです。
ブログのコンテンツに共有ボタンを含めないか、ホームページなどの間違ったページにボタンを含めます。
ソーシャル共有ボタンの構成は次のとおりです。
まず、誰かが私のブログ投稿にアクセスしたとき、私はすぐに共有するように依頼しません。
なんで?彼らはまだコンテンツを読んでいないからです。調整するボタンで画面を乱雑にしたくありません。
貼り付けた画像0801
画面の詳細度を下げ、すっきりさせ、ページのコンテンツに焦点を合わせやすくするようにしています。
誰かがページを下にスクロールし始めたとき、それは私がソーシャル共有ボタンを押し始めたときです。
貼り付けた画像0807
なんで?ソーシャル共有ボタンが独自のバナーブラインドのブランドになっているからです。
そしてバナーの盲目は回心を殺します。
この用語(バナーブラインド)に慣れていない場合は、ここに簡単な要約があります。
貼り付けた画像0802
基本的に、人々はバナー広告を見るのにうんざりしています。彼らは無意識のうちにそれらを調整します。
私のブログにソーシャルシェアがすぐに表示されたとき、彼らはほぼゼロのシェアを獲得していました。
人々はそれらを無視してすぐにスクロールしました。つまり、私のコンテンツはユーザーの宣伝がほとんどまたはまったくなく、大きな打撃を受けました。
しかし今、誰かが下にスクロールすると、ボタンはゆっくりとフェードインします。
つまり、彼らは目立つようになり、誰かが実際に彼らに気付くでしょう。
この戦略により、私の平均的なブログ投稿のソーシャルシェアが25.3%増加しました。
だから、私のようにソーシャルシェアを設定する方法は次のとおりです。
開始するには、AddThisに進んでください。
貼り付けた画像0755
AddThisは、ソーシャル共有ボタンを含めるのに最適な方法です。
ユーザーが投稿を読んでいる間、ユーザーを楽しませてください。
メールアドレスを無料で登録して、ダッシュボードにアクセスしてください。
ここでは、いくつかの異なるオプションから選択できますが、この例では、ソーシャル共有ボタンを設定します。
貼り付けた画像0760
ここで、いくつかの異なるタイプの共有ボタンから選択できます。
貼り付けた画像0764
バナーやスライダーの形で使用することもできます。
貼り付けた画像0808
サイトで必要な共有ボタンを選択したら、クリックして続行し、位置とソーシャル共有アイコンの編集を開始します。
貼り付けた画像0812
スタイル、ボタンサイズ、色などを編集することもできます。
貼り付けた画像0804
AddThisは、サイトにすばらしいソーシャル共有ボタンを簡単に含めるために使用できる優れた無料ツールです。
そして、AddThisの素晴らしいところは、簡単なカスタマイズとモバイルの最適化です。
トラフィックを活用してより多くのソーシャルシェアを生成したい場合は、今日からブログコンテンツにソーシャルシェアリングボタンを追加してください。
そうしないと、コンテンツのリンク、共有、トラフィックが少なくなるリスクがあります。
4.オプトインポップアップを使用しない
ほとんどの人は、ポップアップが煩わしいという印象を持っています。
しかし、本当の焦点はこれらの質問にあるべきです:
彼らは働きますか?彼らは回心しますか?
そして、両方の答えはイエスです。
カルーセルスライダーの場合と同じです。カルーセルスライダーはきれいで便利なものとして認識されますが、変換されません。
オプトインポップアップは煩わしいと見なされますが、機能します。
そして、それらがコンバージョンを促進するのであれば、私たちはそれらを私たちのサイトに望んでいます。
フードブロガーのNikkiMcGonigalは、ポップアップオプトインを使用してサブスクライバーを生成し始めました。
貼り付けた画像0784
この単純な戦術を使用して、彼女はわずか8か月で7,000件以上の電子メールサインアップを獲得することができました。
彼女はポップアップを使用してコンバージョン率を5.5%に上げました。
ここCrazyEggには、コンバージョンを増やすための素晴らしいポップアップの例を示すブログ投稿全体があります。
そして、私はそれらをCrazyEggで常に使用しています。
貼り付けた画像0792
なんで?彼らが働くからです。
彼らは人々に注意を向けさせ、回心させます。
QuickSproutでも使用しています。
ウェブサイトには、コンバージョンと収益を生み出すという1つの本当の目標があります。
したがって、最新かつ最高のリードキャプチャ技術を使用していない場合、Webサイトはその役割を果たしていません。
行動を促すフレーズは、サブスクリプションを促進するための一番の方法です。
ユーザーに実行させたいアクションをユーザーに知らせない場合は、それらのコンバージョンに別れを告げることができます。
今日これを設定してみませんか?無料のツールAddThisをもう一度使用できます。
ダッシュボードに戻り、ツールリストから[リストの作成]オプションを選択します。
貼り付けた画像0809
次に、リスト作成ツールのタイプを選択するように求められます。
ここで重要なのは、オプションとして「Popup」を選択することです。
貼り付けた画像0797
右側では、このツールタイプがサイトでどのように表示されるかを簡単にプレビューすることもできます。
貼り付けた画像0795
次に、見出しとCTAボタンのテキストを好みに合わせて簡単にカスタマイズできます。
貼り付けた画像0814
たとえば、これをウェルカムメッセージとして使用する場合は、メールと引き換えに割引を提供することを検討できます。
次に、必要なレイアウトを選択します。背景の種類を特定の画像に変更することもできます。
貼り付けた画像0811
カスタマイズオプションは素晴らしく、ポップアップにさまざまな要素を追加できます。
また、このツールで私のお気に入りの1つは、ポップアップ送信と変換を電子メールプラットフォームまたはCRMに直接接続する機能です。
貼り付けた画像0813
これは、プロセス全体を自動化できることを意味します。
または、メールのファイルが必要な場合は、[CSVにダウンロード]を選択することもできます。
AddThisを使用することは、変換を妨害するWebデザイン戦略を排除するための優れた方法です。
さまざまなページ、終了インテント、またはウェルカム画面に基づいてポップアップを追加して、より多くのリードをすばやくキャプチャし始めます。
私は自分のサイトでそれらを使い始めました、そして私は電子メールの提出の急速な増加を見ました。これは、メーリングリストをすばやく増やすための素晴らしい方法です。
結論
Webデザインはここ数年で大きく進歩しました。
新しいデザインとページ要素が数か月ごとに表示され、ウェブサイトの見栄えがこれまでになく向上しています。
しかし、これらのウェブサイトデザイン技術のいくつかは、コンバージョンを妨害します。
見栄えが良いからといって、うまく機能するとは限りません。
彼らはあなたの回心を殺している偽物になりました。
機能していないウェブサイトを持っていても、コンバージョンを増やすことはできません。
あなたのウェブサイトは、変換する能力を維持しながら、素晴らしいデザインを持っている必要があります。
それでも、多くのマーケターは依然として設計手法を使用しているか、コンバージョンを妨げている偽物を無視しています。
サイトでこれらのアクションを修正しないと、大量のコンバージョンを失うリスクがあります。
また、標準の2〜3%のウェブサイトコンバージョン率では不十分です。
それは停止点であってはなりません。
私たちは皆、高いコンバージョン率を目指して努力する必要があります。
カルーセルスライダーを削除することから始めます。それらはきれいに見え、より少ないスペースでより多くの情報を含むかもしれませんが、人々はそれらと対話しません。
それらは単にスペースの無駄です。
次に、速度の向上に焦点を当てる必要があります。 速度は、Webサイトで(最も重要ではないにしても)重要なことの1つです。
速度が遅い場合、訪問者を変換することは期待できません。ページが読み込まれるのを誰も待っていないからです。
次に、ソーシャル共有ボタンを使用してコンテンツを宣伝し、より多くの共有とリンクを促進するようにしてください。
最後に、オプトインポップアップを使用して、Webサイトを最大限に活用します。 優れたCTAがなければ、優れたWebサイトは完成しません。
これらのウェブデザインの偽物を修正することは、訪問者にとってより良いユーザーエクスペリエンスを意味します。
そして、それはコンバージョンの大幅な増加を意味する可能性があります。
コンバージョンを妨害していたウェブデザインの間違いを修正しましたか?