まず押さえたい4つの観点
HTMLの公開前チェックは、項目が多いほど抜けが出ます。やみくもに見直すより、観点を分けてから点検したほうが確実です。大きく分けると「表示は正しいか」「中身に問題はないか」「誰に見せるか」「公開後にどう運用するか」の4つになります。
この記事では、この4観点に沿ってチェック項目を並べています。まずは全体像をつかんでから、自分の作ったページに当てはまる項目を順に確認していきましょう。社外に渡す資料なのか、社内レビュー用なのかによって、重視すべき観点も変わってきます。
- 表示: ローカルで見えていた通りに公開先でも表示されるか
- 中身: 機密情報や不要なファイルが混ざっていないか
- 公開範囲: 想定した相手だけが見られる設定になっているか
- 公開後: 期限や差し替え、ログ確認の運用を決めているか
表示の崩れを公開前につぶす
手元のブラウザでは問題なく見えていたのに、公開した途端に画像が表示されない、CSSが効かない、といったトラブルはよくあります。原因の多くは、ファイルの参照パスが手元の環境に依存していることです。
とくにZIPでまとめて公開する場合は、フォルダ構成のままパスが解決できるかが重要になります。画像やCSS、フォントへのリンクが「C:¥…」のような絶対パスや、特定フォルダ前提の指定になっていないかを確認しましょう。日本語が文字化けしていないか、スマートフォンで見たときにレイアウトが崩れないかも、公開前に見ておきたいポイントです。
- 画像・CSS・JSへのリンク切れがないか
- フォントが正しく読み込まれて表示されるか
- 日本語が文字化けしていないか
- スマートフォン幅でレイアウトが崩れないか
- 複数ページある場合、ページ間のリンクがたどれるか
よくあるNG例と安全な直し方
HTML公開前では、「検索に出さない」と「見られないようにする」を混同しないことが重要です。noindexやrobots.txtは検索エンジンへの指示であり、アクセス制限そのものではありません。
安全に共有するには、誰に見られると困るかを先に決め、URL共有だけで足りるのか、認証や期限が必要なのかを選びます。共有相手と機密度が決まったら、URLのみ・パスワード・メール認証・会社ドメイン認証のどれで渡すかを選びます。
- NG: 機密情報入りHTMLを認証なしURLで共有し、noindexだけで安心する
- OK: パスワード・メール認証・会社ドメイン認証で閲覧者を絞る
- NG: テスト用APIキーや社内URLをHTML内に残したまま渡す
- OK: 公開前に外部送信先、秘密情報、フォーム送信先を確認する
中身に「出してはいけないもの」が混ざっていないか
表示が整っていても、ファイルの中身に問題が残っていることがあります。とくに気をつけたいのが、ソースコードに直書きされたAPIキーやパスワード、社内向けのコメント、個人情報などです。一度公開すると、リンクを知った相手にはダウンロードもされ得るため、公開前の確認が肝心です。
あわせて、静的公開に不要なファイルが混ざっていないかも見ておきましょう。設定ファイルやメモ書き、テスト用のデータなどが残ったままだと、意図せず情報が漏れる原因になります。また、HTMLは静的に公開されるため、PHPなどサーバー側で動く処理は動作しません。フォームの送信先が外部サービスを指している場合は、その挙動も把握しておく必要があります。
- APIキーやパスワードがソースに直書きされていないか
- 社内向けコメントや個人情報が残っていないか
- 公開に不要な設定ファイルやメモが含まれていないか
- 外部スクリプトやフォーム送信先が意図したものか
誰に見せるか、公開範囲を決める
公開前チェックで見落とされがちなのが、公開範囲の設定です。社外秘の提案書を「リンクを知っていれば誰でも見られる」状態で配ってしまうと、転送一つで想定外の相手に届く恐れがあります。中身の機密度に応じて、見せる相手をどこまで絞るかをあらかじめ決めておきましょう。
検索結果に出さないためのnoindexは便利ですが、これはアクセス制御ではない点に注意が必要です。検索避けと、閲覧できる人を限定することは別の話です。本当に限られた人だけに見せたい場合は、パスワードや本人確認といった認証を組み合わせて考えるのが安全です。
- 公開範囲を「全員」「特定の人」のどちらにするか決める
- 機密資料はリンク共有だけで済ませない
- noindexは検索避けであり、閲覧制限ではないと理解する
- 必要なら認証で閲覧者を限定する
ギガサイト便で公開前チェックから公開まで進める手順
ここまでのチェック項目を、実際の公開作業に落とし込んでみます。ギガサイト便は、HTMLやZIP一式を認証付きの共有URLとして公開できるサービスで、サーバー構築やデプロイ設定は不要です。アップロード時に中身の兆候を検出して警告してくれるため、公開前チェックの一部を仕組みで補えます。
下記の手順で進めると、表示・中身・公開範囲・公開後の4観点をひと通り押さえながら公開できます。匿名でその場限りの共有を試したい場合は、トップページにファイルをドロップするだけでも共有URLを発行できます。
- トップページにHTMLまたはZIPをアップロードする
- セキュリティスキャンの警告（APIキーらしき文字列や外部スクリプト依存など）を確認する
- 警告内容を理解したうえで、修正するか公開を続けるか判断する
- 公開後のプレビューで表示崩れや文字化けがないか確かめる
- 認証方式を「URLのみ・パスワード・メール認証・会社ドメイン認証」から選ぶ
- 公開期限を設定し、期限切れで自動的に閲覧できなくなるようにする
- 必要に応じてURL末尾のスラッグを整え、共有先に伝える
公開後に備えておくこと
公開はゴールではなく、運用の始まりです。内容を更新したくなったとき、同じURLのままファイルを差し替えられれば、相手にリンクを送り直す手間がありません。修正のたびに新しいURLが増えて管理が煩雑になる、という事態を避けられます。
また、いつ誰がアクセスしたかをログで確認できると、想定外の閲覧に気づきやすくなります。公開期限が来れば自動的に見られなくなるよう設定しておけば、消し忘れによる長期放置も防げます。公開前のチェックと公開後の運用をセットで考えることで、HTML公開はぐっと安心できるものになります。
- 内容を更新するときは同じURLのまま差し替える
- アクセスログで閲覧状況を確認する
- 公開期限を設定し、不要になったら見られない状態にする
よくある質問
HTML公開前に最低限チェックすべき項目は何ですか
表示崩れやリンク切れがないか、機密情報や不要なファイルが混ざっていないか、そして誰に見せるかの公開範囲が適切かの3点はとくに重要です。中身を一度公開するとリンク経由でダウンロードされ得るため、APIキーや個人情報の混入は公開前に必ず確認してください。
手元では表示できていたのに公開すると画像やCSSが崩れるのはなぜですか
多くは、ファイルの参照パスが手元の環境に依存していることが原因です。絶対パスや特定フォルダ前提の指定になっていないかを見直しましょう。ZIPで公開する場合は、フォルダ構成のままパスが解決できるかも確認すると安心です。
noindexを付ければ他人に見られませんか
いいえ。noindexは検索結果に出さないための指定であり、アクセス制御ではありません。リンクを知っている人は引き続き閲覧できます。閲覧できる人を限定したい場合は、パスワード認証やメールによる本人確認などを組み合わせて検討してください。
公開後に内容を修正したくなったらどうすればよいですか
サービスによっては、同じURLのままファイルを差し替えられます。これなら共有先にリンクを送り直す必要がなく、URLが増えて管理が煩雑になることも防げます。あわせてアクセスログや公開期限の設定も確認しておくと、公開後の運用が安定します。
noindexを設定すれば認証は不要ですか？
不要ではありません。noindexは検索結果への表示を抑えるための指定で、URLを知っている人の閲覧を止める仕組みではありません。閲覧者を制限したい場合は認証が必要です。