Webサイト制作途中に行う確認のひとつに、ALTやMeta情報のチェックがあります。
ALTが正しく記入されているか確認するために、いちいち画像ファイルにマウスオーバーしたり、ソースを開いていませんか？
ALT＆Meta情報をチェックするなら「Alt & Meta viewer（Google Chrome機能拡張）」が便利です！
時間短縮になるので、おすすめです。
こんな方におすすめ
- Webサイト制作を行っている人
- Webディレクターの人
- 時間短縮をしたいと思っている人
- AltやMeta情報のチェックが面倒だと感じている人
上記のような方へ、ALTチェックのツール「Alt & Meta viewer」についてご紹介します。
わたしはWeb業界で20数年、働いているモノコト（@monokoto68）です。
これまで様々なWebサイト制作に携わってきました。
そんな現役Webディレクターが実際に行っているALTチェックツールの使用方法を教えます。
ALTチェックツールなら「Alt & Meta viewer」が便利！
Google Chromeの機能拡張である「Alt & Meta viewer」は簡単操作でAltやMeta情報を確認することができます。
WebディレクターやWebサイトの確認作業を行っている人にとっては、よくある仕事のひとつがALTやmeta情報が正しく記入されているかのチェックではないでしょうか。
全てのページのALT、Meta情報を確認するには、それなりの時間がかかります。
確認時間を短縮するためにも「Alt & Meta viewer」を使ってみることをおすすめします。
そもそもALT／Meta情報とは？
AltやMeta情報が分からない方のために説明します。
Webサイト制作するときに、画像の代替えテキストを記入する必要があります。
視覚障害の方への補助やSEOとして、画像のALT属性に説明テキストを入れることを指しています。
<img src=“画像パス” alt=“画像の説明テキスト“/>
Meta情報は、Webサイトの各ページに記載する「title、description」等のテキスト情報のことを指しています。
<title>モノコト６８＠Webディレクター x ブロガー</title>
<meta name=”description” content=”40代の現役Webディレクターが主に仕事のコトや転職のコト、気になるガジェットのコトを語っています。Webディレクターを目指している方は是非、ご覧ください。” />
これらのAltやMeta情報が正しいかどうかをWebディレクターは、Webサイトの制作過程で確認します。
「Alt & Meta viewer」のインストール方法
Google Chromeに機能拡張をインストールする手順は以下の通りです。
インストール手順
- ブラウザのGoogle Chromeを開きます
- 機能拡張「Alt & Meta viewer」へアクセス
- 「Chromeに追加」を押す
機能拡張のページにアクセスすると下記の画面になるため、「Chromeに追加」を押すと、「追加しますか？」と聞かれるので、OKを押すと完了となります。
「Alt & Meta viewer」は、ブラウザGoogle ChromeのURL入力欄の右側にアイコンが追加されていればOKだ。
「Alt & Meta viewer」の操作方法
調べたいWebサイトを開いた状態で、アイコンをクリックすると表示されます。
Altを調べたい場合
各画像にAltに記載されているテキストが表示されます。
これで、意図しているテキストが正しく記載されているか、記載漏れはないかなどを確認することができます。
Meta情報を調べたい場合
現在のページのMeta情報が表示されます。
タイトルやディスクリプションが正しく記載されているか確認することができます。
SNSのシェアで利用するOG関連の情報も確認できるため、合わせて確認しましょう。
Web制作現場での「Alt & Meta viewer」の使い方
Webディレクターとして仕事をしていますが、AltやMeta情報が正しく記載されているかを確認する際に、「Alt & Meta viewer」を利用します。
Altの間違いや入れ忘れは、結構、見つかるものです。
特にWebサイト制作過程において、修正が繰り返し行われたり、大規模なサイトになると起こりやすいです。
AltやMeta情報は細かい作業になりますが、SEO等にも関連するため、高品質なWebサイトを提供するためにも手を抜かずに確認してください。
まとめ：ALTチェックツールなら「Alt & Meta viewer」が便利！
ツールがないと、AltやMeta情報を確認するには、非常に面倒な作業となります。
そこで便利なツールがGoogle Chromeの機能拡張である「Alt & Meta viewer」です。
インストールしておけば、ボタンをクリックするだけで、そのページのAltやMeta情報を確認することができるので便利です。
Webサイト制作の確認作業の時間短縮のためにも、ぜひ活用してください。
Webサイト制作の工程・流れを知りたい方は、「Webサイト制作の工程・流れとは？現役Webディレクターがフローを教えます！」をご覧ください。
