Firefoxで画像に挿入されたalt属性を表示するアドオン「Popup ALT Attributes」を使ってみた

ウェブブラウザで画像が表示できない場合、画像の代わりに「alt属性」と呼ばれる代替テキストが表示されることがあります。基本的に画像に埋め込まれたalt属性は、ソースコードを表示しない限り閲覧することができませんが、エンジニアのPiro氏が作成したFirefox向け拡張機能「Popup ALT Attributes」を使えばページのソースコードを開くことなく画像のalt属性を確認することが可能です。

Popup ALT Attributes – 🦊 Firefox (ja) 向け拡張機能を入手
https://addons.mozilla.org/ja/firefox/addon/popup-alt-attribute/

XUL Apps > Popup ALT Attributes - outsider reflex
https://piro.sakura.ne.jp/xul/_popupalt.html

「Popup ALT Attributes」をFirefoxにインストールするには、まず配布ページにアクセスして「Firefoxへ追加」をクリックします。

以下のポップアップが表示されたら「追加」をクリック。

続いて「OK」をクリックすればインストールは完了です。

これで、alt属性を含んだ画像にカーソルを合わせると自動的にalt属性がポップアップ表示されるようになりました。

また、「Popup ALT Attributes」には長いツールチップを折り返して表示する機能も搭載されています。

さらに、隠し機能として以下のようなコマンドをuser.jsやabout:configに書き加えると、リストに記述された属性全てをポップアップ表示するようになります。また、カーソルを合わせた要素がその属性を持っていなくても、祖先にその属性を持った要素がある場合、それらも表示することが可能です。

user_pref("browser.chrome.tooltips.attrlist.enabled", true);
user_pref("browser.chrome.tooltips.attrlist",
  "alt|src|data|title|href|cite|action|onclick|onmouseover|onsubmit");

また、以下の設定では全ての祖先要素について属性値を表示することが可能です。Piro氏は「これらの機能を使うと、もしかしたらフィッシング詐欺の予防になるかもしれません」と述べています。

user_pref("browser.chrome.tooltips.attrlist.recursively", true);

なお、「Popup ALT Attributes」はオープンソースでの開発が進められており、GitHubからソースコードを閲覧・流用することが可能です。

GitHub - piroor/popupalt: Popup ALT Attribute, Popups alternate texts of images or others like NetscapeCommunicator(Navigator) 4.x, and show long descriptions in the multi-row tooltip.
https://github.com/piroor/popupalt

◆フォーラム開設中
本記事に関連するフォーラムをGIGAZINE公式Discordサーバーに設置しました。誰でも自由に書き込めるので、どしどしコメントしてください！Discordアカウントを持っていない場合は、アカウント作成手順解説記事を参考にアカウントを作成してみてください！

• Discord | "画像のalt属性って読んでる？" | GIGAZINE(ギガジン)
https://discord.com/channels/1037961069903216680/1277560229151768679