この記事を読むのに必要な時間は約 2 分です。
headとbodyが入れ替わるときに確認する事
たまにやる超個別記事です。
headは設定しているのにviewポートが無いとライトハウスに言われた事ないですか?
見えない敵と戦っている主人公の気持ちが分かります。
なかなか気づきにくいトラブルです。
どこで発生するかによって影響度が変わるかなと思います。
もしかしたら、発生しているけど影響がないから気づいていないだけという落ちもあるかもしれません。
私は今回の問題が冒頭で発生したため、影響がheadタグに現れたと思いますが、なぜその影響で今回のような事象に繋がったかよくわかりませんし、解決してから再現させるのが上手くできませんでした。
前振りが長くなりましたが、今回私のHPで発生したトラブルはBodyタグの中にheadの中身がまるまる入ってしまうという、よくわからないトラブルです。
見た目上の影響なし
まず、ぱっと見でトラブルが発生している事がわかりません。
だって、普通にみえますので・・・
しかし以下2点で明確にトラブルが発生している事が分かります。
・LighthouseでのSEO低評価
・クロームでのF12
Lighthouseで低評価にされた理由はViewポートの設定が無いと言われた事でした。
確り機能しているし、書いてもいるのにです。
何かが起こっていると思いますが原因はさっぱりです。
次にクロームでF12を押してはじめてわかる奇怪な現象・・・
headがbodyにめり込んどるやんけ!!
この様な現象に悩まされている人!!
原因は文字コードかもしれませんよ・・・