ホーム以外ではロゴとサイト・ナビゲーションをまとめてnav
要素で括るような形にグローバル・ヘッダーのマークアップを変えた。ホームでは今まで通りnav
要素の外でmark
要素を使ってロゴは表示される。あわせてタグラインをh1
要素にしてしまったが、何か違う気がする。
他にはロゴを真四角から縦長で下が斜めにカットされているような形に変更した。SVGを直すのがなんとなく面倒だったのでborder
プロパティーを利用したCSSで雑にやったけど、明らかにSVGを直す方が簡単だったのでちゃんとSVG画像を作り直した。縦横比は1:1.618
になっていて、ロゴの幅に1.618
の4乗をかけるとサブカラムの幅に、それにガッターを加えてまた1.618
の2乗をかけるとコンテンツ(メインカラム)の幅になったりする。
このマークアップの変更は、ロゴはh1
要素か否かみたいなちょくちょく論争になる問題というよりも、ロゴもナビゲーションの一部とみなすべきかなという考えに基づいたもの。そうするとロゴもnav
要素の子になるべきかな、と。この場合、ロゴでh1
要素を使ってしまうとそのnav
要素の見出しになってしまう。それはさすがにおかしいので、自然とロゴはh1
要素ではなくなった。
このままだとbody
要素がUntitled BODYになってしまうのが難点で、タグラインを半ば強引にh1
要素にしたりしてみた。title
要素がちゃんとあるならUntitled BODYでもいいかみたいな雑な感覚でお茶を濁しても良さそうだけど……。もうちょっとちゃんと考えよう。