カスケーディングスタイルシート(CSS)は、Webページ上の1つまたは複数のブロック(テキスト範囲)に適用できるスタイルを作成できる、広く使用されているWebデザイン技術です。特定のテキストやレイアウトを同じようにフォーマットしたい場合、毎回詳細を繰り返してローカルに書式設定する代わりに、CSSを使用すると、一度記述すれば何度でも使用できます。
CSSは、Webフォーマットの標準化を目的として設計されました。CSSが広く普及するまでは、多くのWebデザインプログラムが生成するフォーマットコードは、表のセルとブラウザのハックを組み合わせたもので、一般的なブラウザ間で一貫した外観が得られず、生成されるHTMLは判読不能な場合が多く、適切に編集することはほぼ不可能でした。CSSを使用すると、デザインプログラムにコードを自動生成させながら、特にブラウザ互換性のために裏で微調整が必要な場合でも、そのコードを解読することが可能でした。
CSSの理論は素晴らしいように聞こえますが、最高のWebデザインプログラムはDreamweaverのような高価で習得の難しいパッケージであり、一方、安価でシンプルなWebオーサリングプログラムの多くはCSSやプレビューを制御できません。その中間のツールを探している場合、つまり外観とスタイルを正確に制御したい場合、特にテンプレートを使用してコンテンツデータベースからテキストを挿入するサイトで作業している場合、MacRabbitのCSSEditはほぼ理想的な中間点となります。この一見シンプルなプログラムは、Bare BonesのBBEdit( )のようなプログラムでCSSを手動でコーディングすることと、Adobe Dreamweaver CS3()のような本格的なWebサイト開発ツールを使用することの間のギャップを埋める役割を果たします 。
それは単なるCSSです

CSSEdit は CSS エディタ以外の何者でもないという姿勢を貫いており、だからこそ優れたパフォーマンスを発揮します。スタイルシートエディタとして、スタイルを適用する HTML 内の選択範囲を定義するセレクタのリスト(デフォルト)、スタイルの基盤となる CSS コード、そして特定のスタイルに設定可能なすべてのプロパティと値を表示する、長いスクロール式の折りたたみ式パネルが表示されます。エディタウィンドウは、個別のウィンドウとして、または単一のウィンドウ内のタブとして、任意の数だけ開くことができます。
プレビューウィンドウは、スタイルシートエディタを補完し、スタイルに加えられた変更の効果を表示します。ローカルに保存されたファイルをプレビューする場合、CSSEdit はそのファイルに変更を保存するたびにプレビューを自動的に更新します。リモート Web サイトで基礎となる HTML を変更した場合は、プレビューを手動で更新できます。
ワークフロー
CSSEditには、単一目的プログラムならではのもう一つの利点があります。それは、ワークフローに多くの分岐やオプションを含める必要がないことです。非常にシンプルなパスです。まず、空のスタイルシートを作成するか、既存のスタイルシートをローカルで開くか、Webページからスタイルシートを抽出するか、あるいはこれら3つを任意の組み合わせや数だけ選択できます。
ウェブサイトまたはローカルファイルのライブプレビューを使用して、HTMLで参照されるセレクターの定義や変更を開始します。ウィザードを使用すると、複雑な構文を知らなくてもセレクターを作成できます。CSSを編集していくと、ページが形作られ、再構築されていきます。ライブプレビューは、画面上で長方形のブロックを定義できるdivタグのネストが複雑な場合に特に便利だと感じました。これにより、手作業でCSSをコーディングする際によくある混乱から解放されました。
ライブ プレビュー ウィンドウには 2 つのモードがあります。X-Ray モードでは、ページ上のさまざまなポイントをクリックして、その下のセレクター情報を表示し、グラフィカルに強調表示することができます。通常モードは、ナビゲーションのために Web ブラウザーと同じように機能します。
CSS の強みの一つは、複数のセレクターに同じプロパティを単一のスタイルで適用できることです。例えば、フォントファミリーや背景色の設定などです。同じセレクターを 1 つ以上含むスタイルを追加し続けることで、さらに細かく調整することができます。つまり、複数のスタイルが同じセレクターを参照できるということです。CSSEdit の X-Ray モードには、特定のセレクターを含むスタイルを整理するのに役立つ便利なインスペクターが用意されています。ユニットを選択し、ライブプレビューウィンドウの上部にあるインスペクターボタンをクリックすると、適用されたスタイルインスペクターに、そのユニットに適用されているセレクターを参照するすべてのスタイルが一覧表示されます。インスペクターでスタイルをクリックすると、CSSEdit はそのスタイルが表示されているスタイルシートの部分を表示して選択します。
手作業でコードを書くことに慣れている方は、ソースエディタペインに直接コードを入力してスタイルを変更できます。CSSEdit は入力時に自動補完を行い、可能なプロパティと最も可能性の高いプロパティ、そして値を表示します。(この機能はオフにすることもできます。)
手作業で何か間違えていないか確認するには、「検証」機能を使うことができます。この機能は、ワールドワイドウェブコンソーシアム(W3C)のCSS標準に照らして値をチェックします。このツールは、他の人のサイトのトラブルシューティングにも役立ちます。CSSEditでCSSを抽出し、「検証」をクリックして、何が間違っていたのか(そしてどのように修正するのか)をメモしておきましょう。
CSSEdit で作業する際に、マイルストーンを保存できます。マイルストーンとは、デザイン作業の途中の中間段階のステップで、その段階で行った変更内容をメモとして追加しておくことができます。マイルストーンメニューから選択することで、任意のマイルストーンに戻ることができます。

