本文
エレノア代表の豊島と申します。
エレノアのホームページは、2026年9月30日にリニューアルいたしました。公開後にサイトの設定を見直したところ、ブラウザに安全上の扱いを指示する「セキュリティヘッダー」は2種類しか設定しておらず、通信の暗号化にも古い方式が使える状態であることが判明いたしました。
そこで、2026年10月1日に6種類のセキュリティヘッダーを追加し、通信の暗号化をTLS 1.2以上に限定いたしました。同日にトップページを計測した結果、無料の診断サービスであるMDN HTTP ObservatoryではA+（130点）、securityheaders.comとSSL LabsでもA+の評価となりました。
本記事では、各設定の役割と、ページの表示や問い合わせフォームを止めずに導入した手順をご紹介いたします。ホームページの安全対策の見直しをご検討中の皆様のご参考になれば幸いです。
本記事の内容
- 3つの診断サービスでの計測結果
- エレノアが設定した8種類のセキュリティヘッダーと、通信の暗号化の設定
- CSP（コンテンツセキュリティポリシー）を、表示を止めずに導入した手順
セキュリティ診断の結果
2026年10月1日の計測で、エレノアのトップページ（eleanor-dev.com）は、MDN HTTP ObservatoryでA+（130点）、securityheaders.comとSSL LabsでA+の評価となりました。
計測の時刻は日本時間で、MDN HTTP Observatoryとsecurityheaders.comはセキュリティヘッダーを追加した後の13時57分、SSL Labsは通信の暗号化の設定を変更した後の14時47分です。
診断サービスごとの結果
| 診断サービス | 確認する内容 | 結果 |
|---|---|---|
| MDN HTTP Observatory（Mozilla） | セキュリティに関する12項目の試験 | A+（130点、12項目すべて合格） |
| securityheaders.com（Snyk） | 主要な6種類のセキュリティヘッダーの設定 | A+（6種類すべてを確認） |
| SSL Labs（Qualys） | 通信の暗号化（HTTPS）の設定と、既知の脆弱性 | A+（TLS 1.2と1.3のみに対応、診断の対象の脆弱性に該当なし） |
| PageSpeed Insights（Google） | パフォーマンス・ユーザー補助・おすすめの方法・SEOの4分類と、エージェントによるブラウジング | モバイルとPCの4分類が100、エージェントによるブラウジングは3項目すべて合格 |
MDN HTTP Observatoryの点数は、100点を基準に、試験の結果に応じて加点と減点を行う方式です。エレノアのサイトは、COOP（+10点）、CORP（+10点）、Referrer-Policy（+5点）、CSPのframe-ancestors（+5点）の設定で加点され、130点となりました。
PageSpeed Insightsの点数は、セキュリティヘッダーを追加する前と同じく、モバイルとPCの両方で満点を維持しております。
評価について
上記は、2026年10月1日にエレノアのトップページを計測した結果です。診断サービスの評価は、採点の基準の改定などによって変わることがございます。また、セキュリティヘッダーと通信の暗号化の設定は、特定の種類の攻撃の危険を減らすためのものであり、これだけでサイトに関わるすべての危険を防げるものではございません。
エレノアが設定した8種類のセキュリティヘッダー
エレノアのサイトでは、以前から設定していた2種類に6種類を加え、合計8種類のセキュリティヘッダーをすべてのページに設定しております。
セキュリティヘッダーは、Webサーバーがページと一緒にブラウザへ送る指示です。ブラウザは、この指示に従って、接続の方法や読み込んでよい内容を判断します。エレノアのサイトでは、配信の入口にあるプログラム（Cloudflare Workers）で、各ページにヘッダーを付けております。設定するヘッダーは、OWASP（Webアプリケーションのセキュリティに取り組む国際的な非営利団体）のSecure Headers Projectと、MDN HTTP Observatoryの試験と採点の基準を参考に選定いたしました。
設定したヘッダーの一覧
| ヘッダー | 役割 | エレノアの設定 |
|---|---|---|
| Strict-Transport-Security（HSTS） | 常にhttpsで接続させる | 期間1年、サブドメインを含む（今回追加） |
| Content-Security-Policy（CSP） | 読み込みと実行を許可する内容を限定する | strict CSP（今回追加） |
| X-Frame-Options | 他のサイトの枠（iframe）への埋め込みを禁止する | DENY（今回追加） |
| Permissions-Policy | 使用しない端末の機能を止める | 8つの機能を停止（今回追加） |
| Cross-Origin-Opener-Policy（COOP） | 他のサイトのウィンドウから、ページを操作できないようにする | same-origin（今回追加） |
| Cross-Origin-Resource-Policy（CORP） | 他のサイトがページを読み込めないようにする | ページ（HTML）にsame-origin（今回追加） |
| X-Content-Type-Options | ファイルの種類の推測を止める | nosniff（以前から設定） |
| Referrer-Policy | 他のサイトへ送る参照元の情報を絞る | strict-origin-when-cross-origin（以前から設定） |
HTTPSでの接続の強制（HSTS）
HSTSは、一度サイトを訪れたブラウザに対して、以後は必ずhttpsで接続するよう指示するヘッダーです。httpでの接続を経由しないため、通信の途中で内容を読み取られたり書き換えられたりする危険を減らすことができます。
エレノアのサイトでは、期間を1年とし、サブドメインも対象に含めております。サブドメインを含める前に、すべてのサブドメインがhttpsで配信されていることを確認いたしました。
なお、HSTSには、ドメインをブラウザに組み込まれた一覧に登録するための「preload」という指定もございます。登録すると、取り消しが利用者のブラウザに反映されるまでに数か月かかるため、今回は付けておりません。
端末の機能の制限（Permissions-Policy）
Permissions-Policyは、ページで使用できる端末の機能を指定するヘッダーです。エレノアのサイトでは、カメラ、マイク、位置情報、加速度センサー、ジャイロスコープ、磁気センサー、ブラウザの決済機能、USB機器の8つの機能を、使用しない設定にしております。
使わない機能を止めておくことで、万一、意図しないスクリプトが読み込まれた場合も、これらの機能は使われません。
埋め込みと別のウィンドウからの保護（X-Frame-Options・COOP・CORP）
X-Frame-Optionsは、他のサイトがエレノアのページを枠（iframe）に埋め込むことを禁止するヘッダーです。透明にしたページを重ねて、利用者に意図しない操作をさせる「クリックジャッキング」という攻撃への対策です。CSPのframe-ancestorsという指定でも、同じ制限を掛けております。
COOPは、他のサイトのウィンドウからエレノアのページを操作できないようにするヘッダーです。CORPは、他のサイトがエレノアのページ（HTML）を読み込むことを禁止します。画像などは他のサイトから参照されることがあるため、CORPの対象外としております。
CSP（コンテンツセキュリティポリシー）の設定方法
CSPは、Googleが推奨する「strict CSP」の方式で設定いたしました。
CSPは、ページが読み込んでよいスクリプトや画像、データを送ってよい先などを、ブラウザに指示するヘッダーです。悪意のある第三者がページにスクリプトを埋め込む攻撃（クロスサイトスクリプティング、XSS）を受けた場合も、CSPで許可していないスクリプトはブラウザが実行しないため、被害を抑えることができます。
strict CSPの仕組み
strict CSPでは、実行してよいスクリプトを、スクリプトの中身から計算したハッシュ（SHA-256）で指定します。ハッシュは中身が1文字でも変わると別の値になるため、ページに後から埋め込まれたスクリプトは、ハッシュが一致せず実行されません。
あわせて指定している'strict-dynamic'は、ハッシュで許可したスクリプトが読み込むスクリプトにも、実行を許可する指定です。この方式では、HTMLに直接書いた外部のスクリプトは実行されません。そのため、問い合わせフォームの迷惑送信対策（Cloudflare Turnstile）は、ハッシュで許可したスクリプトから読み込む形に変更いたしました。
スクリプトには、CSPの効果を弱める'unsafe-inline'（ページ内のスクリプトをすべて許可する指定）と'unsafe-eval'（文字列をスクリプトとして実行する機能を許可する指定）を使用しておりません。
読み込みを許可している内容
| 対象 | 許可している内容 |
|---|---|
| スクリプト | ハッシュで許可した3種類のスクリプトと、それらが読み込むスクリプト |
| スタイル（CSS） | 自サイトのCSSと、ページ内に記述したCSS |
| 画像・フォント | 自サイトのファイルのみ |
| 通信 | 自サイト、問い合わせの受け口、迷惑送信対策のサービス |
| フォームの送信先 | 自サイトと問い合わせの受け口 |
| 埋め込む枠（iframe） | 迷惑送信対策のサービスのみ |
| 他のサイトへの埋め込み | 禁止 |
<base>要素・<object>要素 | 禁止 |
スタイルについては、'unsafe-inline'を許可しております。エレノアのサイトは、表示を速くするためにCSSを各ページに埋め込んでおり、要素に直接書いたスタイルも使用しているためです。スタイルは、スクリプトと異なり、プログラムとして実行されることはございません。strict CSPも、スクリプトを対象とした方式です。
ハッシュの自動計算とサイトの生成時の検査
エレノアのサイトは、公開の前にHTMLをまとめて生成する方式（静的サイト）で制作しております。生成のたびに全ページのスクリプトのハッシュを自動で計算し、CSPを組み立てる仕組みを設けました。2026年10月1日時点では、24ページで使われている3種類のスクリプトが対象です。スクリプトを修正しても、次の生成でハッシュが計算し直されるため、CSPを手作業で更新する必要はございません。
あわせて、CSPの下で動かなくなる書き方がHTMLに含まれている場合は、生成を止めて、公開されないようにしております。対象は次のとおりです。
- HTMLに直接書いた外部のスクリプトの読み込み
onclickなどの属性に書いたスクリプトjavascript:で始まるリンク- 外部のサイトの画像・フォント・CSSの読み込み
表示を止めずにCSPを導入した手順
CSPは、違反を報告するだけのモードで公開して確認した後、実際に読み込みを止めるモードに切り替えました。
CSPの指定に漏れがあると、必要なスクリプトまで止まり、メニューが開かない、フォームを送信できないといった不具合が起こります。違反を報告するだけのモード（Content-Security-Policy-Report-Only）では、ブラウザは違反を記録するだけで、読み込みは止めません。利用者への影響を出さずに、設定の誤りを確認できます。
エレノアでは、次の手順で導入いたしました。
- 1. 公開の前に、手元の環境で全24ページを、画面を表示せずに動かすChrome（ヘッドレスChrome）で開き、違反を記録する仕組みで確認（違反は0件）
- 2. 違反を報告するだけのモードで公開し、本番のページでも違反がないことを確認
- 3. 問い合わせフォームの迷惑送信対策が、通常のChromeで確認を完了できることを確認
- 4. 読み込みを止めるモード（
Content-Security-Policy）に切り替え - 5. 切り替えた後に、違反が0件であることと、問い合わせフォームが動作することを再確認
通信の暗号化（TLS）の設定とSSL Labsの評価
通信の暗号化は、古い方式であるTLS 1.0とTLS 1.1の利用を停止してTLS 1.2以上に限定し、SSL LabsでA+の評価となりました。
TLS（Transport Layer Security）は、ブラウザとWebサーバーの間の通信を暗号化する仕組みで、httpsで始まるページの通信に使われています。SSL Labs（Qualysが無料で提供している診断サービス）は、証明書、対応している暗号化の方式、既知の脆弱性などを確認し、HTTPSの設定をA+からFの段階で評価します。
SSL Labsの評価がBだった原因
設定を見直す前の2026年10月1日の計測では、SSL Labsの評価はBでした。原因は、1999年に定められたTLS 1.0と、2006年に定められたTLS 1.1が、まだ使える設定になっていたことです。
この2つの方式には弱点が知られており、2021年3月に公開されたRFC 8996で、使用しないことが求められております。SSL Labsは、TLS 1.0またはTLS 1.1が使える場合、評価をBまでに抑えます。
TLSの最低バージョンの変更
配信に使用しているCloudflareの管理画面で、受け付けるTLSの最低バージョン（Minimum TLS Version）を、TLS 1.0からTLS 1.2に変更いたしました。現在は、TLS 1.2（2008年）とTLS 1.3（2018年）でのみ接続を受け付けております。
変更後、TLS 1.0とTLS 1.1では接続できないことを手元の環境で確認したうえで、SSL Labsで再度診断いたしました。診断の対象となった4つの接続先（IPアドレス）のすべてで、A+の評価となりました。
SSL LabsでA+の評価を得るには、TLSの設定に加えて、前述のHSTSを長い期間で設定していることも条件の一つとされております。エレノアのサイトでは、HSTSの期間を1年としております。
閲覧できなくなる端末とブラウザ
SSL Labsは、代表的な端末とブラウザの組み合わせ68種類で、接続できるかどうかを試します。変更後の診断では52種類が接続でき、接続できなかった16種類は、Android 4.3以前の標準ブラウザ、Internet Explorer 10以前、OS X 10.8以前のSafariなど、おおむね2013年ごろまでに提供されていたものでした。
Chrome、Firefox、Edgeなどの現在の主なブラウザは、2020年にTLS 1.0とTLS 1.1の対応を終了しております。そのため、通常の閲覧環境への影響はないと判断いたしました。
PageSpeed Insightsの参考項目と今後の課題
PageSpeed Insightsの「おすすめの方法」には、点数に含まれない参考の項目として、セキュリティの設定を確認する項目がございます。ヘッダーを追加した後の計測では、クリックジャッキングの対策とオリジンの分離の2項目に、指摘はございませんでした。
残っている指摘は、次の3項目です。いずれも内容を確認したうえで、現時点では対応しておりません。
参考項目の結果（2026年10月1日13時57分の計測）
| 項目 | 指摘の内容 | エレノアの対応 |
|---|---|---|
| CSPによるXSSの対策 | 古いブラウザのために'unsafe-inline'を追加する提案（重要度：中） | 追加しておりません。ハッシュに対応していない古いブラウザに向けた指定で、現在の主なブラウザでは無視されます |
| HSTS | preloadの指定がない（重要度：中） | 取り消しに数か月かかるため、付けておりません |
| Trusted Types | Trusted Typesの指定がない（重要度：高） | 導入しておりません。今後の検討事項です |
Trusted Typesは、スクリプトによるページの書き換えを悪用した攻撃（DOMベースのXSS）を防ぐ仕組みです。導入には、外部のサービスを含め、ページで動くすべてのスクリプトが対応している必要があるため、対応状況を確認したうえで検討してまいります。
よくある質問
セキュリティヘッダーとは何ですか？
Webサーバーがページと一緒にブラウザへ送る、安全上の扱いについての指示です。常にhttpsで接続させる、他のサイトへの埋め込みを禁止する、実行してよいスクリプトを限定するといった指示がございます。ブラウザは、これらの指示に従って動作します。
CSPを設定すると、サイトが動かなくなることはございますか？
動かなくなる場合がございます。CSPで許可していないスクリプトや画像は、ブラウザが読み込みを止めます。指定に漏れがあると、メニューやフォームなど、スクリプトで動く部分が使えなくなります。そのため、違反を報告するだけのモード（Content-Security-Policy-Report-Only）で確認してから、読み込みを止めるモードに切り替える方法が確実です。
TLS 1.0とTLS 1.1を停止すると、サイトを閲覧できなくなる方はいらっしゃいますか？
ごく古い端末とブラウザでは、閲覧できなくなります。エレノアのサイトでSSL Labsが試した68種類のうち、接続できなかったのは、Android 4.3以前の標準ブラウザやInternet Explorer 10以前など、おおむね2013年ごろまでに提供されていた16種類です。現在の主なブラウザはTLS 1.2以上に対応しているため、通常の閲覧には影響はございません。
自社のホームページのセキュリティヘッダーは、どこで確認できますか？
無料の診断サービスでご確認いただけます。MDN HTTP Observatoryやsecurityheaders.comでは、URLを入力するだけで、設定されているヘッダーと評価が表示されます。securityheaders.comには、診断結果を一覧に表示しないための「Hide results」という選択がございます。通信の暗号化の設定は、SSL Labsでご確認いただけます。
セキュリティヘッダーを設定すれば、サイトの対策は十分ですか？
十分とは申せません。セキュリティヘッダーは、スクリプトの埋め込みによる攻撃や、他のサイトへの埋め込みを悪用した攻撃など、特定の種類の危険を減らすための設定です。ソフトウェアの更新や、管理画面のパスワードの管理など、ほかの対策とあわせて行うことが大切です。
まとめ
- 2026年10月1日に6種類のセキュリティヘッダーを追加し、通信の暗号化をTLS 1.2以上に限定。トップページの計測で、MDN HTTP Observatory（130点）、securityheaders.com、SSL LabsのすべてでA+
- CSPはGoogleが推奨するstrict CSPの方式とし、スクリプトのハッシュはサイトの生成のたびに自動で計算
- 違反を報告するだけのモードで確認してから切り替え、表示と問い合わせフォームを止めずに導入
本ブログでは、店舗や中小規模の事業者の皆様に向けて、ホームページ運用に役立つ情報を順次発信してまいります。LP制作やホームページ制作の内容と料金は、サービス・料金のページに掲載しております。ホームページのリニューアルや保守をご検討の際は、お問い合わせよりお気軽にご相談ください。