ホーム > デザイン > MTとIEを味方につけた今日という日

MTとIEを味方につけた今日という日

2008年11月18日 12:33 AM
デザイン

昨日、なんとか形になったと思い、サイトを公開したのはいいのですが、落ち着いて確認してみると色々不備だらけ。特にIEでの表示バグが大量にあって、今日バイトから帰ってきてからひたすらにIEと格闘してました。

そんな今日は、MT初挑戦にして、構築のために弄くり回し、ウェブ標準とはなんたるかを理解しないままガリガリマークアップして、なんとか形になったとっても達成感のある日。僕、頑張った！

そんな「にわか知識」でなんとかやっている僕ですが、同じようにちょっとは分かるんだけど、どう勉強していいかわからんっていう人もいるかと思うので、僕が参考にした本やらサイトをパパーっと紹介。敷居の高さにちょっと戸惑っている方の参考になったら嬉しいな。

まずはMT構築で、参考にしたサイトや本を紹介。これでMTはあなたの味方！

連載：チャレンジ！　Movable TypeをCMSとして使ってみよう！｜gihyo.jp … 技術評論社

もともと、ずっと放置してるサイトをなんとかしよう。MTでブログメインのサイトにしたいなっていう考えはありました。でもMTがどんなもんかを全然知らなくて、どうすればいいのかわからなかったときに、一歩踏み出すきっかけとなったのがこの連載記事。
MTを全然しらない僕にとっては、最初読んだときこれでも結構難しくて、読み飛ばしまくりましたがｗでも、MTってこういうことができるんだーっていう雰囲気はつかめるはず。

Movable Type 入門

MovableType初心者にとってもかなり嬉しいサイト。MTを構築するために必要なファイルのDLからMTが使えるサーバーの紹介。サーバーへのインストール方法などなど。MTにとっかかるのに必要なことは大抵書かれています。MT構築の際にもTipsが役立つことも。MT初心者は必見ですな。

Vicuna – CMS

ブログ構築ツールを使って0から全部を作ってしまおうなんて思わないほうがいいです。自分の好きなデザインにしたいしテンプレート使うのもなーって思うかもしれませんが、隅々まで調整されているテンプレートを自由にいじれるなら話は別。その願いが叶うのがVicunaテンプレートです。商用もOK、どんだけいじってもOK、しかも無償。最高すぎます。
このWooFla！もVicunaテンプレートを使わせてもらいました。かなり姿形は変えましたが、土台の部分がしっかり作ってあるので、表面はなんぼでもいじれる。しかも、いじってて分かったんですが、カスタマイズしやすいように作られてるんですよねー。本当にカスタマイズしやすかったです。

CMSとして使うMovable Typeガイドブック

posted with amazlet at 08.11.18

黒野明子荒木勇次郎
翔泳社
売り上げランキング: 6088

Amazon.co.jp で詳細を見る

MTってテンプレートやらウィジットやら独自タグやらでなんかもう、最初にシステムページ開いた時点で卒倒してしまいそうになります。テンプレートってなんやねん！なんやねんこのタグ！みたいな。
それを解決するには本を読むべし。この本はオススメです。前半にMTの構造はこうなってて、タグはこんな風に使って、っていう説明が分かりやすく説明されてます。後半はCMSサイト構築の実例。流石にまだ全部は読んでないですが、前半の数ページを読むだけでもMTと仲良く慣れます。初心者の方は是非。

WEB構築で一番難儀なのがIEという存在。ブラウザシェアNo.1でありながら、命令の解釈が独特で、他のブラウザから一目置かれる（？）存在です。っていうかもうIE殴りたくなるｗ
僕も、構築してマークアップしてせっせとCSSを編集して、できたー！と思ったらIEの罠に何度もハマりましたからね。

IEのバグを全部説明するわけにもいかず、僕がハマったバグを淡々と説明してもしょうがないので、コレは便利だと思ったものだけ紹介。これでIEとも仲良し！

透過PNGをCSSで背景に指定してIE6や5.5のバージョンでも綺麗に表示してみる – DesignWalker

透過PNGって、画像自体が半透明になるしむちゃくちゃ便利なのに、IE6以下だと透明部分が灰色になってしまうんですよね。そう、未だにユーザーが多数いるIE6は透過PNGに非対応。IE7からは対応してますが、IE6のユーザーも多数現存。そこで、IE6以下でもちゃんと透過してくれるようにハックしてくれるものが色々でてます。JSとかCSSとか。そのなかでも抜群に使いやすいと思って実際に使ってるのがこれ。
JSをページに読み込ませてやって、CSSに該当ボックスを指定して1行追加してやるだけ。なんと簡単な！ボックスの背景画像にもばっちり効いてくれます。こりゃ便利だ。

実践 Web Standards Design ~Web標準の基本とCSSレイアウト&Tips~

posted with amazlet at 08.11.18

望月真琴市瀬裕哉福島英児
技術評論社
売り上げランキング: 15618

Amazon.co.jp で詳細を見る

ウェブ標準って難しい。僕がHTMLをいじりだしたのが8年くらい前で、知識はほとんどその時点で止まってます。ボックススタイルとかを知ったのも結構最近のことですからね。今のウェブ標準の知識は皆無に近い。
そんな僕の知識を補完してくれたのがこの一冊。本当にウェブ標準を1から解説してくれます。情報量が多いので全然読めてませんがｗウェブ標準を学ぶなら是非。

それから最後に、MTとかIEの表示バグとか分からないところをほとんど質問して、その質問に忙しい中にも関わらず受け答えしてくれた@prutoに感謝！ホント@prutoの助言がなかったらまだまだ完成は遠かったと思います。
やっぱり、分からなくてどうしようもないときに、いつでも質問を聞いてくれる人が近くにいると助かります。

久々に長文のブログを書いたら疲れました。WooFla!になってから2記事目でこの容量ｗこの先こんなの続けられるとは思ってませんがｗちまちまとネタ記事なども交えつつやっていきますよー。