2015年も使い続けたいウェブサイト制作ツール Windows編

ウェブサイトの制作ではメインで2台が稼働中ですが、そのうちの一台、5～6年ほど使っているWindows 7 マシンの調子が悪くなってきたので、年末のまとまった連休を利用してOSを再インストールしてリフレッシュしたいと思います。

ハードディスクを初期化する前に、使っているアプリの整理がてら、愛用しているツール群を書き残したいと思います。

まず、今回OSを再インストールする制作用PCの環境です。

# 制作用PCについて

 * OS：Windows 7 Professional SP1 64bit
 * CPU：Intel Core i 7 980X EE 3.33GHz
 * メモリ：24GB
 * SSD：240GB
 * HDD：3TB × ５
 * モニター：Full HD 24inch × 3
 * サブモニター：USB 15inch

以上、2008年製のマシンを細々と拡張しながら使ってますが、まだまだ現役です。

* * *

# 制作用アプリケーション

そしてウェブサイト制作に欠かせないツール群です。


## **基本ツール**

#### **Microsoft Office Home and Business 2013**
Word、Excel、Outlook、PowerPoint、One Noteが含まれます。仕事をする上での文書フォーマットの基本なので必須です。なお、One Noteはまったく使っていません。タブレットやスマホとの連携を考えるとEvernoteの方がいいです。 あと、Ver.2013は、ファイル保存時に即時にOneDriveと同期してくれるので、複数台マシンで作業をしているときに同期を意識しなくて良いので気楽です。

#### **秀丸エディタ**
テキストファイルを開くときや、メモを取るとき用。マクロを組み合わせて自分仕様にすると手放せなくなります。正規表現が使えるのもいいですね。便利すぎて、かれこれ18年ほど使っている超定番ツール。

#### **WinRAR**
大容量ファイルをアーカイブするときにrar形式を使いますが、パリティを付与できるので、リモート環境へ送付するときはファイル破損が抑えられるので安心。

#### **Explzh**
MACユーザーからもらったZIPファイルをWindowsで開くと文字化けするとき、これで解凍すると文字化けが解消されて、なおかつ.DS_Storeなどのゴミファイルも除去されるので、キレイに展開されます。

* * *

## **ウェブ制作ツール**

#### **Google Chrome 32bit**
JavascriptとCSSを扱う上でChrome Developer Toolsは必須です。 一度64bit版を入れましたが、iCloudなどのアドオンが動かなくなったので、32bitに戻しました。

#### **Firefox Developper Edition**
ここ数年のサイト制作は、PCとスマホの両対応が求められるので、ChromeでPCサイトチェックしながら、同時にFirefoxでスマホサイトのチェックと、ブラウザを並べてデバッグするとき用です。

#### **FireFox**
Firefox Developper EditionのクールなUIが気に入って、ノーマルのFireFoxは使用頻度は落ちていますが、SNSサイトを作る機会が多いので、多数のサイトユーザーで検証するときに、Chromeと並べて使います。

#### **MS OneDrive**
仕事用のサイトデータや書類はOneDriveで丸ごと同期しています。無料版では容量が足りないですが、月額約200円の有料オプションを付けると格段に使い勝手が向上します。
MAC版のOneDriveも問題なく動作してくれるので、WindowsとMAC間でデータ同期するのにも使えます。

#### **PNGGauntlet**
PNGファイルをサイトにアップロードする直前で、ファイルサイズを最適化するときに使います。同時に複数ファイルを処理できるので、その辺のオンラインツールを利用するよりも便利ですね。

#### **JPEGmini**
JPEGファイルをサイトにアップロードする前に、ファイルサイズを最適化する用です。ほぼ画質劣化無しにJPEGファイルのサイズをかなり落とせるので、有料ではありますが満足度は高いです。（1日20枚限定ならの無料版でJPEGmini Liteがありますが、制限を気にしながら使うのは非効率なので、迷わず有料版へ移行しました）
サイトのデータサイズを減らしておくと表示スピードが高速化されるので、SEO対策として有効です。

