先日リリースされたMicrosoftの最新WWWブラウザーであるInternet Explorer 7日本語版を、遅ればせながら私もインストールしてみた。 インストールは最初なぜか英語版のインストーラがダウンロードされてしまったが、やり直したら日本語版がきちんとダウンロードされてきた。 インストール作業自体はほとんど操作することもなく、簡単に終了した。

気になる点としてはまず大きく変わったと言う外観だろうか。 確かにシンプルなものになっていて、画面が広く使えそうな印象を受ける。 タブブラウジングもFirefoxと新規タブを開くボタンの位置が異なるので若干戸惑うが、慣れの問題だと思う。 タブ一覧を画面のサムネイルで表示してくれる機能は便利だし、動作も軽快なので驚いた。 Firefoxにも同じような機能の拡張があるので使ってみようかと思う。

私の使っているDell製のWindows PCはメモリを2GB搭載しているので、少々古いPCとは言えゲーム以外の用途ならば軽快に動作する。 だから、IE 7の動作がFirefox 2に比べて重いのか軽いのかはよくわからない。 Firefoxはメモリを多く使うようになっているので、ハードディスクへのスワップが多く発生するような環境（仕事に使っているPC）では切り替え時などに動作が重くなってしまう。 そう言う環境でIE 7がどのように動作するかが気になるが、私のところでは特に問題なかった。

スタイルシートへの対応状況だが、IE 6よりはかなりましになっているようだが、やはりMozilla/Firefox系統とは動作が異なるようだ。 また、before疑似要素とcontent属性の組み合わせは動作していないように見える。 多用している私としては残念なところだ。

Blogのデザインを変更するべく、Movable Typeのテンプレートと格闘している。
標準のHTMLコードは非常に複雑で、異常なdiv要素のネストを繰り返している。
デザインを変更するためにスタイルシートを変更しようにも、HTML文書の構造が理解できなければ、まともなスタイルの指定は出来ない。
そこで、構造を理解することを優先することにした。

divのネストを何とかしないと、そのまま構造を理解するのは非常に困難なのだが、構造を理解せずにむやみにネストをはずしてしまうと、根本から訳がわからなくなってしまう。
div要素のネストがわかりづらいのは、ネストが深いことに加えて、Webブラウザ上の表示のため、どの深さでネストされているのか、一目でわからないことが原因だ。
そこで、Movable Typeに用意されている、テンプレートのモジュールを利用して、ネストの解消を行うことにした。

これまでおこなったのは、主にメインページについてで、検索ボックスやカテゴリリストなどをそれぞれモジュールに移し、メインページへは<$MTInclude$>で入れ込むことにした。
こうすることによって、小さな単位でネストが確認でき、非常にわかりやすくなった。
ついでに、DOCTYPEやxml宣言などまでモジュール化し、後から変更しやすいようにした。
我ながら良い仕事だと自画自賛したくなる（笑）。

これからやるべきは、div要素のネストが何のためにおこなわれているのか、スタイルシートファイルを見比べながら解析することだ。
うすうす予想されるのは、見た目を指定するためにいろいろネストしている、と言うことで、仮にそうだとすると無駄なことなので、見た目を変更するなどしてシンプルな構造にしたい。
私は複雑な構造を把握するのが苦手だし、面倒で嫌になってやめてしまう。
だから、後々のために始めに少し苦労しておこうと思う。

目標とするデザインとしては、まず私にとっての反面教師を紹介したい。
今、多くのBlogやウェブサイトで良くおこなわれていることだが、横幅がサイト側で指定されている。
現在、このBlogのデザインもまさにそうなっているが、私はこのレイアウトがあまり好きではない。
と言うのも、ブラウザがそれ以上の幅を使ってサイトを表示できるのに、その分がサイト側の都合で利用できないからだ。
もったいない感じもするし、スクロールする手間も増える。
ひどいときには、ブラウザウィンドウの半分くらいの面積しか使わないことになるサイトもある。

そこで、このBlogでは横幅を指定しないように作りたい。
これまで作ってきたサイトもそう言う思想で作ってきている。
Blogでも同じように出来るのかどうかわからないが、これを目標にしていきたい。