WordPressの画像スライダーにメタデータを追加する方法

公開: 2018-07-30

WordPressスライダーにメタデータを追加しますか？メタデータは、画像やその目的の説明など、ウェブサイトの要素について検索エンジンやスクリーンリーダーに通知する非表示のHTML要素です。 SEOとアクセシビリティの両方の理由から、画像に説明的なメタデータがあることは非常に重要です。

この主要なSEO機能が欠落している可能性があるため、サイトでカルーセルを使用することを心配している場合は、心配する必要はありません。 Soliloquyスライダーを使用すると、タイトルや代替テキストなどのメタ属性をスライダー上のすべての画像に簡単に追加できます。

WordPressスライダーにメタ属性を追加するには、次の3つの簡単な手順に従う必要があります。

ステップ1.Soliloquyをインストールしてアクティブ化します

ステップ2.スライダーを作成して編集する

ステップ3.画像メタデータを追加する

画像のタイトルや代替テキストを正しく書く方法がわからなくても心配しないでください。この記事の後半で、各メタデータオプションを分類します。

ステップ1.Soliloquyをインストールしてアクティブ化します

WordPressサイトにスライダーを追加してそのメタデータを変更するには、Soliloquyプラグインをダウンロードしてアクティブ化する必要があります。プレミアムバージョンをダウンロードするか、 SoliloquyLiteを試すことができます。

SoliloquyとSoliloquyLiteはどちらも、 FTP経由、または管理パネルからインストールできます。左側のバーにある[プラグイン]画面で、Soliloquy Liteを検索するか、Soliloquyの購入時に提供されたzipファイルをアップロードします。

問題が発生した場合は、このインストールガイドを確認してください。

ステップ2.スライダーを作成して編集する

管理ダッシュボードに、「独り言」タブが表示されます。その上にカーソルを合わせ、「新規追加」をクリックします。ここで、画像、スライダーのタイトル、その他の詳細を追加できます。さあ、スライダーの作成を完了してください。

画像をアップロードしたら、スライダーを編集する必要があります。「独り言」をクリックするだけで、すべてのスライダーのリストが表示されます。編集したいものを見つけて、その名前をクリックします。アップロードしたすべての画像のサムネイルが連続して表示されます。青い鉛筆ボタンをクリックして、各画像を個別に編集します。

ステップ3.画像メタデータを追加する

青い鉛筆アイコンをクリックすると、右側に画像とメタデータフィールドを示すボックスがポップアップ表示されます。

ここでの2つの重要な属性は、タイトルと代替テキストです。タイトルは一目瞭然です。スライドに簡単な名前を付けて、画像を簡単に説明します。代替テキストはより重要です。画像の読み込みに失敗した場合、またはスクリーンリーダーや検索エンジンで処理されている場合は、代わりに代替テキストが表示されます。曖昧すぎず、言葉になりすぎないように、画像を簡潔に説明してください。

ここでの他のオプションのメタ属性には、画像の上に表示されるキャプションが含まれます。そのスライドがクリックされたときに開くURLを挿入できます。他のSoliloquyアドオンをインストールした場合は、サムネイルまたはライトボックスオプションが表示される場合があります。

ライトボックスを使用すると、画面が暗くなったボックスに画像がポップアップ表示され、視認性が向上します。サムネイルはスライドの下部に小さな画像を表示し、訪問者が将来のスライドをプレビューできるようにします。サムネイルとして使用したい任意の画像にリンクできます。

終了したら、「メタデータの保存」をクリックしてスライダーを更新することを忘れないでください。

メタデータを作成する方法

まだ混乱しているかもしれません—SEOに適した完璧なメタデータをどのように作成できますか？これらの属性の目的は何ですか？これを理解すると、メタデータは非常にシンプルになり、画像に追加するのに数秒しかかかりません。

画像タイトル

画像のタイトルはSEOにとって重要ではありませんが、画像にタイトルを指定することもできます。画像にカーソルを合わせるとタイトルが表示されるので、注意してください。適切な文法と大文字の使用を使用し、写真に短く説明的なタイトルを付けます。タイトルを設定しない場合は、代わりに代替テキストがホバーで使用されます。

画像代替テキスト

画像の読み込みに失敗した場合、スクリーンリーダーまたは検索エンジンのクローラーによってアクセスされている場合、またはデバイスに表示できない場合は、代替テキストが表示されます。代替テキストは、画像を読み込めない、または視覚障害のある人にコンテキストを提供するために使用する必要があります。

さらに、代替テキストは検索エンジンによって索引付けされるため、関連するキーワードを慎重かつ賢明に使用する機会を利用できます。ただし、キーワードの乱用に代替テキストを使用しないでください。これにより、SEO（およびスクリーンリーダーのユーザーを困らせる）が大幅に損傷する可能性があります。

代替テキストの説明は役立つはずですが、簡潔です。画像を調べます。あなたの目がどこに行くかを見て、あなたが気づいた主要な詳細を指摘してください。 1つか2つのキーワードを自由に使用してください—人々がそのトピックを探すとき、あなたの記事やウェブサイトは検索エンジンにより関連性があるように見えます—しかしそれを自然に取り入れます。

一部のスクリーンリーダーでは代替テキストが途切れる可能性があるため、説明は125文字以下に制限してください。

画像がデザイン上の理由で含まれていて意味がない場合は、alt text属性を空白のままにすると、スクリーンリーダーは画像を無視します。

画像リンク

スライドを別のページにリンクする必要がありますか？たぶんあなたのウェブサイト、製品、またはあなたが共有したいページのプロモーションですか？リンクしたいページのURLを取得して「画像リンク」ボックスに貼り付けるだけです。

また、リンクで新しいタブを開くかどうかを決定する必要があります。新しいタブを開くことは、ユーザーがホームページに戻ったり、スライダーが配置されている場所に戻ったりする場合に最適です。他のページを見終わったら、ブラウジングを続けることができます。このチェックボックスをオフにすると、ユーザーは同じタブに留まり、リンクをクリックするとホームページを離れます。

画像キャプション

キャプションは、スライダーの画像に表示されるテキストです。代替テキストとは異なり、キャプションはユーザーに表示されますが、同様の機能を共有します。キャプションを使用して、訪問者に画像を説明したり、行動を呼びかけたり、写真に関する追加のコンテキストを提供したりします。

WordPressスライダーへのメタ属性の追加

小さなことのように思えるかもしれませんが、画像にメタデータ（特にaltタグ）を追加することは非常に重要です。 SEOの最適化には多くの小さなステップが必要ですが、それぞれがトップに立つのに役立ちます。

このガイドは、スライダーにメタデータを追加するのに役立ちましたか？ さらに必要な場合は、FacebookとTwitterのページにWordPressのチュートリアルとリソースがたくさんあります。

保存保存