共有HTMLの黒塗りは見破られる｜マスキングの正しいやり方

見た目の黒塗りは中身を消していない

HTMLで文字の上に黒い背景を重ねたり、文字色を背景と同じにしたりして隠すと、画面上は読めなくなります。しかし元の文字データはページの中にそのまま残っています。

残っている文字は、マウスでドラッグして選択しコピーすれば、別の場所に貼り付けて読めてしまいます。見た目を変えただけで、データそのものは消えていないからです。

つまり、見えなくすることと、読めなくすることは別です。本当に隠したい情報は、見た目を覆うのではなく、データ自体を取り除く必要があります。

復元できてしまう典型パターン

黒塗りのつもりが中身を残してしまう例には、いくつか決まった形があります。心当たりがないか確認してみてください。

• 文字の上にCSSで黒い帯を重ねただけ（文字は選択でコピーできる)
• 文字色を背景と同じにして見えなくしただけ（同様にコピーで露見）
• 画像に黒い四角を重ねたが、元画像のファイルも一緒に含めてしまった
• コメントや非表示要素として元の文を残している
• ページのソースや別ファイルに元データが残っている

よくあるNG例と安全な直し方

共有HTMLの黒塗りは見破られる｜マスキングの正しいやり方では、「検索に出さない」と「見られないようにする」を混同しないことが重要です。noindexやrobots.txtは検索エンジンへの指示であり、アクセス制限そのものではありません。

安全に共有するには、誰に見られると困るかを先に決め、URL共有だけで足りるのか、認証や期限が必要なのかを選びます。共有相手と機密度が決まったら、URLのみ・パスワード・メール認証・会社ドメイン認証のどれで渡すかを選びます。

• NG: 機密情報入りHTMLを認証なしURLで共有し、noindexだけで安心する
• OK: パスワード・メール認証・会社ドメイン認証で閲覧者を絞る
• NG: テスト用APIキーや社内URLをHTML内に残したまま渡す
• OK: 公開前に外部送信先、秘密情報、フォーム送信先を確認する

確実に伏せるための手順

隠したい情報は、見た目を覆うのではなく元から取り除くのが基本です。次の手順で進めると確実です。

1. 見せたくない文字や数値を、HTMLから完全に削除するか、固定の伏せ字（◯など)に置き換える
2. 画像の場合は、隠す部分を塗りつぶした画像を作り直し、元画像は含めない
3. コメントや非表示要素、別ファイルに元データが残っていないか確認する
4. ZIPで共有するなら、元データを含むファイルが紛れていないか中身を見直す
5. 公開後、自分でページの文字を選択コピーして、隠したはずの中身が出ないか確かめる

「置き換え」と「削除」を使い分ける

情報を伏せる方法には、固定の文字で置き換える方法と、まるごと削除する方法があります。文章の文脈を残したいなら置き換え、存在自体を見せたくないなら削除が向きます。

置き換えるときは、元の文字数や規則性が透けないよう注意します。たとえば桁数がそのまま残ると、推測の手がかりになることがあります。

どちらの方法でも、元データがページのどこかに残っていないかの確認が欠かせません。表示部分だけ直して、隠れた場所に元の文が残るのが最も多い失敗です。

ギガサイト便で共有するときの注意

ギガサイト便はHTMLやZIPサイトを共有URLで配れますが、隠したい情報を確実に取り除くのはアップロード前の作業です。サービスは黒塗りの中身まで点検してくれるわけではありません。

上記の手順で元データを取り除いたうえでアップロードし、さらに認証や公開期限を併用すれば、見せる相手と期間を絞り込めます。マスキングは中身の処理、認証は届け先の制御、と役割を分けて両方を整えるのが安全です。