Design Wedge バックナンバー：No.75

　
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━



◆     D e s i g n  W e d g e           internet/web design mail magazine 

＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
2003/11/12｜no 75｜ http://www.karadesign.com/designwedge/ ｜post>>magmag

((！))

現在、まぐまぐとPubzineの２つの配信システムよりDesign Wedgeを発行
していますが、Pubzineが来年二月に閉鎖となるようです。これを読んで
いる場合は配信元がまぐまぐからですのでなにも行う必要はありません。
Design Wedgeは引き続き、質の高いメールマガジンの発行を目指していき
たいと思っていますのでこれからもよろしくお願いいたします。

今号から登録された皆様、はじめまして。ご登録ありがとうございます。
Design Wedgeは、現在月２回発行のウェブデザインの専門誌です。
毎月１１日と２６日の発行を予定してます。

１１日発行予定号では、サイトデザインのレポートとモバイルデザイン
関連＋α、２６日発行予定号では、ニューストピックとウェブアプリケ
ーション関連のデザイン＋αという感じで、ウェブデザインの世界を様
々な角度から探究していっています。これからもDesign Wedgeをよろし
くお願いします。

まぐまぐからのバージョンにはヘッダーもしくはフッターにはお知らせ
がはいっています。当分はフッターだけのようです。

―――――――――――――――――――――――――――――――――――――

-PR-----------------------------------------------------------------------
◆Design Wedgeに広告を掲載してみませんか？┌──────────────┐
◆掲載場所はヘッダー部分のここです        │ [self AD - No.007]         │
◆広告スペースを全角３７文字×７行です    │ -------------------------- │
◆メールにてお気軽にお問い合わせ下さい    │ design * media = your site │
                                          │          KaRa designstudio │
                                          │ http://www.karadesign.com/ │
