Spry フレームワークとは、高度な Web ページの作成を可能にする JavaScript および CSS ライブラリです。 Spry では、HTML、CSS、および最小限の JavaScript を使用して、XML データを HTML ドキュメントに組み込むことや「アコーディオン」や「メニューバー」などの Widget による仕掛けを作成すること、そして様々なページエレメントに対して多彩な効果を追加することができます。Spry フレームワークは、HTML、CSS、および JavaScript の基礎的な知識があれば容易にマークアップを使用できるように設計されています。
Spry フレームワークは、主にプロの Web デザイナーやハイエンドアマチュアの Web デザイナーを対象としています。 企業レベルの Web 開発で使用される完全装備型 Web アプリケーションフレームワークとしては設計されていません。
RSS フィードまたはデータベースから XML を使用してデータを Web ページに統合します。統合したデータは、簡単にソートおよびフィルタすることができます。
この XML データによるページへのシームレスな統合によって、ページの更新を行ったり特別なサーバーを使用したりせずに、データをすぐに読み込むことができます。
このようなインタラクティブ性を追加するには、CSS および JavaScript について多くの知識が必要でしたが、この『Spry データ』を活用することにより、比較的簡単にこのような処理を行うことができるようになりました。［fig.01］
［fig.01］
Spry Widget とは、多くのプログラミングの知識を必要とせずに、ページにドロップできるリッチなユーザインタフェースコンポーネントです。
Widget を使用して、リスト、テーブルおよびリピート領域などの一般的なユーザインタフェースコンポーネントを Web ページに統合することができます。
挿入ツールバーの「Spry」セクションから希望の Widget を簡単に追加できます。［fig.02］
Spry Widget の構成としては、以下の通りです。
Spry フレームワークは、標準の HTML、CSS、および JavaScript で書かれた再利用可能な一連の Widget をサポートします。 これらの Widget において、最も単純なものは HTML と CSS のコードであり、容易に挿入し修正して使用できます。フレームワークのビヘイビアには、ユーザーがさまざまな操作をできるようにする機能が含まれます。例えば、ページコンテンツの表示と非表示を切り替える、ページの色などの外観を変える、メニュー項目をインタラクティブに使用するなどの機能があります。
Spry フレームワークの各 Widget は、それぞれ固有の CSS および JavaScript に関連付けられています。 CSS ファイルには、Widget のスタイル設定に必要なすべての設定が含まれています。JavaScript ファイルは、Widget の機能を提供します。 Dreamweaver CS3 を使用して Widget を挿入すると、Widget が機能とスタイルを持つように、Dreamweaver CS3 によってこれらのファイルがページに自動的にリンクされます。
Widget に関連付けられた CSS および JavaScript ファイルは、その Widget にちなんだ名前が付けられています。このため、どのファイルがどの Widget に対応するかを容易に見分けることができます。
［fig.02］
Spry エフェクトとは、JavaScript を使用して HTML ページのほぼすべてのエレメントに適用できる視覚効果です。 効果は、情報の強調やアニメーションの作成、ページエレメント外観の一時的な変更などによく使用されます。 HTML エレメントに効果を適用するときに、追加のカスタムタグは不要です。
［ビヘイビア］パネルで［+］ボタンをクリックし、メニューから【効果 → 希望の Spry エフェクト】を選択します。［fig.03］
［fig.03］