ネストしたindex.htmlを公開前に直す方法

起きる症状

macOSでフォルダを右クリック→「圧縮」で作ったZIPは、ZIP内に同名フォルダが一層生まれる。たとえば`site`フォルダを圧縮すると`site.zip/site/index.html`という構造になり、ギガサイト便がindex.htmlを探してもZIP直下に見つからずエラーになる。この症状は公開ボタンを押した直後の404で気づくことが多い。

ビルドツールによっては出力先が`dist/`や`out/`になっており、そのフォルダごとZIPにするとさらに深いネストになる。`unzip -l yourfile.zip | head -20`でZIP内の構造を事前確認すると、index.htmlが何階層目にあるかを圧縮前に把握できる。

• 相手がログインなしで開ける状態か確認する
• PCとスマホで最低1回ずつ表示を確認する
• 内部情報・個人情報・不要な外部送信が残っていないか見る
• レビュー期限と修正時の差し替え方を決めておく

正しい構成

ZIP直下にindex.htmlが来るのが正しい構成だ。ターミナルで`cd dist && zip -r ../site.zip .`と打つと、distフォルダの中身だけがZIPに収まりindex.htmlがルートに配置される。`cd`でフォルダに入ってから圧縮するのがポイントで、フォルダを外から圧縮するのとは結果が異なる。

Windowsの場合は7-Zipを使い、展開先フォルダの中身を選択してから「追加」で圧縮する。フォルダ自体を右クリックして圧縮すると余分な階層が生まれるため注意。作成後は`7z l site.zip`でリストを確認し、先頭にindex.htmlが表示されることを必ず確かめる。

• ZIP直下または指定階層にindex.htmlがあるか確認する
• 相対パスの画像・CSS・JSが同梱されているか見る
• 不要な隠しファイルや作業ファイルを除く
• 圧縮前のフォルダ名に日本語や空白を入れすぎない

圧縮前チェック

圧縮前にビルド出力フォルダ内で`ls -la`を実行し、index.htmlが存在することを確認する。存在しない場合はビルドコマンドが未実行か、出力先の設定が誤っている。Viteなら`vite build`、Create React Appなら`npm run build`を実行してdist/buildフォルダが生成されてからZIPを作る。

隠しファイル（`.env`や`.git`など）がビルド出力に混入していないか確認する。`.env`がZIPに入ると認証キーが漏れるリスクがある。`zip -r site.zip . -x '*.env' -x '.git/*'`のように除外パターンを指定して圧縮するのが安全だ。

1. HTML内の外部script・form action・iframeを確認する
2. APIキーやトークンらしき文字列がないか検索する
3. 画像・CSS・JSのパスが公開後も解決できるか見る
4. noindexと認証を混同せず、必要なら両方設定する

アップロード後確認

ギガサイト便にアップロードした後、プレビューURLのトップページ（`/`）が正しく表示されるかをシークレットウィンドウで確認する。404やディレクトリ一覧が出る場合は、ZIP内のindex.htmlのパスがルートにない証拠だ。その場合はZIPを作り直して再アップロードする。

サブページへのリンクが機能しているかも確認する。`about.html`へのリンクが`../about.html`になっていると、ZIPの構造変更後にパスが解決できなくなる。HTMLの相対パスはすべてZIPルートからの相対で書かれているかをgrepで確認（`grep -r '\.\./about' .`）してからZIPを作成する。

1. HTML内の外部script・form action・iframeを確認する
2. APIキーやトークンらしき文字列がないか検索する
3. 画像・CSS・JSのパスが公開後も解決できるか見る
4. noindexと認証を混同せず、必要なら両方設定する