こんにちは。
やろうやろうと思って、放置してたんですが、「404 Not Found」のカスタマイズにやっと着手しました。
と言ってもコピペで完了できてしまうので、難しい手順は特にないんですが、せっかく変えたので記事にします！
※当サイトは「はてなブログ」から「ワードプレス」に移行しています。リンク先に飛んでもイラスト付きの404エラー表示にはなりませんが、はてなブログでは実装可能です。あらかじめご了承ください。
Contents
404エラーとは
まずは404エラーについて。
サイト運営していればお馴染みの“404エラー”。ある程度ネットに触っていれば404に限らず何かしらのエラーを見たことがあるはずです。
そのなかでも、404エラーは「見たことあるかも？！」という方が多いはず。
404エラーは、記事の削除やURLの変更等で、存在しないページがリクエストされた時に表示されるエラーコードです。
SEO効果は薄い？！
実際のところはどうかわかりませんが、SEO効果は多少あるみたいですが、どちらかというとユーザビリティへの配慮と言ったところでしょうか。
少なくともこれをやらなければ検索順位を下げられるということはないようです。
404 エラーのほとんどは、そのサイトの Google 検索結果でのランキングに影響を及ぼすことはないため、エラーを無視しても問題はありません。
Googleがこう言っているので間違いはないかとは思いますが、単純に「404 Not Found」だけだと寂しいですよね。
ただ、コードがJavaScriptを使用しているあたりが少し気になるところ（コードは後述します）。
当メディアはなんの知識もないくせに、適当にカスタマイズしまくっている上に不要なコードもあるはずなので、ページの表示スピードが結構遅いです。
更にいうと、最近は画像もしっかり圧縮してますが、かなりの量の画像を多用していますしね。
404エラー対策をする理由
先述の通り、SEO対策になるかもしれないというのも理由の一つですが、個人的な理由がいくつかあります。
自己満的なものが多いですが、別の目線で少し述べていきます。
色々なところがやっている
大手サイトでは小洒落たものやクスッとできる404ページを表示してくれます。
例えば株式会社LIG。
わざわざ404ページに一手間加えている企業も数多くあります。
ぜひご自分の目でお確かめください。
はてなは表示遅すぎ問題
ただでさえ、ワープレに比べて遅いはてなブログ。
僕もだいぶ前からスターは外してますが、とにかく表示が遅いはてなさん。正直これ以上遅くなって欲しくないという気持ちもありつつですが、せっかくなのでやってしまいます。
スピードをチェックしてみたい方は下記よりどうぞ。80点とかあればいいみたいですよ。
いらない記事を消すことで増える404
かつて記事を量産していたことがありました。
かつては“とにかく記事数を増やす” ことでPVも収益も上がると思っていましたが、それは大きな間違い。
良質な人のためになる記事を書かない限りPVもコンバーションも上がりません。
そんなわけで、すでに200記事ぐらいは消したと思います。キャッシュに残っていれば恐らく404出ちゃいますよね。
はてなで一記事ごとno indexするのも正直面倒。先日大量に消したばかりなので、ちょうどいいタイミングだったんです。
簡単ですが、「404 Not Found」のカスタマイズをするにあたって、ぼくの持論をまとめておきます。
- 多少のSEO効果はあるかも
- 見た目が単純に良さげ
- ユーザーがNot Foundで自サイトに訪れた時に迷いにくい
- スピードに影響が出るかも
- 記事を消したことがある人はやっておいた方がいいかも
というわけで早速カスタマイズしていきます！
広告
「404 Not Found」のカスタマイズ方法
はてなって素晴らしい！既に先人たちが方法を残してくれています。
今回参考に（ほぼコピペ）させていただいたのは下記お二方（WEPLI.2 (id:SikisimaHisayuki) 氏、 色白おばけ (id:lightgauge) 氏）の記事です。
ありがとうございます！
・はてなブログで404をカスタマイズする方法！ブログのアクセスアップ術 - wepli.2
・【修正しました】はてなブログの404 NOT FOUNDページをカスタマイズしました - 攻めは飛車角銀桂守りは金銀三枚
ソースコード
先ほども言いましたがほぼコピペです。ほんの少し文字を変えてあるのと、画像を変えてあります。
一応ご紹介しておきますが、ここよりしきさんかおばけさん（馴れ馴れしいw）のとこ見てくださいね！
このコードをデザイン→カスタマイズ→ヘッダ→タイトル下の順に開き、コード貼り付け。
ご自分のブログ名、画像URLのみ任意に設定すれば完了です！
使用画像
今回使用したのはいつも吹き出しで使っている類人猿の画像に文字を少し加えたもの。
というわけでぼくのエラーページは下記リンク先の通りです。
やっとできまんた！
飽きたらやめるかも！
あとがき
スピードチェックしたらPCが20というスコアを叩き出しました。これはまずいですね。
少し悩みどころですが、画像の使用も少し控えつつ、しばらく様子をみようと思います。
放置したからと言って検索順位には影響がなさそうなのでやる必要もないかもしれませんが、ちょっとした遊び心でやってみてはいかがでしょうか！
