静岡・浜松のWebマーケティング|株式会社シーエムエー

お問い合わせ

CMA BLOG

株式会社シーエムエー ホーム > CMA BLOG > ホームページ制作 > 常時SSLが必須に! 7月リリースのGoogle Chrome 68からhttps未対応では 「保護されていません」と警告表示が開始!

ホームページ制作 SEO対策 常時SSLが必須に! 7月リリースのGoogle Chrome 68からhttps未対応では 「保護されていません」と警告表示が開始!

  • このエントリーをはてなブックマークに追加

皆さんこんにちは。デザイン部部長の坂本です。

2018年7月24日に「Google Chrome」がのバージョン68にアップデートされました。
https未対応のサイトではアドレスバーに 「保護されていません」と警告表示されるようになりました。

今まではお問い合わせなどの入力フォームのページでSSL化していれば問題なかったのですが、
今後はすべてのページがSSL化の対象になります。

SSL(Secure Sockets Layer)は、インターネット上でデータのやりとりを暗号化することで
悪意のあるハッカーからの攻撃や、個人情報の漏洩を防ぎます。
ユーザに安全で安心にご利用いただくためにも常時SSL化は必須と言えるでしょう。

また、日本におけるGoogle Chromeの国内のシェアは51%もあり影響は大きいと言えます。

■ 国内のブラウザのシェア(2018年6月)
http://gs.statcounter.com/browser-market-share/desktop/japan/#monthly-201807-201807-bar

Google Chrome67までの表示

今まで(Google Chromeのバージョン67)

https対応なら「保護された通信」となり緑色になります。https未対応だとグレーで警告のアイコンが表示されるだけでした。
図:Google ChromeのアドレスバーにおけるHTTPSとHTTPの表示の違い

これから(Google Chromeのバージョン68)

https未対応だと「保護されていません」と警告が文字で表示されるようになります。
図:Google Chromeのバージョン68の表示例

常時SSL対応の手順

今回は専用サーバ(VPS)をご契約し、独自SSLを設置した場合でご説明します。

【1】SSL証明書の発行
【2】htaccessでhttp→httpsにリダイレクト設定
【3】Wordpressの設定の変更
【4】外部サービスの読み込みファイルやJavascriptのパスを変更する

【1】SSL証明書の発行

SSLの証明書の発行はサーバ会社によって取得方法が違うため、
ご契約しているサーバ会社のWebサイトや問い合わせをして確認してください。

【2】htaccessでhttp→httpsにリダイレクト設定

ルート直下に以下の記述を追加してください。
プランによってはhtaccessが設置できないサーバもありますので、
ご契約のサーバ会社に問い合わせて確認してください。

RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]

【3】Wordpressの設定の変更

WordPressなどのCMSをお使いの場合は「Wordpressアドレス」や「サイトアドレス」の設定をhttp→httpsに変更してください。
図:Wrodpressのパス

【4】外部サービスの読み込みファイルやJavascriptのパスを変更する

httpから始まるURLで読み込んでいる場合、httpsに変更してください。
外部サービス自身がSSL化対応されていなければ保護されませんのでご注意ください。
図:埋め込みパスの確認

Google Chromeの今後の流れ

Google Chromeのバージョン70が2018年10月頃に予定されています。
三角形の警告アイコンと赤文字で「保護されていない通信」と表示されるようになると言われています。
ユーザーに対しての安心感・信頼感をしっかり担保するためにも
早めの対応をしていきたいですね。

まとめ

ご契約しているサーバ会社によってSSLの証明書の導入方法は
違いますのでSSLの証明書をこれからの導入する場合は、
契約しているサーバ会社やホームページを制作した会社に一度問い合わせてみてください。

シーエムエーでは常時SSL化導入のサポートも行っています。
ご相談も承りますのでぜひお問い合わせください。

  • このエントリーをはてなブックマークに追加

人気の記事ランキング

  • posted on 2023/02/082023年度版 Google PageSpeed Insights(ページスピードインサイト)を使って読み込み速度を改善したら、何点になるのかチャレンジしてみた

  • posted on 2022/04/21WordPressで画像をWebP(ウェッピー)に対応する方法

  • posted on 2023/07/072023年12月末までにスマートフォン用楽天GOLDが提供終了!新店舗トップページに移行するための16の機能をご紹介(事前申請で2023年8月2日に自動移行も)

  • posted on 2022/10/21DockerでPHP環境を簡単に構築してみよう

  • posted on 2018/04/11構造化マークアップはSEO対策に効果があるのかやってみた

おすすめタグ

ECサイト 動画 HTML ASP カスタマイズ ECcube レクリエーション 創業記念日 wordpress PageSpeed Insights スピードアップデート 動画広告 SSL 構造化マークアップ 構造化データ Instagram広告 クリック率 TLS フォント デザイン Chrome HowTo 文字 Transport Layer Security ノンデザイナー リッチリザルト ハウツー Facebook広告 保護されていない通信 Facebook Audience Network 写真 ウェブサイト翻訳 CSS 動画制作 AMP 広告 HTML5広告 Google Chrome videoタグ GoogleMapsPlatform Zapier iPhone Google my map ワイヤーフレーム Google for jobs Googleしごと検索 撮影 iPad 一眼レフカメラ Core Web Vitals リモート Adobe XD 自作PC PC組み立て 自作パソコン 画質パラメーター サイズパラメーター レクタングルバナー アセット生成 タスクランナー gulp.js node.js WebP画像 楽天GOLD スマートフォン用新店舗トップページ スマートオブジェクト Threads(スレッズ) Adobe Firefly 画像生成AI 生成塗りつぶし 生成拡張 Adobe MAX Japan 2023 UI UX Adobe Stock アンチックフォント Instagram 初心者 ディスプレイ広告 Photoshop PHP Google Search Console XMLサイトマップ shopify ショッピングサイト ショッピファイ Shopify使い方 WebP リモートワーク クラウドドキュメント remotework IE コーディング モダンブラウザ gap gridレイアウト object-fit aspect-ratio any-hover docker プラグイン Adobe Express

Top