記事内の画像にマウスホバーした時に画像が半透明になる意味はあるのか?

最近は少し減りつつある気がするのですが、文章中の画像にマウスホバーすると半透明になるサイトが結構多い。
おそらくWordPressのテンプレートで元から設定されているとか、多くのサイトがやっているからといった理由で設定しているサイトが多いと思うのですが、これって必要でしょうか?記事内画像のアニメーションについて少し考えて見ました。
画像が見にくい!
基本的に僕は文章を読むとき、マウスカーソルはブラウザの真ん中の方に置きっぱなしになっている事が多く、そのままの状態でスクロールして文章を読んでいくと画像の上にマウスが来てしまい、画像が半透明になる。見にくい…「マウスカーソルどければいいじゃないか」と言われてしまえばそれまでですが、わざわざカーソルを画像から外すというこの一手間はどうなんだろう。
文章と画像の関連性が薄いのであれば構わないのだけれども(イメージ画像とか)、解説画像等になると更に厄介で、画像をしっかり見ようとしてしまうと自然とカーソルを画像の上に持ってきてしまう。これはPCをよく触っている人なら理解してもらえると思いますが、画面上の文章にしても画像にしても、しっかり見ようとすると自然とカーソルって目線の先に行きませんか?
画像を見ようとすると自然とカーソルを画像の上へ持っていってしまい、その結果画像が半透明になって見にくくなるという…
とにかく記事内の画像が単純に見にくくなってしまう。
何故半透明にするのか?
マウスホバーで「影がついて画像が浮くように見える」とか「ボーダーの色が変わる」とかならまだ画像そのものの見やすさは変わらない。記事内の画像と言っても中にはリンクが付けられている画像だってありますからね。
そういった画像の場合はクリックできる事を知らせるためにも何かしらホバーした時に変化は必要だと思います。
しかし、半透明にしてしまうと画像が著しく見にくくなってしまう。
ホバーによるアニメーションを付けてリンクを知らせたい場合は、影をつけたりボーダーをつけたり半透明にする以外の方法にした方がいいのではないでしょうか?
そもそも文章中の画像にアニメーションは必要なのか?
しかし、やはり記事内の画像にはホバーアニメーションを付けず、ジッとさせておくべきだと思います。勿論リンクの場合は何かしらホバーによるアニメーションがあった方が絶対に分かりやすいけど、文章中に使われる画像はほとんどの場合が文章のイメージ画像だったり、補足だったり、解説のための画像だったりするので、アニメーションさせる意味はないかなと。
アニメーションって格好良いし、僕も特に意味もない部分にすぐアニメーションを付けてしまったりします。画像の半透明ってopacity:0.5;だけで済みますからね。他のアニメーションに比べると一瞬で出来るしとりあえずやっとこうみたいな感じで、去年の自分はとりあえずホバーしたら半透明にするようにしていました。
それでサイトがお洒落になるならいいかなと思っていましたが、その代わりにユーザビリティを損なっているかもしれないという事を少し意識する必要がありますよね。

Figmaでモックアップをすばやく作成する「Mockuuups Studio」
FigmaのSearch Menuを使用して必要なメニュー・コマンドをすばやく実行する
Figmaで図形の分割をして簡単にレイアウトを作成する拡張機能「Split shape」
Figmaで複数行テキストを1行ずつ分割するプラグイン「Nisa Text Splitter」
Figmaのパス周りの基本操作|基本的な描画方法からペンツールと直線ツールの細かい違いまで
Illustratorの選択系のツールを徹底的にまとめる
Figmaのサイズの大きい画像を縮小せずにインポートするプラグイン「Insert Big Image」
Figmaでテキストをカーブに合わせて変形させるプラグイン「arc」
Figmaの図形周りの基本操作|図形の作成方法から細かい設定項目まで
選択オブジェクトに合わせてアートボードを変更するillustratorのスクリプト
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
アクティビティモニタで「kernel_task」の暴走を落ち着かせるためには、CPU温度を下げる必要がある
Visual Studio CodeからFTPソフトのTransmitを使用する拡張機能「Transmit」
Dart Sassを使う上で1番基本的なネストやアンパサンドの書き方|Dart Sass入門
AlfredのWorkflowをカテゴリーごとに整理する
Visual Studio Codeでショートカットキーを変更する方法
ATOKで住所の入力をラクにする方法(郵便番号や町名からの住所変換)
MacBook Proでディスプレイのサイズ調整をして作業スペースを広げる
PNG画像の圧縮をpngquantとAutomatorを使って右クリックメニューからできるようにする
メールによくある「アーカイブ機能」が何なのか今まで知らなかったので調べてみた
Google Chromeのアップデートの影響?MacのGoogle Meetで画面共有ができないときに確認すること