Blog

※ブログ移転しました。 → hamashun.me

AutoHotkeyでHTML&CSSコーディングの速度を上げる

シリーズ目次

ちょっとした工夫で作業スピードを上げるシリーズの最後は、AutoHotkeyです。
マークアッパーでAutoHotkeyを使っている人はこれまでに見た事が無いのですが、コーディングがかなり快適になるので試してみると良いと思います。

AutoHotkeyとは、ホットキーへの機能の割り当てなど常駐ソフトの作成に特化したスクリプトエンジンautohotkeyとは - はてなキーワードより引用)です。

エディタからブラウザを遠隔更新するAHK

元ネタはmalaさんの最速インターフェース研究会 :: AutoHotkeyを使ってFirefoxをリロードするだけのexeファイルを作ってみたです。 使っているスクリプトもほぼ同じものですが、IE7用も使っています。

これをエディタの外部アプリケーション呼び出し機能に設定しているので、Ctrl+S → Ctrl+Dという動作で、保存 → Firefoxリロードがエディタから行えます。 一々FirefoxをアクティブにしてF5、とかやらずに済むのでとても便利です。

ただ、このスクリプトの効果を100%発揮するには、デュアル以上のディスプレイ環境が必要です。

キーボードショートカットを追加するAHK



CSSを書く時に、セミコロンを忘れないように先に書いておく書き方をする人は多いと思います。
でもそうすると、値を書く時に一つ左へカーソルを移して、書き終わった時に一つ右へカーソルを移さないといけないんですよね。



HTMLでも同じ事が言えます。 こんな時はどうしていますか? マウスでクリック? 矢印キーで移動? それともENDキーでしょうか。

どれも面倒

ぶっちゃけ、上記の3つの方法は全てキーボードのホームポジションから手を離さないといけないので、すごくすごく面倒です。 少しならいいんですが、CSSなんか一行ごとにその作業が発生するのでイライラしますね。
この問題を、AutoHotkeyで解決してみます。

矢印キーとHOME・ENDキーをホームポジションのままで使うAutoHotkeyスクリプト
$^h::
Send, {left}
return

$^j::
Send, {down}
return

$^k::
Send, {up}
return

$^l::
Send, {right}
return


$^+h::
Send, {Home}
return

$^+l::
Send, {End}
return

同じ種類の記述が続くからもうちょっと省略できるんじゃないかな、と思いつつもとりあえず動いているので妥協><

exeファイルのダウンロードを用意しました。 exeなのが心配な人は、AutoHotkey 公式サイトからエンジンをDLして上記コードをコピペして自作してください。
矢印キーとHOME・ENDキーをホームポジションのままで使うAutoHotkeyスクリプト のダウンロード(exeファイル)

解説

Ctrl+HJKLで、矢印キーになります。 Shift+Ctrl+HLで、HOME・ENDキーになります。
ブラウザにF5を送るAHKとは違い、これは起動しっぱなしで使うタイプです。

起動すると、全てのアプリケーションに適用されます。 設定を書き加えれば、エディタのみに効かせる事もできると思います。
「ブラウザの検索窓にフォーカスできないよ!」という人は、Ctrl+Eを試してみると良いと思います。

オマケ:キーボードのCtrlとCaps Lockを入れ替えておくと更に便利

ベクター辺りに色々あるので入れ替えると小指が攣らずに済みます。

参考リンク

AutoHotkeyを流行らせるページ

Contribution Form

Blog Search
Search
Recent Entry
Category
Monthly Archive