【2018年版】http,httpsは省略しない方がいい

外部ファイルのリンクを指定するときにhttp、httpsを省略しているコードを時々見かけます。

サイトによって指定方法が異なっていたので、省略するべきかそうじゃないのか調べたことをまとめました。

調べてみると数年前まではGoogleも省略することを推奨していたようですが、現在は非推奨となっています。(根拠を後述してあります。)

参考にする記事の日付に注意してください。

この記事は2017年度のGoogle、Firefoxの情報を元に書いているため他記事よりも参考になると思います。

スポンサードサーチ



省略する意味は?

CSSやJavaScriptのURLはhttps、httpsのプロトコルを省略して指定することができます。

これはコードの短縮や速度の向上で検索するとテクニックの一つとしてよく紹介されています。

実際に2012年時点の「Google HTML/CSS Style Guide」ではそのように記載されていたようで、それを根拠として紹介しているサイトがいくつかありました。

ただ、現在では非推奨とされているテクニックなので注意してください。

 

httpsを使用しよう

httpsはSSL/TLSプロトコルを用いてサーバーの認証や通信の暗号化を行うため、中間者攻撃や盗聴を防ぐことができます。

Google HTML/CSS Style Guide」では以下のように推奨、非推奨の例が記載されています。

現在の検索エンジンはGoogleが基準になっているため、Googleのコーディングガイドに合わせておいた方がいいですね。

 

httpsのデメリット

HTTPSを使用するのは重要です。ただ、デメリットとして以下のような点があります。

指定するリンク先のURLがSSL化されている(https://で始まる)とは限らない

その場合は、httpsを使用するしかありませんし、短縮もありだと思います。

注意点としては、

  • 「https」で開いたページに「http」で指定されたURLが存在する場合は「混在コンテキスト」と扱われるため注意が必要
  • ローカルで編集中の場合、https、httpsの短縮をするとうまく動作しない

SSL化にはコスト(時間や費用)がかかる

    • SSLの証明書を発行するのに費用がかかる。ただ、無料のSSLサーバー証明書「Let’s Encrypt」という者があるらしいです。

【無料でSSL化】さくらでLet’s Encryptを使用してみた

2017年10月18日
  • 使用しているサーバーが常時SSL化に対応しづらい場合がある
  • HTTPSには非対応のツール、アフェリエイト広告がある

 

参考サイト、書籍

The protocol-relative URL – Paul Irish
上記はURL短縮推奨の例で紹介されていましたが、2014年に「このテクニックはアンチパターンです。httpsを使いましょう」と追記されています

Google HTML/CSS Style Guide

混在コンテンツのブロック | Firefox ヘルプ