遅ればせながら、巷で話題の「zen-coding」を導入してみました。zen-codingはHTMLやCSSやらをショートカットなどの簡略化したコードだけで複雑なタグを1発で生成できちゃうプラグインです。そう単体のエディターではなくDreamweaverやNotepad++ などのテキストエディターのプラグインとして動作します。
ちょっとわかりづらいですがデモンストレーションの動画を見てみてください。やってることわかるかな??
Zen Coding v0.5 from Sergey Chikuyonok on Vimeo.
Zen-Codingのダウンロード
http://code.google.com/p/zen-coding/downloads/list
下記のようにエディター別にダウンロードするファイルが分かれています。今回はDreamweaverの環境にインストールしたいので「Zen Coding for Dreamweaver v.0.7.2 Featured」をダウンロードしました。
圧縮されていますので、解凍してできたファイル「Zen Coding v.0.7.2.mxp」をクリックして実行します。
するとADOBEのEXTENTION MANAGERが起動し自動でインストールが完了します。あとはDreamweaverを起動、もしくは再起動で動作を確認してみてください。
たとえば
div#content>ul#global.nav>li*3>a
と入力します。こんな感じ。
それで末尾にカーソルを合わせ、「Ctrl+,」(コントロール+カンマ)を打つと
一瞬でこんなタグが展開されます。どう?すごくない?
是非、いろんなショートカットを試してみましょう!
その他のショートカットが一覧になったシートで確認してみてください。⇒Zen Coding cheat sheet (PDF)
以下のページが参考になります。
http://designblog.ecstudio.jp/htmlcss/zen-coding-aptana.html