去年MacBookAIRを購入してから、念願だったMac専用のwebオーサリングツール『Coda』をインストールしたんですが、
DWとの違いにかなり戸惑ってしまいあまり使いこなせていなかった霙（@xxmiz0rexx）です。

使い方さえ覚えてしまえばさらに快適なコーディングライフを送れると思うので、機会を作ってちゃんと覚えてみようと思い記事にしました。

プラグインを入れて快適に使う

まずはCodaの環境を整えます。DWではpタグやhタグなどはショートカットキーで挿入していたので、
まったく同じキーではないにしても同じような事ができないかと思い探したところ、Zen-CodingのCoda版プラグインである『TEA for Coda | One Crayon 』を入れれば良いという結論に達しました。

このプラグインを入れておけば、例えばpタグやhタグ、strongタグなどを素早く挿入することが可能です。
Codaデフォルトのショートカットキーで存在するのかと思ったんですが、調べても見当たらなかったのでプラグインの導入を決めました。インストール方法は、ダウンロードしたプラグインファイルをダブルクリックするだけなので楽チンです♪

覚えておきたいショートカットリスト

TEA for Codaを導入したら、あとはただひたすらコーディングするのみです。
一日も早くショートカットキーを覚え、ストレスのないコーディングを目指します(｀・ω・´)ｼｬｷｰﾝ

以下に私が覚えておきたいショートカットキーをまとめました。「div#main+div#sub」など、ID名をつけて入れ子にして〜などという記述法の説明は今回触れませんので、
それについては以下の記事が分かりやすくておすすめです。

参考：マークアップ効率化 – zen-codingでコーディングを倍速に (Yahoo! JAPAN Tech Blog)

タグの挿入系

入力コマンド	表示結果
p + Ctrl + ,	<p></p>
h1 + Ctrl + ,	<h1></h1>
Ctrl + Return	<br />
Ctrl + Alt + b	選択範囲を<strong></strong>で囲う
Ctrl + Shift + w	選択範囲を好きなタグで囲う
Ctrl + Shift + L	選択範囲を<a href=”http://”></a>で囲う
Cmd + /	選択範囲をコメントアウト
Cmd + ]	インデントを増やす
Cmd + [	インデントを減らす

最初の2つだけ種類が違いますが・・。pと入力した後に
Ctrl + ,を入力するとタグが展開されますよ。

カーソル移動・表示系

入力コマンド	表示結果
Cmd + 1	モード：サイトを表示
Cmd + 2	モード：エディタを表示
Cmd + 3	モード：プレビューを表示
Cmd + 4	モード：CSSを表示
Cmd + 5	モード：ターミナルを表示
Cmd + 6	モード：ブックを表示
Cmd + d	次の見出しまでジャンプ
Cmd + Shift + d	前の見出しまでジャンプ
Cmd + Return	行の終わりで改行
Cmd + Alt + i	不可視文字の表示on/off
Cmd + Ctrl + c	クリップ表示on/off
Ctrl + a	行の先頭に移動