ススキの輝き　2012.10.29撮影

結構面倒な作業となりました。２カラム～１カラムとサイドバーを移動させる為にはコンテンツと２つのサイドバーの編集順序を入れ替えないといけなかったので、準備段階として２０を越えるテンプレートの修正とその動作確認に時間を要しました。Media Queries導入前に細々とした不具合も出てこの準備段階に一番手間が掛かりました。ま、何事も準備が大事ってことですかね。
まずはCSSはそのままで編集順序を変えて思った画面構成になること、次に編集順序が変わってもカラム位置が元の位置になるようCSSの記述を変える、の２段階で進めました。何か、企業システムの移行手順のような感じです～。ハハハ

微かな色づき　2012.10.28撮影

全てのテンプレートが以前と同じ画面構成で正常に動くことを確認後、いよいよCSSにMedia Queriesを導入しました。この段階は意外と簡単に進みました。当初は１カラム時のウインドー幅を可変にしたのですが却って使い辛らかったので固定幅にかえました。予定を変えたのはこれだけでした。

朽ちるとき　2012.10.28撮影

最後に、IE8以前のInternet Explorerでも動くようにするGoogleのスクリプトを導入する記述とiPhoneやAndoroidスマートフォンでの動きを規定するViewportの記述を加えて完了です。

手持のWindowsPC(IE9/8,最新版のFirefox,safari,Opera,GoogleChrome)とAndroid2.3スマーフォンでは確認できましたが、Apple系のMACとiPhone、それからタブレット系の端末では確認できていません。ま、いいでしょう。

次はflashやMIDIのHTML5対応ですが、これには時間が掛かりそうです。まずはツール探しからです。
古いバージョンが残った状態で次々と新しい技術やバージョンの改変が積み重なって行きます。IE10が出ても依然として日本ではIE6が4.7%も残ってる（20%代で断トツ1位の中国に続いて日本は第2位。インドが3%で他は2%台以下）し、結構このサイトへの訪問数も多いんです。この機能差は素人には埋められません。どうなって行くんでしょうネ。ＭＳも維持し切れなくなるでしょうからIE6と言わず非標準のIE7を捨てる時期が早晩来るんでしょう。

今回のMedia Queriesの導入に当たっては、主に「小粋空間」さんの「MT5テーマ（レスポンシブWEBデザイン対応）」と「coliss」さんの「[CSS]スマフォ対応サイトのためにMedia Queriesをしっかり身につけるチュートリアル」を参考にさせていただきました。

ＰＳ）2012.10.30 IE6に関する数値を修正しました。