参考
http://www.qript.co.jp/blog/technique/1965/
今回はSublime Textを使うんだったら入れとくといいプラグインをまとめてみました。
※私が今入れているプラグインだけをまとめました。
1)Emmet ...Zen coding的なもの。
！と入力してcontrol + E を押すと。
という風にHTML5のひな形を一気に展開してくれます。
チートシートがあるので活用しつつ徐々になれていくといいと思います。
CSSはまた別に便利なプラグインがあったりします。
チートシート
http://docs.emmet.io/cheat-sheet/
2)Hayaku ...CSSの入力をスピーディーにする。
たとえば、oh と打ってtabを打つだけで overflow: hidden; が展開されます。
Emmetとの共用したい場合ショートカットがかぶるので、
Preference > Package Settings > Emmet > Setting – User から設定から、↓下記コード記述して、変更しておきましょう。
{
// TABキーによる展開を対象の言語（ファイル）のときに無効化する
"disable_tab_abbreviations_for_scopes": "css,less,sass,scss,stylus"
}
3)AutoFileNeme ...画像ファイル保管機能。
画像ファイル名や、CSSの文字色、背景色、カラー値、画像の変更などをしてくれます。
img と入力し tabキー を押します。
選択した画像のheightとWidthが自動補完されます。
4)BoundKeys ...パッケージのショートカットを一覧表示。
いろいろパッケージをいれていくと、ショートカットがかぶってて使えない事もでてきます。
そんな時に入れておくといいと思います。
5)Nettuts + Fetch ...フレームワークを素早くいれる。
よく使うjQueryやリセット用のCSS、フレームワーク、Wordpress等のCMS等をあらかじめ設定しておくことで、コマンド素早くでダウンロード・展開してくれます。
6)SideBarEnhancements ...サイトバーメニュー拡張
サイドバー右クリックのメニューを拡張するプラグインです。
デフォルトではファイル名変更、削除、フォルダを開くしかないですが、
これを入れるとコピー、複製、移動、検索、プロジェクトの設定などができるようになります。
7)SublimeLinter ...リアルタイムでコードの構文チェック。
問題があった箇所をハイライトしてくれます。
言語ごとに別途Linterもインストールする必要があります。