先日、お客様より「ネットバンキングを利用しようと思ったら、画面が崩れてしまった操作できない。助けて」との問合せが。
現象を確認するため、画面キャプチャしたものをメールで送ってもらったら以下の画像が。
なんじゃこれは。
ボタン（があるはず）や、表示されている内容の上に×（バツ）や黒い何かがかかっている様な、画面の一部が黒くなってしまっています。
お客様に詳しき聞いてみると「何か特別な操作をしていたわけではなく、突然、脈絡なく画面がこうなってしまった」とのこと。
調べてみると、「ハードウェアアクセラレーション」を使っていることが原因でした。
ハードウェアアクセラレーションとは
ハードウェアアクセラレーションとは現代のブラウザーに搭載されている技術であり、コンピューターのパフォーマンスをより高速するためにあります。オンラインゲームや動画の再生など、通常より高度な処理が必要なページをロードするときなどに使います。
残念ながら、ハードウェアアクセラレーションは特定のグラフィックカード、特に旧式のグラフィックカードと相性が悪く、動画の再生などの際に問題が起きる場合があります。（vimeo ヘルプセンターより引用）
上記は動画の不具合を例に上げていますが、ブラウザの不具合もこれに該当します。
ハードウェアアクセラレーターを無効化することにより、解消します。
解決方法
Chrome の場合
- 新しいタブを開き、「chrome://flags」に行く。
- 「ハードウェアアクセラレーションによる動画デコード」を見つけ、有効にする
- Chromeを再稼動
Internet Explorer の場合
- 設定（ギア）アイコンをクリック。
- インターネットオプションを選択。
- 詳細設定タブを選択。
- アクセラレーターによるグラッフィクの下にある「GPUレンダリングでなく、ソフトウェアレンダリングを使用する」をチェックしてください。
- 適用、そしてOKをクリック。
- Internet Explorer 11を再起動してください
以下のサイトを参考にさせていただきました。ありがとうございました。
Microsoft EdgeでGPUレンダリングの設定を変更する方法
https://121ware.com/qasearch/1007/app/servlet/relatedqa?QID=018524
YESノート：chromeで画面の一部が黒くなる現象の解消方法
http://yesnote-jp.com/blog/fix-chrome-turns-black/
vimeo ヘルプセンター：ハードウェアアクセラレーションって何？どんな問題を起こす可能性があるの？
https://help.vimeo.com/hc/ja/articles/224980748-%E3%83%8F%E3%83%BC%E3%83%89%E3%82%A6%E3%82%A7%E3%82%A2%E3%82%A2%E3%82%AF%E3%82%BB%E3%83%A9%E3%83%AC%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%A3%E3%81%A6%E4%BD%95-%E3%81%A9%E3%82%93%E3%81%AA%E5%95%8F%E9%A1%8C%E3%82%92%E8%B5%B7%E3%81%93%E3%81%99%E5%8F%AF%E8%83%BD%E6%80%A7%E3%81%8C%E3%81%82%E3%82%8B%E3%81%AE-