Web制作ツール
SYNCの追加でバージョンアップしたWeb準拠CSSベースのWeb制作ツール
BiND for WebLiFE* 2.5
デジタルステージ
「BiND for WebLiFE*」は従来のWeb制作ツールの概念を取り払い、誰でもが簡単な操作でCSSで構成されるWeb準拠のWebサイトが構築できる次世代のWeb制作ツールとして登場した。良質なデザインパーツとレイアウトの組み合わせをカスタマイズするだけでWebサイトが制作できると定評のあるBiNDだが、今回の2.5では新たなツール「SYNC」が追加され、Webサイト上の要素としてさらに動的なコンテンツが挿入可能になった。

BiND 2.5パッケージイメージ
デザインを組み合わせてWebを構築できるBiND
BiNDはXHMLとCSSで組まれたデザインされたWebサイトがカートリッジとして数多く用意されており、その中から自分好みの色などからセットを選択し、Webサイトの中に入っているダミー文章や写真を入れ替えたり、デザインやレイアウトをカスタマイズすることでWebサイトを構築を行っていく。
BiNDで作成されるXHTMLとCSSは完全に分離されているため、ブロックテンプレートを使ってカラーを変更したり、ヘッダのスタイルなどを瞬時に変更できる。CSSの知識がなくとも用意されたデザインを選ぶだけで作成できる。またこれらの作成されたソースは完全にWeb準拠になっているだけでなく一般的に使われるIE, Firefox, Opera, Safariといったブラウザ上での再現性を考慮した記述が既に組み込まれているため、各ブラウザでの検証作業というステップを排除することができるの強みもある。Web上に置くボタンやバナーなどの画像を作成するためのツールとして利用されるのがSiGNだ。これは写真のトリミングや文字の追加、さらに鏡面エフェクトやドロップシャドウなどの効果が簡単に加えられるツールで、これもデザインされたボタンなどの素材が数多く用意されているので、ボタン名を書き換えるだけで自分用のボタンが作成できるという簡単さだ。
BiNDを起動するとサイトテンプレートの選択から開始される。カラーバリエーションを含んだサイトが48種類用意されており、追加デザインのカートリッジを加えることも可能だ。サイトテンプレートにはテキストや写真が挿入されているので文章を書き換えたり写真を変更・追加が行える。またページを追加したりナビゲーションの位置を移動するといった目的に合わせたカスタマイズも可能だ。ページ上にある挿入されるブロックは、「ブロックテンプレート」を使ってデザインを変更したり、Ajaxを使ったインタラクティブなコンテンツに変更することもでき、アコーディオンカーテン式のメニュー表示や、タブで切り替え可能なメニューなども用意されている。BiNDの製品紹介サイト自体がBiNDで作られており、BiNDでできること。デザイン性を伺い知ることができる。

サイトシアターの用意されているデザインから選んで作成したあとは個々のページ上の要素を編集していく

複数のページとページ上でコンテンツやナビゲーションなどの用途ごとに分かれており既にボタンや内容のダミーが挿入されている

ブロックエディタではXHTML側の内容を記述していく。デザインは設定で行うため、ここではコンテンツ内容に集中できる

ブロックレイアウトとブロックスキンで、見た目の印象の変更を行う
Googleと連携するSYNCの追加
BiND 2.5では新ツールSYNCが追加された。BiNDのブロックエディタ上からSYNCを起動するとBiND上に挿入できるGoogleのサービスが並ぶ。これらにはGoogleがフリーで提供しているブログサービスであるBlogger、Officeの書類を読み込んでオンライン上でワープロや表計算が作成できるGoogle Docs、おなじみの動画共有サイトYouTubeがある。これらGoogleの提供するサービス上で作成されたコンテンツをBiNDのサイト上に挿入できる。
SYNCはGoogleとのやり取りを行う専用サーバーを介してアクセスするため編集時にはインターネットに接続する環境が必要だが、一度挿入しておけば、後は自動的にGoogleからデータが読み込まれ最新のデータに更新される。SYNCでこれらサービスを利用するには、あらかじめGoogleのIDとパスワードが必要になる。一度入力しておけば、あとは自動的にアクセスしSYNC上でリスト表示される項目から選んでいけばよい。

