当ブログのHTMLタグの構成変更に関する備忘録です。
Hタグ（見出しタグ）の番号を最適なかたちに変更しました。
ステージング環境で変更したものを本番環境に移行しましたが、外部CSSの反映が遅れたため、タイミングによってはお見苦し常態になっていたと思われます。
大変失礼いたしました。
今回作業のきっかけ
別のブログで同様のできごとがあったということで、当ブログもタグ構造を見直しました。
そこまで真面目にSEOを意識しているわけではありませんが、それでも、正しいHTMLにしておきたかったのです。
正しい状態になっていないことで評価が下がるのは残念でしたし、何より、正しくないHTML構造を放置しておくことは許容できなかったのです。
HTML構造は、音声読み上げソフトでも使用するものです。きれいになっているに越したことはありません。
具体的な問題点は、見出しの階層構造でした。
思い当たる経緯も併せて書いておきます。
問題点
当ブログでは、h1が記事タイトルになっています。
ということは、次のh2が最初の見出しになるべきでした。
ところが、h3が最初の見出しになっていました。
WordPressデフォルトのスライダーやフッター要素では、適正な見出し番号が使われているように見えました。
想定経緯
要因は2つあります。
1つは、もともと使っていたブログサービス（ココログ）でのタグ構成です。
もう1つは、WordPress移行直後に使っていたテーマのタグ構成です。
ココログ時代には、自分の手で見出しタグを書いていました。
間違いなく、公開記事をプレビューしながらタグ構造を確認していましたので、h3で合っていたのです。
当時は、h1がブログ名、h2が記事名だったと思います。
そしてWordPress移行時、タグ構造も確認したと記憶しています。
その時に問題にならなかったということは、当時利用していたテーマがそういう構成だったのだと思います。
今となっては記録も残っていない（と思う）お話です。
実施したこと
以下を実施しました。
- hタグの番号を変更
- 見出しタグのクラス名変更
- CSSファイルのクラス名変更
- 見出し用プラグインの設定変更
- 入力支援プラグインの設定変更
1～4をステージング環境で実施し、本番移行後、5を本番環境で実施しました。
ステージング環境があると楽です。
バックアップもサーバーサービスで簡単に取得しておけるので、安心して作業できました。
1つだけ、タグの記載ミスがあり、ちょっと焦りました。
久しぶりにテキストエディターのDiff機能を使いました。
ミスになっていた記事はどのように表示されていたのか。。考えるとぞっとします。。
現在の状態
見出し構成は適正化されていると思います。
h2が最初の見出しで、そこから3段組むことを想定しています。
Google様から見ても、各種ツールから見ていただいても、分かりやすい構成になったと自負しております。
認識している課題はありますが小さなものだと思いますので、少しずつ対応していこうと思います。
コメント