面白いスタイルシート(以下CSS)の仕様がわかった！

僕は3列に区切られた形のページを作っている。

ﾎｰﾑﾍﾟｰｼﾞ
┌─┬─┬─┐
｜ 　｜真｜ 　｜
｜左｜ん｜右｜
｜ 　｜中｜ 　｜
└─┴─┴─┘


なおかつ、真ん中に表示する項目は、ページ幅に伴い伸縮するようにしたい。

それは、Gigazineがとてもいい例。


しかし、世の中には「SEO」という秘密結社が存在し、日夜ネットの海を監視し続けているのである。

SEOと仲良くすると、Web検索の時に有利になる。
逆に言うと、SEOに適したページを作ると、見つけてもらいやすくなるのだ。


そのため、検索させたい内容を、ソースの上の方に書いておくといいらしい。
しかし、ここでCSSの仕様が邪魔をするのだｗ



「縦割り」と一言に言っても、残念ながらPCは横書きオンリー、縦割りの内容を、横割りで考えなければならない。


たとえば、

・左
・真ん中
・右

の順番で書かなければならない。
でもこれでは、SEOに見せたい真ん中のコンテンツが下がってしまう！
なので、理想としては

・真ん中
・左
・右

こんな順番で書けばいい。


するとすると～

┌―――┐
｜真ん中｜
├─┬─┤
｜左｜右｜
└─┴─┘

なんとこんな風に表示されるようになってしまった。。。

試行錯誤の検証の上、原因は、“真ん中”が常にページの端から端まで広がり続けていることに有った。
ならばと思い、“真ん中”の左右に余白を作ってみるも、“左”“右”さんたちは上ってきてはくれませんでした。。。


ここで、Gigazineさんのつくりをもう一度観察してみました、すると～

・左
・真ん中
・右

の順番で書かれていました！
また、

・真ん中
・左
・右

の順番で書かれているページは、全ての幅が固定されていました。



以上の事から、「真ん中、左、右」で書きたい場合、フレキシブルなページ製作は不可能！
ということがわかりました。。残念。



因みに、Gigazinさんは違う方法で検索ロボットに見つけてもらうので、あの構造でも問題ないのです。ブログも一緒です。


ここはしばらく、幅固定のページを作るかな～