#### **Sublime Text 3**
HTMLコーディング、SCSS、Javascript、PHPコードを書くときに使っています。WebデザイナーやHTMLコーダーの方々に広く愛用されているイメージがありますが、ヘビーなPHPプログラミングでも十分に実用的です。WordPressやDrupalをベースにしたそこそこ規模が大きな案件でも、Sublime Text 3ひとつで乗り越えることができました。
ひとつ注意する点といえば、欲張って便利そうなパッケージを入れすぎると動作が重くなったり、キーバインドの衝突により機能不全を起こしたりするので、本当に必要なパッケージを厳選して導入することですかね。新たなパッケージを導入したら、「FindKeyConflicts」パッケージでキーバインドが衝突してないかをチェックすると良いと思います。

#### **Node.js**
Sublime Text 3上で、JavascriptのLintを動作させる用です。

#### **Ruby 2.1 64bit**
Sublime Text 3上でSCSSをコンパイルする用です。

#### **Composer**
SublimeText3上でPHP Lintを動作させるには、PHPCSとPHPMDの2つのパッケージをWindowsにインストールしなればならないですが、Composerでパッケージインストール＆管理をするときに必要です。

#### **Adobe Creative Suite 6**
イラレとフォトショップを使っています。周りではまだCreative Cloud‎を使っている人がおらず、ファイルフォーマット的にまだCS6で頑張れそうです。 FireworksとDreamweaverはもう使っていません。

#### **iCloud**
複数Windowsマシン上のGoogle Chormeと、MACのSafariでブックマークを同期する用です。Firefoxはほぼスマホサイト制作時のJavascriptデバッグツールと化しているので、ブックマークは同期していません。同期するブラウザが増えてくるとブックマークが重複したりなどの不具合が起きるので、そういう意味でも同期対象はChromeとSafariのみに留めておくのが無難です。IEブラウザも表示崩れをチェックするときしか使わないので同期対象外です。

* * *

## **開発・ネットワーク**

#### **SoftEther VPN Client**
遠隔のLANに入るとき用です。
#### **Git**
サイトデータのバックアップとバージョン管理用です。Gitコマンドをたたくことは少なく、後述するGUI Clients「SourceTree」がメインです。
#### **SourceTree**
Gitをグラフィカルに操作する用です。Gitに関する操作は、SourceTreeで大体出来ます。
#### **VMware Player**
テストサーバ管理用です。VMwareは多機能ですが動作が重いので、VirtualBoxへの鞍替えを検討中です。
#### **Tera Term**
定番コマンドラインツール。
#### **TortoiseSVN**
最近ではGit人気に押されて陰を潜めつつありますが、サイトデータのバックアップとバージョン管理で使っています。
#### **WinMerge**
ファイルの差分を確認するときに使います。
#### **WinSCP**
サイトデータのアップロード用です。ほとんどの場合は、Sublime Text 3のパッケージ「Sublime SFTP」の機能を使いますが、たまに相性が悪いWebサーバがあるので、そのときだけ使っています。
#### **ConEmu**
Windows標準のコンソールが使いづらいのでConEmuを使っています。テキストのコピペはTeraTerm的に文字列を選択するだけで出来るので楽だったり、タブ化出来たり、カラースキームを自分好みにカスタマイズ出来たりするので気に入っています。

* * *

## **カメラ・写真**
#### **SIGMA Optimization Pro**
SIGMAレンズのピント調整用です。手持ちの「18-35mm F1.8 DC HSM」はピント調整前と後ではAFの正確さが全然違うので、調整は必須です。
#### **Adobe Photoshop Lightroom 5 64bit**
大量の写真を管理したり、一括で効果を適用できたりと、様々なグラフィック効果を付加するたけでなく、写真ファイル管理ツールとしても優れています。
#### **Canon Digital Photo Professional 3**
キャノン機で撮影した写真（RAWデータ）で、ここぞというときはLightroomではなくDPPで現像します。 残念ながらAPS-C機しか持っていないので、ver.4への移行はしばらく不要ですね。

