Zen-Coding で HTML・CSS ハイスピードコーディング

HTML、CSS コーディングをしていると、何回も同じタグやセレクタを入力する事になります。
Dreamweaver 等のホームページ作成ソフトやエディタの機能で入力補完を行ってくれるので、最初から最後まで入力する必要はなくなりましたが、それでも「もっと早くコーディングしたい!」という欲望は尽きません。(意訳:もっと楽にコーディングしたい)

そんな尽きる事のない欲望を満たしてくれるのが「Zen-Coding」です。

「Zen-Coding」は、エディタのプラグインで

例えば、次の様なコードを入力する場合

<div class="class-name"></div>

Zen-Coding なら以下の様に入力し、ショートカットキーを押すだけ!

div.class-name

更に、後ろに「*3」と付けた場合

div.class-name*3

見たままですが、3回繰り返してくれます!

<div class="class-name"></div>
<div class="class-name"></div>
<div class="class-name"></div>

調べれば調べる程、凄いとしか思えないツールです。

対応するエディタは幾つかありますが、以下のアプリケーションがフルサポートされています。

  • Aptana
  • Coda
  • Espresso
  • TextMate
  • editArea
  • Visual Studio
  • textarea

部分的にサポートされているアプリケーションであれば Dreamweaver も含まれています。

「Zen-Coding」使いこなせたら、手放せないツールになる事は間違いなしかもしれません。

Zen-Coding Set of plugins for HTML and CSS hi-speed coding

Appshocker

HonyaClub.com

リンクシェア アフィリエイト紹介プログラム