最後に、すべてが完璧になったら、スタイルシートファイルをWebサイトが配置されているサーバーにプッシュします。残念ながら、ここでCSSEditの優れたアプローチの2つのボトルネックのうち1つに遭遇します。
現実世界のアプリケーション
CSSEdit が特に印象的だったのは、特に2つの用途です。まず、コンテンツ管理システムやブログソフトウェアで使用するテキストのプレースホルダを含むテンプレートファイルを編集することがよくあります。編集システムは多種多様であるため、プレースホルダを埋めるシステムから直接テンプレートを読み込まない限り、テンプレートに加えた変更の外観をプレビューするのは難しいことがよくあります。CSSEdit は Web アクセス可能なページのライブプレビュー機能を備えているため、テンプレートシステムでの作業に最適なツールです。
第二に、CSSEdit は特定の Web ページで使用されているすべてのスタイルシートを抽出し、それらを別々の名前のローカルファイルとして開くことができます。これは、既に構築済みのサイトを編集する際に便利です。例えば私は現在、少量の CSS と大量のテーブルを使って構築された大規模なサイトを、テンプレートベースの CSS 駆動型システムに移行するという、非常に時間がかかり、頻繁に中断される作業の真っ最中です。この作業の間、CSSEdit は常に私の味方でした。CSS ファイルの抽出によってワークフローが大幅に簡素化されました。これは、複数のコンピューターから複数のサーバー上で作業することもあるためです。(MacRabbit には、どのブラウザからでも使用できる 3 つのブックマークレットも用意されており、表示中のページから 1 つの選択項目でスタイルシートをプレビュー、抽出、プレビュー、または抽出を実行できます。)
制限事項
開発者はCSSEditにFTP(ファイル転送プロトコル)クライアントを組み込まなかったようです。プログラムが複雑になればなるほど管理も増えるので、その点は理解できます。MacRabbitはCSSEditのドキュメントで、多くの一般的なOS X FTPプログラムがFTP経由でダウンロードを行い、特定のファイルを監視して、変更されたファイルが保存されるたびに自動的にアップロードできることを指摘しています。
しかし実際には、この方法は私の場合、常にうまく機能したわけではありません。また、それぞれの失敗を徹底的にトラブルシューティングしたり、十分な数のFTPプログラムを試したりしたわけでもないため、私が経験した問題がネットワークの制限や私の理解不足によるものではないことを確信できていません。何人かの同僚は、Interarchy ( ) などの一般的なFTPクライアントを使用して、この種のマッピングを問題なく設定できました。
CSSEdit のもう一つの克服できない制約は、CSS や HTML が外観と書式を分離するのと同じくらい明確に形式と機能を分離しているため、作業対象の HTML コード内ですべての選択範囲を定義しなければならないことです。つまり、位置を指定したり前後にスペースを入れたりできるテキストブロックやグラフィックには Div タグ、インライン範囲のテキストには Span タグ、ヘッダータグや段落タグなどの HTML 要素を使用する必要があります。CSSEdit は HTML にアクセスして、どの範囲やセクションが定義されているか、またそれらの名前を変更することはできません。これは理論的には良いことかもしれませんが、BBEdit と CSSEdit を切り替えるのは少し面倒です。MacRabbit に、定義済みブロックのセレクタを任意に適用または変更できるシミュレーションモードや、別のプログラムを使用する必要がないように最小限の機能だけを提供するシンプルな FTP パッケージ(セキュア FTP サポートを含む)が追加されたら興味深いでしょう。これら 2 つの機能により、Command + Tab キーを押す回数が 1 桁減少します。
Macworldの購入アドバイス
CSSEdit 2.6は非常に特殊なニッチな分野ですが、時とともにその範囲は拡大しています。このプログラムは、スタイルシートを直接操作する必要があるユーザーを、本来の役割を逸脱することなく支援します。CSSEditは、CSSを一緒に作業してくれる最高のヘルパーであり、結果としてCSSの知識を向上させる最良の方法でもあります。逆説的ですが、CSSの複雑さを隠そうとするプログラムを使っていたおかげで、CSSの基盤をより深く理解できるようになりました。
[ Glenn Fleishman は最近、『Take Control of Sharing Files in Leopard 』 ( Take Control Books ) を執筆しました。 ]