2014.4

2014年のMacのWeb制作環境。

2014.04.10 / Notes

Web制作ではこれまでずっとMacで行っていますが、使っているアプリケーションの制作環境は少しずつ変わってきました。
2010年当時は、こんなラインナップでした。今でも使い続けているものもありますが、便利さなどを判断して違うアプリケーションに置き換えたものも多いです。今現在の自分のWeb制作環境をご紹介します。

Espresso

Espresso

Web開発でメインで使っているテキストエディタです。Macらしいインターフェイスで軽快に動作するところが気に入っています。ほかのテキストエディタ同様にEmmetを導入することで生産性がぐっと上がります。唯一の不満点をとしては、ウィンドウ分割ができないところでしょうか。以前はCodaをメインにしていましたが、動作が少し重いのとタブのデザインが好みでなかったので、最近ではあまり使わなくなりました。

 

 

Illustrator

Illustrator

ベクターベースのグラフィックツールです。デザインカンプの作成や、画像パーツの作成・スライス処理など、日常的に活用しています。こちらも以前はFireworksで行っていた作業でしたが、CS6をもってFireworksの開発が終了したのを機に、思い切ってIllustratorに移行しました。最近はIllustratorによる作業にも慣れて、改めてその多機能さに感心しています。もっと使いこなさないと。

 

 

Photoshop

Photoshop

画像の編集、Web用の書き出しにはPhotoshopを使っています。サイズの縮小などによるリサンプリングはやはり一番きれいです。

 

 

MAMP

MAMP

MacでApache、MySQL、PHPなどを、ローカル環境で利用できるようにするためのパッケージです。このアプリケーションもWeb開発では必須ではないでしょうか。自分はGUIで細かく設定できるMAMP PROの方を使っています。

 

 

ForkLift

ForkLift

ファイルブラウザ&FTPクライアントです。このアプリケーションも長く使い続けているものの一つです。Finder自体もタブに対応したり進化していますが、ForkLiftではデュアルパネルがあって、さらに便利です。

 

 

Evernote

Evernote

オンラインノートアプリです。Webで見つけた情報のスクラップや、制作の中のちょっとしたメモなどに重宝しています。忘れてしまいがちな情報を記録することは大事だと感じるこのごろです。

 

 

Dropbox

Dropbox

オンラインストレージです。デバイス間でのデータの同期ができるので、デスクトップで行っている作業を場所を変えてノートで行ったりと、ワークスタイルの幅が広がりました。データ自体のバックアップという意味でも安心につながります。

 

 

Parallels Desktop

Parallels Desktop

Windowなどの仮想マシンを構築できます。サイトの動作検証にも十分なので、Windows実機に触れる機会はますます減りました。

 

 

Byword

Byword

文章を書くことに特化したテキストエディタです。マークダウンにも対応しているので、ちょっとしたアウトライン作成に活用しています。

 

 

TextExpander

TextExpander

テキストの入力補助アプリケーションです。短い文字列を入力入力することでスニペットを展開して入力することができます。よく使うHTMLタグやjQueryのコードをあらかじめ登録しておくことで、素早いコーディングが可能です。

 

 

Codebox

Codebox

上記のTextExpanderでは入力を目的としたスニペットですが、こちらはある程度長いコードをストックするためのアプリケーションです。汎用的なスクリプトを再利用するために、残しておくようにしています。

 

 

Dash

Dash

プログラミング言語のリファレンスとスニペット管理アプリケーションです。膨大な種類の言語のリファレンスが用意されていて、高速に検索することができます。

 

 

Window Magnet

Window Magnet

ウィンドウを上下左右に均等に分割して表示するためのアプリケーションです。画面の左半分でコーディング、右半分でブラウザでの確認といった感じに、画面もきちんと整理整頓したい人向け。

Drupal 7のテーマでIE向けのJavaScriptの読み込み。

2014.04.05 / Notes

Drupalのテーマで、古いIE向けに条件コメント付きのJavaScriptの読み込み方法です。

 

テーマディレクトリ内の「template.php」ファイルにプリプロセスとして次のように記述します。

実際のレンダリングでは次のようになります。