Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPBカップ
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

WordPressで画像にタイトル属性を簡単に追加する方法

編集メモ: WPBeginner のパートナーリンクから手数料を得ています。手数料は編集者の意見や評価に影響を与えません。編集プロセスについて詳しく知る。

WordPressで画像にtitle属性を追加したいですか?

title属性は、各画像に関する追加情報を提供することができます。これは、スクリーンリーダーや検索エンジンが画像の内容を理解するのに役立ち、アクセシビリティやSEOに最適です。

この投稿では、WordPressで画像にタイトル属性を簡単に追加する方法を紹介します。

Adding the title attribute to images in WordPress

画像のTitle属性とは?

クローラーやボット、画面読み上げ端末は、あなたの画像を実際に見ることはできません。代わりに、次のようなHTMLが表示されます:

<img src="/path/to/image/fruits.jpg" width="100" height="100" />

ほとんどの場合、このコードはアクセシビリティ・ツールや検索エンジンが画像の意味を理解するのに役立ちません。

そのため、画像にはタイトルタグを付けることをお勧めします。例えば

<img src="/path/to/image/fruits.jpg" width="100" height="100" alt="A fruit basket" title="Fruit Basket" />

有益で適切なタイトルタグは、Googleのような検索エンジンがあなたの画像を正しくインデックスし、あなたのようなコンテンツを検索している人々に表示するのに役立ちます。これにより、画像のSEOを改善し、ブログのトラフィックを増やすことができます。

スクリーンリーダーなどのアクセシビリティ・ツールは、タイトルを読み上げるので、視力に問題のある訪問者にも役立ちます。

また、WordPressの エラーなどで実際の画像を表示できない場合に、WordPressサイトが表示する代替タグ属性を追加することもできます。

Broken image path

それでは、WordPressブログやサイトで画像にタイトル属性を追加する方法を見ていきましょう。以下のクイックリンクから、使いたい方法にジャンプしてください:

方法1:ブロックエディターを使って画像にタイトル属性を追加する

WordPressのコンテンツエディターで、画像にaltテキストとタイトル属性を簡単に追加できます。投稿 ” 新規追加から投稿を作成するだけです。

次に「+」アイコンをクリックし、画像ブロックを選択して投稿やページに画像を追加します。

Add image block

メディアライブラリから画像を選択するか、コンピューターから画像をアップロードすることができます。どのオプションを選択する場合でも、メディアライブラリの画像をクリックして選択してください。

タイトル」フィールドにテキストを入力して、代替テキストを追加できます。

Adding a title to an image in WordPress

タイトル」フィールドもありますが、これはWordPressがメディアライブラリでメディアファイルを識別するために内部的に使用するタイトルです。このトピックについては、WordPressの画像altテキストと画像タイトルの違いをご覧ください。

HTML画像のタイトル属性を追加するには、通常通り画像をページや投稿に追加します。次に、右側のメニューにある「詳細」セクションをクリックして展開します。

The 'Advanced' image settings in the WordPress page and post editor

これには’Title attribute’フィールドがあり、これが本当のHTML画像タイトル属性です。

使用したい情報をフィールドに入力するだけです。

Adding a title attribute to images in WordPress

更新」または「公開」をクリックして、変更を反映させることができます。

画像の上にマウスオーバーするだけで、タイトルタグを含むポップアップが表示されます。

An example of an image with a title attribute in WordPress

方法2:WordPressクラシックエディターを使って画像にタイトル属性を追加する。

クラシックエディターを使用している場合、タイトル属性を追加する手順は少し異なります。クラシックエディターで「メディアを追加」ボタンをクリックし、画像を選択します。

Add image classic editor

新規画像をアップロードするか、メディアライブラリから画像を選択します。メディアライブラリの右側にあるフィールドを使って、altテキストとタイトルを追加できます。

繰り返しますが、’Title’はWordPressが内部的に使用するものであり、SEOやアクセシビリティを向上させる真の画像タイトル属性ではないことに留意してください。

Select image classic editor

準備ができたら、「投稿に挿入」ボタンをクリックします。

そこで画像をクリックして選択し、小さな鉛筆アイコンを選択します。画像の詳細」ポップアップが表示されます。

クリックして「詳細オプション」セクションを展開し、「画像タイトル属性」フィールドにタイトルタグを入力します。

Image title attribute field

更新」ボタンをクリックして変更を保存することをお忘れなく。

これでページや投稿を公開し、画像のaltテキストとタイトルタグをライブにすることができます。

Image title attribute popup

画像SEOを強化するボーナスのヒント

メディアライブラリに画像をアップロードしたら、次は検索エンジン用に画像を最適化しましょう。こうすることで、Googleが画像をインデックスしやすくなり、上位表示されやすくなります。

そのためには、キャプション、タイトル、altテキスト属性に関連キーワードを追加するよう心がけなければならない。

Add relevant keywords in the caption, title, and alt text

また、市場で最高のSEOプラグインであるAll In One SEO for WordPressを使うこともできる。

altテキスト、画像タイトル、キャプションなどを自動的に設定する素晴らしいImage SEOアドオンが付属しています。また、SEOランキングを向上させるために適切な画像サイトマップを追加します。

All in One SEO

さらに、プラグインで添付ファイルを無効化することもできます。これらのページは、実際の画像の拡大版を表示するだけで、他には何も表示しないため、SEOに悪影響を及ぼします。

添付ファイルページを無効化するには、All In One SEO ” 検索外観ページにアクセスし、「画像SEO」タブに切り替えます。ここから、’Redirect Attachment URLs’オプションが’Attachment’に設定されていることを確認してください。

Disable attachment pages

これで、添付ファイルのページは画像そのものにリダイレクトされる。

他にも、画像ファイルに説明テキストを使ったり、画像を圧縮したり、バックリンクを追加してランキングを上げることもできます。より多くのヒントやトリックについては、画像SEOの初心者ガイドをご覧ください。

この投稿が、WordPressで画像にtitle属性を簡単に追加するのにお役に立てば幸いです。また、WordPressのスピードとパフォーマンスを向上させる方法についての究極のガイドと、専門家が選んだ最高の画像圧縮プラグインもご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

情報開示 私たちのコンテンツは読者支援型です。これは、あなたが私たちのリンクの一部をクリックした場合、私たちはコミッションを得ることができることを意味します。 WPBeginnerの資金源 をご覧ください。3$編集プロセスをご覧ください。

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

究極のWordPressツールキット

ツールキットへの無料アクセス - すべてのプロフェッショナルが持つべきWordPress関連製品とリソースのコレクション!

Reader Interactions

15件のコメント返信を残す

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

    • WPBeginner Support says

      If you mean the featured image then that would read the title set for the image from your media library.

      管理者

  2. Roshni says

    Thank you for the explanation.

    Message on wordpress site for this plugin “This plugin was closed on December 24, 2018 and is no longer available for download. Reason: Guideline Violation.”

    Is there a substitute available?

    • WPBeginner Support says

      While we don’t have a recommendation at the moment, we will be sure to take a look for alternatives.

      管理者

返信を残す

コメントありがとうございます。すべてのコメントは私たちのコメントポリシーに従ってモデレートされ、あなたのメールアドレスが公開されることはありませんのでご留意ください。名前欄にキーワードを使用しないでください。個人的で有意義な会話をしましょう。