かぎねこWebのディレクター、きょうへいです。
突然ですが、Webサイトをスマホやパソコンで見たときに、URLの左側に⚠️(三角ビックリマーク)や❗️(赤いビックリマーク)が出て不安になったことはありませんか?

実はこの三角ビックリマークが出ているサイトには、セキュリティ上に脆弱性がある可能性があります。
視覚的にも「ウイルスに感染した?」「個人情報が盗まれる?」と不安になりますよね。
そこで本記事では、三角ビックリマークの正体や取り外し方についてまとめてみました。
ぜひ参考にしてください^ ^
目次
1.なぜURLの左に三角ビックリマーク?

アドレスバーに表示される三角のビックリマークは、ブラウザがそのページのセキュリティに何らかの問題を検出したサインです。
重要なのは、まずは表示の意味を確認して優先度の高い対応を行うことです。
Googleやブラウザが表示する「赤いビックリマーク」の意味
赤い表示は「重大な警告」です。
フィッシング詐欺等の疑いがある際に出るため、この表示があるサイトでパスワードやクレジットカード情報を入力してはいけません。
httpとhttpsの違いと見分け方
あなたが見ているサイトのアドレスバーを見てみてください。
URLの最初の部分が「https(暗号化通信)」ではなく「http(非暗号化通信)」になっていませんか?
- http: 通信が暗号化されていないため、第三者にデータを盗み見られるリスクあり
- https: 通信が暗号化されており安全(通常は鍵アイコンが表示される)
スマホ(iPhone/Android)とパソコンで表示が違う理由
画面サイズの小さいスマホではアイコンのみ、パソコンでは「保護されていない通信」といったテキスト付きで詳しく表示される傾向があります。
同じサイトでも両環境で確認することが重要です。
2.三角ビックリマークのよくある原因2つ
サイトのURL部分に⚠️(三角ビックリマーク)が表示される原因としては、主に以下の2つが考えられます。
原因①:URLが「http」のまま(SSL化されていない)

まず最初に、あなたが閲覧しているサイトのURLが「https(暗号化通信)」ではなく「http(非暗号化通信)」になっていないかを確認しましょう。
サイト内の全てのコンテンツを「https(暗号化通信)」で通信できるようにすることを、SSL化といいます。
つまり、もしあなたが閲覧しているサイトがhttpページであれば、SSL化されていないことになります。
その結果セキュリティ上に問題があると判断され、三角ビックリマークがつくということです。
原因②:混在コンテンツ(Mixed Content)になっている

続いては混在コンテンツ(Mixed Content)についてです。
混在コンテンツとは簡単に言うと、SSL化されたhttpsページ内にhttp(非暗号化通信)で読み込んだファイルが混在している状態を指します。
つまりサイト自体はhttpsなのに、使っている画像やファイルがhttpのままなので、httpsとhttpが混在(ミックス)されていると判断され三角ビックリマークが表示されるということです。
「ホームページをSSL化したはずなのに三角ビックリマークが出てる!」とお困りの方は、混在コンテンツによるものだと考えられます。
3.【初心者向け】今すぐできる簡単解消法
まずは以下の3点を試してください。これで直る場合は一時的なエラーです。
①ページの再読み込み・ブラウザの再起動
まずはブラウザでページを再読み込みしてみてください。
次にブラウザ自体を再起動し、それでも直らなければ別ブラウザやプライベートモードで開いて挙動を比較してみると原因の切り分けになります。
これらは最も手早くできる初期対応です。
②キャッシュの削除
キャッシュが残っていて表示が更新できていない可能性も考えられます。
以下の手順に従い、キャッシュを削除してみてください。
- iPhone:設定→Safari→履歴とWebサイトデータを消去
- Android:Chrome→設定→履歴→閲覧履歴データを消去
- パソコン(windows):ctrl + shift + R
- パソコン(Mac):command + shift + R
キャッシュ削除後にスマホ・パソコンを再起動し、問題のページを再度開いて表示が改善されるか確認してください。
4.サイト運営者(ブログ/WordPress)向けの根本対処
上記の対策を行っても直らない、またはご自身のサイトで警告が出ているなど、どうしても直したい場合は、以下の対処法を確認してください。
①サイトの常時HTTPS化

まずは、サイトのURLがhttpページのままの場合の対策です。
結論から言うと、サイトURLをhttpからhttpsに変更するには契約しているサーバー情報を操作する必要があります。
参考としまして、エックスサーバーで常時SSL化する手順のリンクを以下に貼っておきます。
「契約しているサーバーがわからない!」「どうやってSSL化すればいいのかわからない!」という方は、お力になれるかもしれませんので一度お問い合わせください!
②混在コンテンツ(Mixed Content)の解消

続いてはMixed Contentの解消、つまりhttpsページ中にあるhttpコンテンツを修正する手順です。
もしあなたのサイトのURLがhttpsなのにも関わらず三角ビックリマークがついている場合は、この方法をお試しください。

まず調べたいサイトをパソコンで開き、F12キーを押すと上のような画面が出ます。(ディベロッパーツールといいます)
次に①のConsoleをクリックした後②の部分を押すと、Mixed Contentの原因となっている具体的なファイル名の一覧が表示されます。
これで、サイト内で使われているどのファイルがMixed Contentを引き起こしているかがわかります。
原因となっているファイルは、あなたのサイトが常時SSL化されている状態で、再度アップロードをし直す必要があります。

WordPressを利用されている方であれば、管理画面の「設定」→「一般」より上画像部分を見てみてください。
赤枠で囲っている部分がhttpsであれば、再度アップロードした時にSSL化された状態となりますので、Mixed Contentを解消することができます。
5.まとめ
本記事では、サイトのURLに⚠️(三角ビックリマーク)がつく原因とその対策についてご紹介しました。
本記事の内容をもう一度まとめてみましょう。
- 三角ビックリマークがつく原因は、サイトがSSL化されていないかMixed Contentのどちらか
- SSL化するには、あなたが契約しているサーバーを通して作業を行う必要がある
- Mixed Contentはディベロッパーツールを使って原因を特定しよう
どうしても解決しない、専門的なサポートが必要な方へ
もし「設定が難しくて自分では手に負えない」「どこに原因があるのか特定できない」とお困りの場合は、専門家への相談も一つの手です。
私たちかぎねこWebは、オンラインでのサポートを通じて、全国各地のサイト運営者様を対象にホームページ制作や保守・トラブル解決を承っております。
なお、当事務所の拠点である福岡市東区や、近隣エリア(新宮町・古賀市・福津市・糟屋郡など)にお住まいの方であれば、直接お会いしての対面相談も可能です。
警告マークの解消だけでなく、サイトの健康診断も行っておりますので、お気軽にご相談ください。
この記事を書いた人

しもせ きょうへい
Webディレクター
【ビジネスを加速させる戦略と設計】
福岡のIT企業を経て、東京の制作会社で多様なプロジェクトを主導。
マーケティング視点に基づいた「集客できるサイト設計」が得意です。
