WordPressでスライダーを使用する場合(およびスキップする場合)

公開: 2018-04-30

ますます頻繁に、カルーセルがホームページの主なアトラクションになりつつあります。 これらのシンプルなツールは多くの問題を解決できます。多くのポイントを取得する必要があるときにスペースを最大化し、注目のコンテンツに人々を誘導し、退屈で静的なWebサイトをもう少しアニメーション化することもできます。

しかし、あまりにも多くの場合、それが人気のある傾向であるという理由だけで、人々は目的なしにスライダーを使用します。 不適切に使用すると、カルーセルはせいぜい何もせず、最悪の場合SEOにダメージを与える可能性があります。 しかし、スライダーには用途があります! スライダーを使用するかどうかを決定するときは、スライダーが最適に機能する場所と、代わりに静止画像を配置するタイミングを知っておく必要があります。

スライダーを使ってみませんか?

スライダーは役立つ場合もありますが、バナー、画像、またはその他のメディアを使用した方がよい場合もあります。 最適化されていない、または置き忘れたカルーセルは、良いよりも害を及ぼす可能性があるため、適切なタイミングで使用することが重要です。 スライダーをスキップしたい状況がいくつかあります。

単一の強力なメッセージを宣伝する

スライダーの性質上、小さなスペースで多くの情報を伝えることができます。 多くの目標を持っている企業、または訪問者に伝えることがたくさんある企業にとって、これは完璧です。 しかし、組織に的を絞ったメッセージと単一の使命がある場合は、代わりに優れたヒーロー画像を使用する方がよいでしょう。 簡潔さはカルーセルの長所ではありません。

Lego Superman Hero Image

不必要な気晴らし

想像してみてください:あなたはサイトのブログの記事を読んでいます。 数秒ごとに何かが目の隅で動き続けることを除いて、それは非常に興味深いものです。 最終的に、それはあなたを完全に記事を放棄するように駆り立てます。

フォーカスが必要なページのアニメーションは、わずかではありますが、気が散ってイライラします。 自動スライダーは、ブログ記事やコメントボックス、フォーム、アンケートの近くにはありません。 それらを含める場合は、これらのページでタイマーをオフにしてください。 そうすれば、ユーザーは気を散らすことなく、必要に応じてクリックしてスクロールすることができます。

アクセシビリティの懸念

Handicapped Parking

多くのスライダー、特にWordPressテーマに付属するデフォルトのスライダーでは、アクセシビリティは大きな問題です。 多くの場合、スクリーンリーダー用に最適化されておらず、それらを壊し、スライダーを完全にスキップし、一般的に混乱を引き起こします。

Soliloquyスライダーには、キャプション、代替テキスト、およびARIAライブ値のオプションが付属しており、スクリーンリーダーの優先順位を設定できるため、これはそれほど問題にはなりません。 Soliloquyスライダーを使用していない場合は、カルーセルにアクセスできるようにするために追加の作業を行う必要がある場合があります。

長い読み込み時間

それは本当です:最適化されていないスライダーはあなたのサイトを遅くする可能性があります。 一部のスライダープラグインは他のプラグインより重いですが、多くの場合、問題は使用する画像にあります。 カルーセルに画像をアップロードする前に、常にファイルサイズを減らして読み込み時間を短縮するように最適化してください。

Guy frustrated by slow loading

ただし、Soliloquyのような軽量のスライダープラグインを使用している場合でも、カルーセルの使用を避けた方がよい場合があります。 ページに多くの画像、アニメーション、サードパーティの通話が使用されている場合は、それ以上積み重ねないでください。検索ランキングが損なわれる可能性があります。

非応答性

多くのスライダーはまだ応答しません。これは、ハンドヘルドデバイスの時代には受け入れられません。 モバイルは着実にデスクトップコンピューターを引き継いでおり、人々が携帯電話で買い物をしたりブラウジングしたりする場合、レスポンシブスライダーを使用すると、モバイルサイトをナビゲートして訪問者を追い払うことが難しくなります。