* * *

## **仕事効率化**

#### **Evernote**
仕事のドキュメント整理や、作業履歴などを取るときに欠かせません。 文書だけでなく、PHPやJavascriptのスニペットもEvernoteで管理しています。スニペットを管理するかどうかでコーディングスピードは天と地ほどの差がありますね。
規模の大きな開発案件をこなしていくには、ネット上で公開されているノウハウに頼るだけでは難しいので、例えば、今後使う予定があるWordPressプラグインのソースコードを読み解いて、APIの詳しい仕様を理解できたら、Evernoteに書き溜めていくということを繰り返していくうちにプログラミングはだんだん楽になっていきます。

#### **PowerMockup**
パワーポイントの有料アドオンです。ウェブサイトのワイヤーフレームを作るときに作業を高速化できます。ウェブサイトでよく使うパーツがシェイプとして登録されているので、それっぽいデザイン案がサクッと仕上がります。
#### **1Password**
サイトのアカウント管理や、アプリケーションのライセンス管理用です。 今まではエクセルシートで管理していましたが、スマホ端末でもそれらの情報を管理＆参照する機会が増えてきたので、そんなときは1Passwordが便利です。
#### **ATOK 2014（ATOK Passport）**
以前はGoogle 日本語入力を使っていましたが、ATOK Passportのマシン間での辞書同期機能に惹かれて使い始めました。使い始めの頃は、変換精度がGoogle 日本語入力と大して変わらずにガッカリしますが、使い込むほどに自分仕様になってきます。
#### **bluewind**
世間ではマイナーツールですが、僕の中では超定番のテキストランチャーです。シンプルで使いやすくて秀丸エディタと同じくらい手放せないツールです。かれこれ15年ほど愛用してます。
#### **Clover**
WindowsのエクスプローラにGoogle Chromeと同等のタブ機能を追加できます。何らかの理由で作業中断した後に、再立ち上げをしたときでも、前回開いていたタブがそのまま開くので無駄な時間を省くという点でも導入の価値があります。
#### **Canon MG3200 series driver**
個人事業主なので請求書などを出力するときにプリンターは欠かせません。写真を出力しなければ、キャノンの一番安いやつで十分です。
#### **ELSA GPU Optimizer**
NVIDIA GeForce GTX 960 2GB搭載のELSA社製グラフィックカードを使っています。ゲームをしなくてもフォトショップやライトルームで写真を扱うときは、やはりグラフィック性能が作業効率に影響します。あとマルチモニター環境ではCPUの負担が減るので、性能が高いに超したことはありません。

* * *

## **コミュニケーションツール**

#### **Thunderbird**
Windowsの定番メーラーです。Gmail（IMAP）との連携がサクサクで快適です。 以前はBecky!2を使っていて、POP3を使う分には動作が軽快で悪くなかったですが、新しいテクノロジーに追いついていない感が否めません。Thunderbirdならメール自動振り分けやスパムフィルタなどもBecky!2と同等以上に機能してくれます。
#### **Skype**
仕事の連絡はSkypeメインでときどきLineです。 最近ではメールはほとんど使いません。
#### **SugarSync**
仕事仲間とファイルを共有するときに使っています。

* * *

## **BGM・息抜き（音楽・動画）**

#### **foobar 2000**
仕事BGMは、最近ではSoundCloud.comばかりですが、ローカルの音源を聴くときは、foobar 2000が多数のフォーマットに対応している上に音質も良いです。あと、CDからのリッピングもfoobar 2000で出来ます。
#### **VideoLAN**
あらゆる動画フォーマットを再生できるので、動画ファイルはすべてこれに関連付けしておけば間違いないです。
#### **Radiko Player**
AMラジオを聴く用です。 （FMラジオはケーブルTV回線を利用してのAVオーディオ越しに高音質で聴いてます）
#### **iTunes**
iPod Touch、iPad Airに音楽や動画を突っ込むとき用です。iTunes自体で音楽を聴くことはありません。