>> mailto:designwedge@karadesign.com      └──────────────┘
-PR-----------------------------------------------------------------------


    ≫ c o n t e n t s

   +01 特集１：ワールドサイトデザインレポート
   +02 特集２：デジタルデバイスのゆくえ
               「ウェブデザイナーのためのPocket PC入門」
   ---
   +03 プレスブース
   +04 特設　：「IEの仕様変更に伴うリッチコンテンツ埋め込み対策３」
   ---
   +05 リーダーズブース
   +06 Design Wedgeよりお知らせ
   +07 編集後記

   今号のバックナンバーは、
   ( http://www.karadesign.com/designwedge/backnumbers/0075.shtml )
   にてご覧になれます。


 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +01 特集１：ワールドサイトデザインレポート
       ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

 " ( KH Films ) "
 ( http://www.khfilms.com/ )

僕のイニシャルはK.Hなのですが、このサイトは同じK.Hというイニシャル
を持つKent Herveyという方が経営する会社のサイトです。コマーシャル
やドキュメント映像を主とした仕事をされているそうで、サイトの「FILM」
メニューから各種の動画を見ることが出来ます。シンプルな構成ながら
Flash MXの機能を活かしたムービー周りのインターフェイスはいいです
よね。それにしても、ここで見られる各種の動画、さすがにプロの作る
ものは違うと唸らされるものばかりです。

インフラが整い、大手サイトが更に巨大化していく可能性があるウェブ
の将来には、今のFlashバナー広告に代わりこれくらいのクオリティのCM
がサイトに掲載されるかもしれません。そういえば、海外のサイトをよ
く見ていると、グローバルな活動をしているサイトでは小さな世界地図
で自分の会社の居場所を知らせる企業をたびたび見ます。


 " Periscope.ca "
 ( http://www.periscope.ca/ )

深海でサーチライトを照らしたかのような深い青色が印象的なサイトで
す。このサイト、英語版とフランス語の切り替えが右上部のスイッチで
シームレスに行えるようになっています。このあたりの切り替えはFlash
ならではという気がします。


 " SAMSUNG's Digital World - Global Exhibition "
 ( http://www.samsung.com/DigitAll/GlobalExhibition/06_worldtour2003.htm )

韓国の総合電機メーカーのサムスンのイベントサイトです。多彩な表現
でアプローチされてくるクオリティの高いFlashムービーは圧巻です。
アジアの勢いがウェブからもひしひしと伝わってきます。単にムービー
を見せるだけではなく、シンプルだけど使いやすいプレスリリースのイ
ンターフェイスなど、おさえるべきところはしっかり押さえられていて、
誰が作ったんだろうと気になります。リリースはダウンロードとプリン
トが用意されている点も親切です。


 " Turespa - Spain Tourist Information "
 ( http://www.spain.info/Portal/EN/Default.htm )

スペイン旅行の情報を満載したサイトです。左にグローバルメニュー、
真ん中にコンテンツ、右側に各種ナビゲーションを搭載したオーソドッ
クスな造りなのですが、インターフェイスにちょっとしたひねりが加え
られているおかげで独特なデザインを感じさせます。平凡なものを個性
的にするにはちょっとしたアイデアなんだよなあと改めて思わされます。
また、ここのサイト、サイトマップがカテゴリ、構造の把握がしやすい
スタイルになっていますが、こういうプロが説明するときに使うような
サイトマップを表に持ってきたところに意表をつかれました。このサイ
ト、WAPやPDAにも対応しています。


 " MARC PRESTON PRODUCTIONS "
 ( http://www.marcpreston.com/ )

ボイスアーチストのサイトです。ここのサイトもクオリティが高いです。
よく、すばらしいクオリティのサイトを見て回っていると、プログラム
と連携するような例えばゲストブックのページに移動した途端、急にデ
ザインのクオリティが落ちてがっかりすることがあります。その点、こ
のサイトのゲストブックはFlashをコンパクトに使い、サイトの雰囲気を
完全に継承しています。


 " Fantasmagoria Interactive "
 ( http://www.fantasmagoria.com/site_2002/main.html )

ナビゲーションが巧みで、紙飛行機を作る過程を会社の説明にからめて
紹介しています。このアイデアは素晴らしく、紙飛行機が完成するとそ
こはお問い合わせのフォームとなってしまうわけです。上手いですよね。
情報が表示されるスペースは小さいですが、スペースを巧みに使ったレ
イアウトは巧みです。特にNewsの時系列表示やContactの簡潔なフォーム、
Project Plansの説明などはこれ以外のいい方法はないのではないかと
思わせられます。


 " AltaVista "
 ( http://www.altavista.com/ )

９０年代中期から後期にインターネットにはまった人なら知らない人は
いないのではないかとおもうAltaVistaのサイトです。買収されて以降方
針を転換してロゴも一新していました。AltaVistaというサイト名を聞く
とすぐに、爽やかな色使いのインターフェイスと雪をかぶった山頂のシ
ンボルマークが目に浮かび、デザインという部分からブランドを生み出
した数少ないサーチエンジンというイメージがあったのですが、そんな
趣は無くなっています。googleという究極のシンプルさが与えた影響と
いうのは計り知れなかったと改めて思います。


 " The Cocoe Conspiracy Headquarters (TCCH) "
 ( http://www.cocoe.com/ )

独特のカラーバランスが超現実的な雰囲気を生み出しています。手前の
車をよく見てみてください。車が停止した後、カチャカチャと火をつけ
て、ドライバーがタバコをすっているのがわかります。微妙ですが、タ
バコの煙もちゃんと立ち上っています。このサイトでは、キャラクター、
アニメからビデオまで多彩な仕事を見ることが出来ます。


 " Welcome to XM2 Online "
 ( http://xm2.com/welcome.html )

Flashの可能性というものを実感出来るサイトです。様々なサイトで取り
上げられていたのでご存知の方もいると思います。Flashという枠組みの
なかでどうやったらリアルな表現が出来るのかということの一つの回答
が、イントロの場面で登場する布の表現なのではないかと思えます。XM2
はオーストラリアの制作会社ですが、最近インドネシアにもオフィスを
オープンさせたとのこと。そういえばこのあたりのアジアの制作会社は
どういったものを造っているんでしょうか。そのうち特集をやってみた
いと思います。



 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +02 特集２：デジタルデバイスのゆくえ
       ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

--- ウェブデザイナーのためのPocket PC入門 ---

Pocket PC 2002やWindows Mobile 2003といったPDAを様々な展示会場で
見てきたせいか、最近Pocket PC派に染まりつつあります。今回はウェブ
デザイナーのためのPocket PC入門を書いてみようと思います。


Windows CE系のOSを搭載したPDAで現在主流となっているのは、Windows CE 3.0
ベースのPocket PC 2002と、Windows CE.NET 4.2ベースの最新バージョン
であるWindows Mobile 2003。今のところ、市場は両者が混在している感
じで、ベースのOSが違う他は、320*240のQVGAと解像度などは同じである。
値段はだいたい２万〜５万くらいの間となっている。

搭載されているブラウザは、Pocket PC 2002に搭載されているPocket IE
がHTML 3.2相当で、Windows Mobile 2003に搭載されているPocket IEは
IE5.5相当となっている。ただ、Pocket PC 2002も、NetFrontをインスト
ールして導入することで、W3C推奨の最新のブラウジング環境が手に入る。

 " NetFront "
 ( http://www.access.co.jp/products/nf.html )


 -- Pocket PC利用法

Pocket PCはPDAなので、Outlookと同期してスケジュールやアドレス管理
なども出来るし、CFタイプやSDタイプの無線LANカードを用意することで
最近ますます増加しているホットスポットを気軽に利用出来るが、ウェ
ブデザイナーならではの使い方として、ウェブサイトの構築補助や学習
に役立てるのはどうだろうと提案してみる。Pocket PCは、OSごとと更に
CPUごとによってインストールファイルが違うのでソフトをインストールの
際は注意しよう。


  - リファレンスに

ウェブデザインソフトの各種ショートカットキーやコマンドをPCでメモ
しておいて同期させておくと、分からなくなったらサッと見ることがで
きる。また、タグリファレンスや技術文書、言語リファレンスなども外
部メモリ内に入れておくと、非常に重宝する。Pocket PCで読めるファイ
ルには、テキストファイルやHTMLファイル、ワード文書の他に、Adobeか
らはAcrobat for Pocket PCというPDFビューワーが出ているのでこれに
よりPDF書類も閲覧することが可能だ。


  - ウェブデザインのちょっとした勉強に

NetFrontを入れていたり、Windows Mobile 2003を入れている場合は各種
ウェブ技術の勉強に役立つ。ブラウザとエディタが入っているので、ちょ
っとした空き時間には、XML、XHTML、DOM、CSSなどの実装を試すことが出
来る。少し前にやったRSSもブラウザでツリー表示を行うなどして確認で
きる。また、Javascriptに関しては、フリーでJavascriptエディタという
ソフトもあるので、こちらで楽に作成して実行することが可能である。

 " JSEditor for Pocket PC "
 ( http://pocket.vector.co.jp/soft/se188625.html )


  - サーバー側の技術の勉強に

Pocket PC 2002には、知っている人には有名な話だが、ApacheやPerlと
いったサーバーソフトウェアやプログラミング言語が移植されている。
Apacheは1.3.20ベースのもので、うちで借りているホスティングサーバ
ーと同等のものだ。Perlも有名なものは5.6ベースのものがあり、5.8な
どもあるらしい。5.6で試しているが、ちゃんとモジュールなども使え、
Apacheとブラウザと合わせてCGIの実験も可能となる。

更に、Pocket PC 2002 2003にはFlashプレーヤーのバージョン6が用意さ
れていおり、これと組み合わせることで、Flashをフロントエンドに使っ
たちょっとしたリッチインターネットアプリケーションの実験も単体で
行うことも可能になる。

 " General Paranoyaxc PerlCE "
 ( http://www.rainer-keuchel.de/wince/perlce.html )

 " General Paranoyaxc ApacheCE "
 ( http://www.rainer-keuchel.de/wince/apache-ce.html )

 " Macromedia Flash Player 6 for Pocket PC 2003 "
 ( http://www.macromedia.com/software/devices/products/pocketpc/downloads/ )


と、すぐ思い付くだけでもこれくらい様々なことができるわけで、ウェ
ブデザインに興味がある人の通勤通学のお供にぴったりだと思う。他に
も、Java関連やSDK関連で更に奥が深い世界が広がっているわけだがその
辺はまたいつか書いてみたいと思う。



 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +03 プレスブース
       ￣￣￣￣￣￣

((！))
Design Wedgeでは、このたび、募集・告知コーナーを、企業の皆様から
のプレスリリースやイベント情報を掲載するプレスブースと、読者の方
の情報募集やプロジェクト発表、イベント、提案、発表のためのリーダ
ーズブースとして分離しました。

このコーナーでは企業情報、イベント情報や求人募集スペースとして場
所を提供していきます。スペースは、３２文字×２０〜２５行くらいと
なります。掲載のご依頼お待ちしてます。
メールにてお問い合わせ下さい。

  ↓
 mailto:designwedge@karadesign.com



 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +04 特設　：IEの仕様変更に伴うリッチコンテンツ埋め込み対策３
       ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

--- IEの仕様変更に伴うリッチコンテンツ埋め込み対策 PART III ---

Microsoft IEブラウザの仕様変更のゆくえは今後どうなるのかはわから
ず、二転三転する可能性も多いにありえるので、そのあたりを踏まえて
取り組んでいきましょう。


 -- 今回の解説

 " Macromedia Japan - アクティブコンテンツデベロッパーセンター "
 ( http://www.macromedia.com/jp/devnet/activecontent/ )

に記載されている、Javascriptを使った回避法パート１に関する部分の
続きをやります。仕様変更がされたβ版のブラウザをここではIE6update
と呼ぶことにしています。


前回、Javascriptを使った回避法パート１の書き方の例をやりました。
今回はその書き方をした際の実装について考えてみます。全ての訪問者
のコンピュータ上で、Javascriptがオンになっており、Flashプレイヤー
もインストールされているとしたら、もはやするべきことはないのです
が、世の中には、JavascriptもFlashも動作しない又はどちらか一方が動
作する環境、あるいは動作しないようにしている場合や閲覧が出来ない
環境もあるわけで、このあたりは考える必要が出てきます。

前回の方法のみで実装すると、Javascriptが動作しないあるは意図的に
動作をさせないようにしている場合、何も表示されなくなってしまいま
す。そこで、<noscript></noscript>を活かすというやり方があります。
この<noscript></noscript>内に何を置くかについては、ユーザーの想定
や配信側の目的の違いによりいくつかの選択が考えられます。


 -- Javascriptをオフにしている人とFlashのプラグインを再生できない
    人というのは別と考えるケース

Javascriptは、セキュリティの面やブラウザの安定性の面、ポップアッ
プ防止など様々な理由で動作を禁止に設定しているというユーザーは結
構いるのではないでしょうか。それでもこのページではどうしても従来
通りFlashを再生しなければならないというケースはあるもので、
<noscript></noscript>内にも<object>タグなどで書かれたFlash再生用
のタグを埋め込む方法が考えられます。

この場合、Javascriptをオフにしている人にはアラートが出てしまいま
すが、Flashプレイヤーが入っている環境ではどの環境でも今まで通り再
生できるという利点があります。
また、このケースでは<noscript></noscript>内用に新しく何かを作る必
要がなく、サイトにすぐ導入できるというメリットもあります。


 -- Javascriptをオフにしていたり、Javascriptが動作しない環境の人は、
    Flashも再生できない又はしてほしくないと考えるケース

アクセスする様々な環境を考えてみると、Javascriptが動作しないよう
な環境では当然Flashも動作しないもしくは禁止されていることが多いの
ではないでしょうか。また、意図的に禁止にしている場合は、Flashに対
してもあまり快く思っていないと想定することもできます。

Javascriptが動かない環境からアクセスするユーザーをそう想定すると、
<noscript></noscript>内のFlashが本来置かれる場所には代替のイメー
ジを置くという方法が考えられます。この方法は、Flashをインターフェ
イスとしてではなくアニメーションイメージとして使っているような場
合に有効ではないでしょうか。


 -- Flashの再生に今回の対策を使うとJavascriptが不可欠になると判断
    し、Javascriptオンにしてもらうよう促すケース

サイト内でFlashとJavascriptを両方使っているようなケースでは、今回
の対策を使うとJavascriptが不可欠になってます。というわけで、Flash
再生の簡易的な判定にJavascriptが動作するかしないかという要素を使う
ようにするといいかもしれません。<noscript></noscript>内にはJavascriptの
オンやプラグインのインストールを促すメッセージなどを書いておきます。
Flashの代替イメージをFlashと同じ大きさで作り、そこにそれらのメッ
セージを表示させるようにするというのも良いでしょう。ただ、サイト
に複数Flashコンテンツがある場合にこの方法をとると手間がかなりかか
ります。

加えて各Flashコンテンツがあるページごとに、ユーザーのFlashプレイ
ヤー有無によるページ振り分けを行っていければ親切だと思いますが、
実際は難しいかもしれません。



 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +05 リーダーズブース
       ￣￣￣￣￣￣￣￣

((！))
Design Wedgeというメディアをもっと有効に使ってみようと思い、リー
ダーズブースというものを作ってみました。プロジェクトやコラボレー
ションの発表・募集、イベント告知の場としてお使い下さい。

情報掲載の詳細はメールにてお問い合わせ下さい。

  ↓
 mailto:designwedge@karadesign.com



 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +06 Design Wedgeよりお知らせ
       ￣￣￣￣￣￣￣￣￣￣￣￣

((！)) 

Design WedgeのRSSを作りました。Design Wedgeはメールマガジンなので、
ニュースの一覧というよりはバックナンバーの参照用にと思って公開し
ます。

 " Design Wedge | RSS "
 ( http://www.karadesign.com/designwedge/dwrss.xml )

 - - -

ハニーモジュールでは、ウェブアプリケーションのデザインに焦点を置
いたメーリングリストを開設しました。概要を読んで参加してみてくだ
さい。

 " Design Wedge | WAD_ML参加申し込みページ "
 ( http://www.karadesign.com/designwedge/wad_ml.shtml )

 - - -

Design Wedge月２回発行のご案内です。
現在１１日と２６日の発行を予定しています。１１日発行予定号では
サイトデザインのレポートとモバイルデザイン関連＋α、２６日発行予
定号ではニューストピックとウェブアプリケーション関連のデザイン＋
αという感じになっています。

ウェブデザインの探求を目的に始まったDesign Wedgeですが、これから
もその方針は変わりません。今後は、アドバンスドな方向に向かいつつ
も、わかりやすく伝えるということに力を入れていきたいと思います。

＋α部分では、今まで散発的にやってきたコーナーなどがはいったり、
はいらなかったりする感じになります。

 - - -

リーダーズリンク、引き続き随時募集中です。現在も募集してますんで
是非申し込んでみてください。サイト名とＵＲＬ、サイトの紹介コメン
トのみ必須です。

 " Design Wedge | リーダーズリンク "
 ( http://www.karadesign.com/designwedge/readerslink.shtml )

 - - -

制作者同士のコミュニケーションがメインとなったメーリングリストを
やってます。大きなコミュニティ形成を主としてはいませんので、クロ
ーズドな形式を採用してみてます。資格は、最低限の礼儀を守れてメー
リングリストに参加していく意志がある人としています。技術レベルな
どは問いません。

参加方法に関するお問い合わせは、登録したいメールアドレス、簡単な
自己紹介など添えまして、dwml@karadesign.com までお便りください。

 → mailto:dwml@karadesign.com

 - - -

現在Design Wedgeではヘッダー部分に掲載する広告を募集しています。
全角３５文字×７行。詳細はメールにてお問い合わせ下さい。

 → mailto:designwedge@karadesign.com



 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +07 編集後記
       ￣￣￣￣

IBMより「iモード」対応携帯電話用コンテンツ作成に特化した「ホーム
ページ・ビルダー」が発表されました。値段はなんと1，980円(税別)なの
だそうで、このごろ高額なウェブデザインソフトばかり見てきた身とし
ては優しい値段に感じます。かってMacromediaからDW/FWが18000円前後
という値段で発売された時も驚きましたが今回のもかなり驚きました。

 " IBM ニュース - Japan 2003-11-10 「iモード」対... "
 ( http://www.ibm.com/news/jp/2003/11/11101.html )


次号の発行は１１月２６日を予定しています。


＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿

D e s i g n  W e d g e

    ≫ M a g a z i n e  i n f o

   +01 発行：KaRa designstudio
       http://www.karadesign.com/
       mailto:info@karadesign.com
   +02 編集・発行人：原　一浩　[Kara_D]
       mailto:khsoul@alles.or.jp
   ---
   +03 現在の購読者数：7700人
   +04 Design Wedge公式ページ：
       http://www.karadesign.com/designwedge/
       登録・解除はもちろんのことバックナンバーも見ることが出来
       ます。
   ---
   +05 お便りはこちら：
       mailto:designwedge@karadesign.com
       感想・情報提供・お問い合わせなどはこちらまで。お便り待っ
       てます。
   ---
   +06 配信：
           + まぐまぐ
             ( post  ->  magmag )    id:0000005412
             ( http://www.mag2.com/ )
           + Pubzine
             ( post  ->  pubzine )   id:225
             ( http://www.pubzine.com/ )
           + melma!
             ( post  ->  melma! )    id:m00103069
             ( http://www.melma.com/ )
           + カプライト
             ( post  ->  kapu )      id:8588
             ( http://www.pubzine.com/ )
   ---
   +07 コピーライト（著作権）：
       Copyright(c)，1998-2003  KaRa designstudio
       許可無く転載することを禁じます。参照としてのバックナンバー
       へのリンクや引用は自由です。

 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   +99 スタジオ１×１行プチニュース

       " もう幾つかの配信システムをつかうかも知れません "
       ( http://www.karadesign.com/designwedge/subscribe.shtml )

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━