独り言のスライダーは反応が良いですが、それらを使用していない場合は、モバイル向けに最適化されたスライダーがあることを確認するか、完全にスキップする必要があります。

Various PC and mobile devices

記事スライダー

スライダーを使用して簡単なスライドショーを表示することは問題ありません。 Soliloquyには、PDFをインポートするオプションもあります。 プレゼンテーションを使用すると、WordPressに変換するのが難しい可能性のある書式設定とスタイル設定を使用でき、スライダーで見栄えがします。

ただし、カルーセルは、記事全体をチャンクに分割するために使用されることがあり、直感的で混乱を招きます。 スライダーは、主にテキストベースの長い形式のコンテンツを表示するために使用しないでください。

スライダーを使用する理由

カルーセルにはさまざまな目的があり、適切なタイミングで使用すると、機能的で美しいサイトに追加できます。 スライダーを使用することがあなたとあなたの訪問者にとって有益であるかもしれないいくつかの状況がここにあります。

Person working at a laptop

プロフェッショナルデザイン

スライダーについてのあなたの意見が何であれ、確かなことが1つあります。それは、見栄えが良いということです。 カルーセルは、情報を表示するためのエレガントで効果的な方法であり、それ以上のものはありません。 スライダーがページ上でどのように見えるかが単に好きなら、それはあなたのウェブサイトにスライダーを含めるかなりの理由です!

スライダーは、当たり障りのないWebページにフレアを加えることもできます。 少しのアニメーションと双方向性が大いに役立ちます。 人々は注目を集めるWebサイトを楽しんでいるので、サイトが少し単純すぎると感じた場合は、スライダーがちょうど必要なものかもしれません。

注目のコンテンツを表示する

スライダーは、注目の記事、製品、販売に人々を導くための優れた方法です。 正しく配置された注目コンテンツカルーセルは、訪問者を目的の場所に注意深く導くことができます。 Soliloquyスライダーは、WordPress、Instagram、その他の場所から最近のコンテンツを取得できるため、訪問者を最新の状態に保つのに最適です。

Example Soliloquy Slider

ポートフォリオ

アートや写真を簡潔に見せたい場合は、スライダーが優れたミニポートフォリオになります。 最初の数枚のスライドに最高の作品を表示すると、潜在的な顧客の目を引くのに最適なツールが得られます。

ただし、訪問者が個々の作品に焦点を合わせるのではなく、写真やアートワークのテーマの概要を理解することが重要な場合は、代わりにギャラリーレイアウトを使用することをお勧めします。

商品の表示、アップセル、クロスセル

スライダーは、訪問者が製品を閲覧およびプレビューするための優れた方法です。 また、商品ページに配置して、関連商品の購入を促すこともできます。 最後に、それらを使用して、色やロゴなどのバリエーションを表示できます。 カルーセルは、eコマースWebサイトにとって素晴らしい資産です。

WooCommerce Addon

たくさんのコンテンツ、小さなスペース

これは、スライダーの最も顕著な機能です。 小さなスペースで多くのことを言う必要がある場合、スライダーを使用すると、ページを長くしたり、テキストや画像で過飽和にしたりすることなく、コンテンツをコンパクトに表示できます。

また、限られたスペースで作業しているため、情報を簡潔かつ圧縮することをお勧めします。 スライダーを使用すると、一口サイズの読みやすい段落でデータを表示できます。 ホームページにテキストのブロックはもうありません。

Soliloquy Homepage

適切なスライダー

効果的でターゲットを絞ったスライダーは、ランダムに配置されたスライダーよりもはるかに価値があります。 スライダーを使用する場合は、目的を持って使用していることを確認してください。 あなたはそれを美容、宣伝、または情報のために置いていますか? 視聴者とエンゲージメントを高める方法を知ってください。 単に最新のトレンドに固執するためにスライダーを使用する場合よりもはるかに多くの結果が表示されます。

スライダーを使用することが最善の選択だと思う状況は何ですか? 以下でお気軽にご意見をお聞かせください。 次に、TwitterとFacebookで接続して、スライダーの使用とWordPressサイトの構築に関するさらに多くのヒントとアドバイスを入手してください。