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

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

Illustratorの「埋め込み」を行うスクリプトで、画像の埋め込みをショートカットで行う!
Figmaで図形の分割をして簡単にレイアウトを作成する拡張機能「Split shape」
Figmaで複数行テキストを1行ずつ分割するプラグイン「Nisa Text Splitter」
Figmaで画像加工の幅を広げるプラグイン「Filter / effects」
Sketchのパス周りの基本操作|基本的な描画方法からベクターツールと直線ツールの違いまで
Figmaで画像からカラーパレットを生成するプラグイン「Image Palette」
FigmaのAuto Layout入門|繰り返しのレイアウトやコンテンツに応じて横幅可変するボタンをラクに作る
Figmaのフレームを一瞬で整列するプラグイン「LilGrid」
Sketchの画像周りの基本操作|画像の追加方法や色補正、切り抜き方法まで
Figmaのフォント選択時に分かりやすくプレビューしてくれるプラグイン
iTerm2で「Use System Window Restoration Setting」を設定しているとアラートが表示されて機能しない
Google Chromeのサイト内検索(カスタム検索)機能を別のプロファイルに移行する方法
iPadで入力モードを切り替えずに数字や記号をすばやく入力する方法
iPhoneやiPadでYouTubeの再生速度を3倍速や4倍速にする方法
Keynoteで有効にしているはずのフォントが表示されない現象
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
AirPodsで片耳を外しても再生が止まらないようにする方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
chezmoi(シェモア)で始めるdotfiles管理
GitHubの通知を見逃さない!通知に特化したアプリ「Gitify」
Keyboard Maestroの変数基礎
Neovimを使い始める最初の一歩として便利な「LazyVim」
ウェブサイトをmacOSアプリとしてラッピングする「Unite Pro」
Keyboard Maestroの「Macro Debugger」で複雑なマクロのデバッグを行う方法
無料版でも高機能なランチャーアプリ「Raycast」の基本機能と環境設定
OnyXでターミナルを使わずにmacOSの詳細設定を行う
軽量で高速なターミナルエミュレーター「Ghostty」の設定方法
Eagleで実現するクリエイティブ素材の簡単管理