SYNCの起動画面。挿入可能な4種類のボタンが用意されている
bloggerやGoogle Docs、YouTubeとの連携
あらかじめBloggerに登録しブログのアーティクルを投稿しておくと、そのコンテンツをSYNCを使ってBiNDで作成しているページに挿入することができる。自サイトのデザインの中にブログの記事だけを表示されるようになり外部のブログサービスを使っているようには見えない。またブロックエディタを使ってデザインを変更することもでき、一度設定しておけば後はblogger側ででアーティクルを追加するだけで自動的に更新されるので日々のニュース性のある記事などの投稿がしやすい。

bloggerの内容を挿入するときは、メインの記事部分かサイドバーのカレンダーなどを挿入するかを選べる

見た目のデザインはBiND側のブロックスキンで色や雰囲気を変えることができる
Google Docsは表計算やワードプロセッサのデータを作成でき、OfficeのExcel文書を変換して読み込むことが可能だ。BiNDには表を作成する機能はないが、Google Docsの書類をSYNCを使って組み合わせれば表として挿入することができる。Web準拠の書式ではなくなるが、アプリケーションを起動せずに文書を共有することが可能になる。
同様にGoogle Docsに用意されているフォーム機能を使って、ページ上に問い合わせフォームを挿入することも可能だ。SYNCからフォームを選び、フォームの種類と必要な項目名を設定すれば自動的にGoogle Docs上にフォームが作成されBiNDのブロック内に挿入される。記入されたデータはメールで転送したりGoogle Docsの中に書類として蓄積できる。

フォームでは、内容を確認してから挿入される。通常はCGIなどサーバに用意されている機能を使わなければならないが、Google Docsならプロバイダに縛られないフォームが作成できる
YouTubeの場合も同様にGoogleのアカウントが利用できる。ログインするとマイ動画など登録された動画がプレビュー付きで表示される。あとは挿入したいビデオを選択して適用するだけで完了するので、アドレスを意識する必要がないのは気が楽だ。

SYNCで挿入したコンテンツは独自のアイコンが付いている。SYNCの挿入を行うには「SYNCウィジェット」をクリックすると、アプリケーションが起動し連携を行う

YouTubeの動画を挿入するときにはリストで動画が表示されるので確認してから適用できる
バージョンアップとカートリッジの追加
今回のバージョンアップに合わせてBiND本体側も細部で更新されている。サイト設定ではGoogle Analyticsのコードを挿入し訪問者数などをグラフを使って調べられるアクセス解析の利用が可能になった。またSYNCにもエフェクト機能が追加されるなど細かな点で操作性が向上している。追加カートリッジの提供などもありBiNDの拡張性は製品リリース後も継続している。バージョン2.5はアップデータの形でBiND2のユーザーには無償ダウンロードでバージョンアップが行われるので是非試して欲しい。

ボタンやバナーを作成するSiGNも、テキストの効果が追加されている
(樋口泰行/樋口デザイン事務所)
■価格
19,800円
■Windows版
OS:Windows XP SP2以上, Vistaの日本語版(64bit版とサーバー版を除く)
CPU:Intel製CPUもしくは完全互換CPU搭載機種(Pentium4以上を推奨)
メモリ:256MB以上の搭載メモリ(512MB以上推奨)
モニタ:1024 X 768ピクセル(XGA)以上のモニタ (1280x1024ピクセル以上推奨)
HDD:500MB以上のハードディスク空き容量 (2GB以上の空き容量推奨 / RAID環境を除く)
その他:Internet Explorer 7以降のバージョン(ソフト本体の起動に必要) CD-ROMもしくはDVD-ROMドライブ(インストール時) インターネット接続環境とご自分のメールアドレス(初回起動時のみ必須) ユーザー登録が必須です FTP接続できるウェブサーバー
■Macintosh版
OS:Mac OS X 10.4.11以降(PowerPC, IntelMac両対応/OS9非対応)
CPU:Mac OS Xの動作が保証されているApple純正Mac (G5以上推奨/メモリ512MB以上推奨 / Universalバイナリ形式)
モニタ:1024 X 768ピクセル(XGA)以上のモニタ (1280x1024ピクセル以上推奨)
HDD:650MB以上のハードディスク空き容量 (2GB以上の空き容量推奨 / RAID環境を除く)
その他: Safari3.1以降のバージョン(ソフト本体の起動に必要) CD-ROMもしくはDVD-ROMドライブ(インストール時) インターネット接続環境とご自分のメールアドレス(初回起動時のみ必須) ブロードバンド環境(2Mbps以上の回線速度)推奨(インストール時) ユーザー登録が必須です FTP接続できるウェブサーバー
■問い合わせ先
デジタルステージ
http://www.digitalstage.jp/