最近よく考えるんだけど、ウェブサイト見ててページが表示されたり、「ページが見つかりません」って出たりするの、あれって裏側で何が起きてるんだろう?って思ったことない?🤔
実は、僕らが使ってるブラウザと、ウェブサイトのデータが置いてあるサーバーとの間で、めちゃくちゃ短い会話が交わされてるんだよね。で、その会話の結果を伝えるのが「HTTPステータスコード」っていう3桁の数字。これが今日の主役。
エンジニアだけの話っしょ?って思うかもしれないけど、いやいや、これがサイトの使いやすさとか、SEO(Google検索で上に出るかどうか)にまで関わってくるから、意外と奥が深いんだよ。
TL;DR
正直、全部覚える必要は全くない。要するに、サーバーからの返事で、「200番台ならOK👍」「300番台は案内中」「400番台は『君のせいだよ』っていうエラー」「500番台は『ごめん、こっちのせい…』っていうエラー」ってことだけ頭の隅っこに置いとけば、だいたいOK。
ステータスコードって、どんな種類があるの?
まあ、ざっくり5種類に分かれてる。レストランのウェイターとお客さんのやり取りで例えると、結構わかりやすいかも。
- 1xx (情報): 「ご注文は承りました。今、キッチンに伝えてますんで、少々お待ちを!」みたいな感じ。あんまり表には出てこない裏方さん。
- 2xx (成功): 「お待たせしました!ご注文の品です、どうぞ!」これが一番ハッピーな状態。ページが無事に表示されたってこと。
- 3xx (リダイレクト): 「あ、申し訳ありません!そのメニューは本日、あちらの別店舗でのご提供でして…」って別の場所に案内されてる感じ。引っ越しみたいなもの。
- 4xx (クライアントエラー): 「えっと…お客様、そのようなメニューはございませんが…?」って、お客さん(つまり見てる側)の注文がなんかおかしかったパターン。
- 5xx (サーバーエラー): 「大変申し訳ございません!キッチンで火災が発生しまして…!」みたいに、お店(サーバー)側でトラブルが起きてる状態。これはもうお手上げ。
ね、こう考えるとちょっと身近に感じない?
「どうやって見るの?」ステータスコードの確認方法
じゃあ、この「会話の結果」ってどこで見れるの?って話だよね。実はめっちゃ簡単。
一番手軽なのは、今使ってるブラウザの開発者ツール(デベロッパーツール)を使う方法。ChromeでもEdgeでもFirefoxでも、だいたい F12 キーを押すか、画面を右クリックして「検証」とか「調査」ってやつを選べばOK。
なんか黒くて英語だらけの画面が出てきてビビるかもしれないけど、落ち着いて。「Network」っていうタブを探してクリックしてみて。その状態でページを再読み込み(F5キーとか)すると、そのページが表示されるまでに裏でやり取りされたファイルの一覧がズラ〜っと出てくる。その中に「Status」っていう列があるはず。そこに出てる数字が、ステータスコードだよ。
専門家でもない限り、毎回これを見る必要はないけど、「あれ、このサイトなんかおかしいな?」って思った時にチラッと見てみると、原因がわかることがあるから、覚えておくとちょっとだけドヤれるかも(笑)。
特に覚えておきたい、重要ステータスコード比較
全部で何十種類もあるんだけど、正直、日常的に意識するのは数えるほど。特にサイト運営とかしてると大事になってくるやつらを、僕の独断と偏見でピックアップしてみた。
| ステータスコード | これはどんな状況? | ユーザーへの影響 | SEO(検索順位)への影響 |
|---|---|---|---|
| 200 OK | 「リクエスト、大成功!」一番普通で、一番良い状態。ページがちゃんと見つかって、問題なく表示されたよってこと。 | 最高だよね。見たいものが見れたんだから。文句なし。 | もちろんプラス評価。Googleも「このページは健全だな」って判断してくれる。 |
| 301 Moved Permanently | 「あ、そのページ引っ越しました。こっちが新しい住所なんで、今度からこっちに来てね」って永久的なお引っ越しを伝える時。 | 普通はブラウザが自動で新しいページに飛ばしてくれるから、ユーザーは気づかないことが多い。体験は損なわれない。 | めっちゃくちゃ大事。古いページの評価(被リンクとか)を新しいページにちゃんと引き継いでくれるから、SEO的に必須の対応。 |
| 404 Not Found | 「あなたが探してるページ、うちには無いみたい…」ってやつ。URLの打ち間違いとか、リンク切れ、ページが削除された時とかに出る、一番有名なエラー。 | イラっとするよね。「なんだこのサイト、ちゃんと管理してないな」って思われて、サイトから離脱される原因 No.1 かも。 | これがサイト内に多すぎると、Googleから「このサイト、情報が古いし管理も雑だな」って思われて、全体の評価が下がる可能性がある。 |
| 503 Service Unavailable | 「ごめん!今、店が満員でてんてこ舞いなんだ!また後で来て!」ってサーバーが叫んでる感じ。アクセス集中とか、メンテナンス中とか。 | ユーザーは何も見れない。完全にアウト。「このサイト死んでる?」って思われる。一番避けたい状況の一つ。 | 一時的ならGoogleも「まあ、そういうこともあるよね」って大目に見てくれるけど、これが頻繁に起こると「このサイト、信頼できないな」って判断されて、順位がガクッと落ちることも。 |
よくある誤解とか、間違いやすいポイント
いくつか、みんなが勘違いしやすいポイントがあるんだよね。
誤解1:「301と302、どっちでもいいでしょ?」
全然良くない(笑)。301は「永久に引っ越しました」で、302は「一時的にこっちにいます」っていう意味。例えばサイトのリニューアルでURLが恒久的に変わったなら、絶対301を使わないとダメ。302を使うと、Googleは「一時的な滞在なのね」って判断して、古いページのSEO評価を新しいページに引き継いでくれないことがある。大損だよ。
誤解2:「404が出たら、全部トップページに飛ばせばOK?」
これもやりがちだけど、あんまり良くない手。ユーザーは「Aのページ」を見に来たのに、いきなりトップページに飛ばされたら「は?なんで?」って混乱するだけ。親切じゃないよね。理想は、「あなたが探していたAに近いのは、このBのページかもしれません」みたいに関連ページを案内してあげるカスタム404ページを用意すること。そのほうがユーザーは助かるし、サイト内を回遊してくれる可能性も上がる。
そういえば、海外の気の利いたサイト、例えばGitHubとかだと404ページ自体がちょっとした遊び心のあるデザインになってて面白いよね。日本の、特にお役所系のサイトとかだと、たまに「エラーが発生しました。」だけみたいな、すごく冷たい503画面とか見かけるけど…あれはちょっと悲しくなる。こういうところにも「おもてなし」の精神って出る気がするな。
ちなみに、HTTPステータスコードの正確な定義は、IETFっていう団体が出してるRFC 9110っていう文書に全部書いてある。…まあ、正直、法律の条文読んでるみたいで眠くなるから、普通は読まなくて大丈夫(笑)。
じゃあ、エラーを見つけたらどうする?
特に404エラーとか503エラーは放置しちゃダメ。サイトの信頼に関わるからね。
自分のサイトを持ってる人なら、[Google Search Console]っていう無料ツールは絶対に導入すべき。これを使うと、「あなたのサイトのこのページ、Googleが見に行ったら404エラーだったよ」とか、「最近5xx系のエラーが増えてるけど、サーバー大丈夫?」みたいなお知らせを全部教えてくれる。健康診断みたいなもんだね。
404が見つかったら、
- もう存在しないページなら、関連性の高いページに301リダイレクトを設定する。
- 単純なリンクミスなら、正しいURLに修正する。
503エラーが頻発するなら、
- 契約してるレンタルサーバーのプランが、アクセス数に対して貧弱すぎるのかもしれない。プランの見直しを検討する。
- WordPressとか使ってるなら、特定のプラグインが重すぎてサーバーに負荷をかけてる可能性もある。原因を特定して対処する。
地味な作業だけど、こういうのをコツコツやるのが、結局は見てくれる人と、あとGoogleからの信頼を勝ち取る一番の近道なんだよね。マジで。
…と、まあこんな感じで、ただの3桁の数字に見えるステータスコードも、実はウェブサイトの裏側でめちゃくちゃ重要な役割を担ってるって話でした。
次にネットサーフィンしてて変なエラーページに遭遇したら、「あ、これは404だな」とか「うわ、503か…サーバー頑張れ!」って心の中で思ってみると、ちょっとだけインターネットの解像度が上がるかも?
あなたが見た中で、一番面白かったり、逆に一番ひどかったりしたエラーページってどんなのがありますか?もしあったら、ぜひ教えてください!
