公開できたか確かめる・直す

🎯 このレッスンで学ぶこと

• 本当に他の人から見えているかを確認できます。
• 404とデザイン崩れを切り分けて原因を特定できます。
• 直したものを再公開（更新）できます。
• 公開したページを人に見せられる状態にできます。

📱 テスト1：スマホで開く（いちばん確実）

パソコンで公開した人は、スマホで同じURLを開いてみてください。 スマホはパソコンとは別の環境なので、キャッシュもログイン状態も共有していません。 ここで表示されれば、他の人にも見えていると考えて大丈夫です。

1. 公開URLをコピーする
2. 自分にメッセージアプリなどで送る（またはメモに貼る）
3. スマホでそのリンクを開く
4. Wi-Fiを切ってモバイル回線で開けるとさらに確実です

🔍 テスト2：症状で原因を切り分ける

うまく表示されない場合、症状によって原因が違います。 やみくもに設定をいじる前に、どれに当てはまるか確認しましょう。

🛠️ 「デザインが無い」の直し方（最頻出）

文字だけ表示されてスタイルが当たっていない場合、ブラウザが CSS を見つけられていません。 ブラウザに直接聞けば、どのファイルで失敗しているかが分かります。

1. 公開ページを開いた状態で、キーボードの F12 を押す（開発者ツールが開きます）
2. Console タブを開く
3. 赤い文字で 404 と出ているファイル名を探す

こういう表示が出ます。

GET https://ユーザー名.github.io/style.css 404 (Not Found)

このURLをよく見てください。/my-site/ が抜けています。 これはレッスン2で学んだ原因①（/ 始まりのパス）です。 HTMLの href="/style.css" を href="style.css" に直せば解決します。

URLに /my-site/ が入っているのに404なら、 原因②（大文字小文字）かアップロード漏れです。 GitHubのリポジトリを開いて、そのファイルが本当に存在するか、名前が完全に一致しているかを確認しましょう。

🔄 直したものを反映する（更新）

ファイルを直したら、もう一度アップロード（または push）します。設定のやり直しは不要です。 Pages の設定は一度やれば、あとはファイルを更新するだけで自動的に反映されます。

git add .
git commit -m "CSSのパスを修正"
git push

ブラウザでアップロードした人は、同じファイルをもう一度アップロードして上書きすればOKです。

✅ 完成チェック

ここまで全部OKになったら、あなたの作品は本当に公開されています。

🎁 見せられる状態にする（おまけ）

人に見てもらうなら、ページの <title> を整えておきましょう。 リンクを送ったときやブックマークしたときに表示される名前になります。

<title>ハナコのポートフォリオ</title>

「無題のドキュメント」のままだと、もったいないです。

⚠️ よくあるミス

• 自分のPCでだけ確認して満足する — キャッシュで見えているだけの可能性があります。必ずスマホかプライベートウィンドウで確認しましょう。
• 404が出たので設定を何度も変える — まず5〜10分待つ。それでもダメなら症状の表で切り分けます。設定をいじり回すと原因が分からなくなります。
• 更新したのに変わらないので push し直し続ける — キャッシュの可能性が高いです。スーパーリロードで確認しましょう。

📝 まとめ