数日前の話になりますが、Opera Japan にて社員向けのパネルディスカッションが開催され、スピーカーとして招待されました。林 信行さん、ミツエーリンクスの木達さんに並んで一緒に話すことが出来て恐縮でしたが、こんな機会はまずないので楽しんで参りました。Opera が示すことが出来る日本のプレゼンスに関するディスカッションもありましたが、Opera というひとつのブラウザに捕われない大きな話もありました。 HTML5 がこれからWebアプリケーションにどのような影響を及ぼすのか、そして使える環境が整えられ始めている現在においてデザイナーや開発者はどのような姿勢をとっているかといった話は多くの時間を費やしました。ジャーナリストから見た視点、大規模の Web サイト制作会社の視点、そしてひとりの Web デザイナーの視点がそれぞれあり、興味深い展開でした。どの視点をとっても「なぜ」HTML5 や CSS3 を使うのかではなく「いつ」「どのように」のほうが課題という印象がしました。Progressive Enhancement の意識調査と共通していえることですが、作る側が重要性を理解していても、クライアントや利用者に対しての提案の仕方が模索されきれていないのが現状です。このあたりがクリアになることで導入サイトの増え方も変わってくるでしょうね。 また、技術視点での提案ではなく利用者視点の提案も必要です。DHTML や Ajax が流行った時期もそうでしたが、無闇に技術が使われたサイトはたくさん登場しました。これはきっと HTML5 だけでなく @font-face でも同じようなことが起こると思います。多くのサイトが『間違い』をすることで結果的に他のサイトが洗練されてくわけですが、デザイナーとして技術視点ではない良い提案が出来ると良いなと思っています。 Opera というブランドに捕われないで自由な Web 話をするのは楽しいですが、ディスカッション中に「Opera はノルウェー的な部分があるのか？」という質問を投げてみました。Safari や Chrome はアメリカを象徴しているわけではありませんが、開発している会社を象徴しているソフトウェアになっていると思います。同様に Opera も企業の性格やノルウェー的な部分があるのかなとふと思いました。ノルウェーの方だけでなく、スウェーデンの方や他のヨーロッパ諸国の方もいたので見解を聞くには良い機会かなと。 ひとつ出て来た返答の中で興味深かったのが、Opera はヨーロッパ的な部分があるかもしれないという意見でした。すべてのヨーロッパ人にいえるわけではありませんが、多くの人は原則、信条、倫理的な部分を何よりも重んじるとのことでした。確かに Opera はオープンフォーマットのサポートを強調している印象がありますし、オープン Web の思想と直結している機能が多いですね。強い姿勢が時に様々な機能を他のブラウザよりいち早く導入する要因になっていると思いますし、逆にシェアが増えない理由になっているのかもしれません。 もちろん、文化や思想ですべてを語ることが出来ませんが、Web という範囲に限定して語ることは難しいことが多いと思います。ブラウザもそうですし、Web デザインでも言えることです。 英語でのディスカッションだったので少し大変でしたが、あっという間に時間が過ぎてしまいましたね。社外から人を招待してディスカッションが出来る Opera Japan はスゴいなと思いましたし、こうした機会を与えてくださったことに感謝しています。現在を踏まえた未来を語るのは楽しいですね。

このエントリーは「質問: ウェブサイトの見た目は同じにしなければならないか？」の続きにあたります。 やっと明日に結果レポートを出せる状態になったので、まずは Twitter 経由でいただいたウェブサイトの見た目や Progressive Enhancement に関する意見をまとめて紹介します。アンケートだけでなく、こうして意見まで送っていただき感謝しています。140文字内でこれだけの情報を詰め込めるのかと関心してしまう意見も多数です。 Progressive Enhancement を簡単に説明すると「ブラウザに応じて最適だと考えられるインタラクションと見た目を提供する」になるかと思います。ただ、この説明文だけ読むとブラウザによって異なるデザイン／レイアウトを作らなければならないという印象を与えかねません。実際はそうではなく、新しいブラウザで見ると text-shadow を利用して可読性を少し上げているといった小さなことでも Progressive Enhancement に該当します。もちろん、その『小さな違い』を小さいと見なすかどうかは個人によって判断基準が異なりますが、CSS と Progressive Enhancement は相性が良いですし、元々それが CSS を使うメリットだと思います。実は CSS を利用してレイアウトをし、デザインをしているということは、Progressive Enhancement なんですけどね。度合いにもよりますが。 今回いただいたメッセージを基に議論してみたいものです。とりあえずポッドキャストあたりかな。 likealunatic 以前yhassyさんがエントリーでおっしゃっていたことに概ね同意しており、全ての環境で同じ見た目にすることは不可能であり、妥協点を探す作業が必要だと常々感じています。 d4r 「どこまでを同じ見た目と考えるか？」を議論してみたいです。例えばユーザーテストして、違いに気付かない範囲がある程度定量化できるなら、クライアントの説得にも有効な気が。 d4r そもそも、みんなどのレベルでチェックしてるんですかね？各ブラウザでキャプチャ取って重ね合わせて差分取るくらいまでしないと「同じ見た目」って言えないのでは？（屁理屈） likealunatic 不可能とか無理とか言ってしまうとネガティブですねｗ でも逆に、環境や設定によって違う見た目にできることは利点でもあると思ったり aratakojima Webサイトの見た目の話で疑問なのは、1.その実装コストを誰が負担するのか、2.あらゆるサイトに当てはまるか、3.ブラウザによってデザイン変えることによるユザビテストなどのコストが余計にかからないか、などを疑問に思っています。 tinybeans ユーザーが使用しているディスプレイも違うし、ユーザーがブラウザごとに見比べる可能性はゼロに近いと思うので、全く同じ見た目になる必要はないと思います。要素の位置関係さえほぼ同じになれば良いかと。 commonstyle 「見た目を同じにできます」をセールスポイントにしている業者さんもいますし、クライアントの態度変容を何度も目撃していますが、新しい技術を取り入れていこうという現場では「見た目統一」はあまり問題になりません。最初からProgressive Enhancementです tomix 理想の見せ方があるのなら、まだそれを追求すべき時期だから。しかし、見せ方もコンテンツの一部だということをわすれちゃだめだ。コンテンツと見せ方がそんなに簡単に分離できるものじゃないはず。見せ方が変わればコンテクストが変わるから koba CSS3を利用して見た目をリッチにすることは、より多くのユーザーをゴールに繋げたり、リッチな体験を提供するためだと思います。であれば、IE6ユーザーなんかにもその見た目を提供した方が、サイト的にグッドな気がします。 ism01saka 学術調査のためのアンケートサイトをよく作るのですが、そういう時は見た目の違いが回答に影響を与えることがあるり、見た目や機能が一緒になるようにします。そういう特殊な目的がなければ、ユーザーさんの使用するそれぞれの環境の中で最高の体験ができるように配慮したいです。 gaku 印刷業界からが色濃くでてしまった過去の背景が、日本の場合悪い影響として現在も引き継がれちゃってますよね。私は賛成派です。 necoze 個人的な経験からだと、企業の利益やコスト削減に結びつくか、同業種の他サイトでやっているかどうか、…がポイントかなと。 saburicom IE6だけ「For #$%^&'s sake, Upgrade man!!」って変化させたいけど、クライアント的には同じ内容をIE6だと載せないと今は説得できないね。無理。 kamiokan_de 既にコーダーも多大なコストを払っているのですが、PEではより多くの職域の人間のリソースを必要とするので、理想だけど難しいのでは、というのが現時点の解答です。ちなみにアンケートも回答させてもらいました。 kamiokan_de それに対してクライアントが目くじら立てることもそれほどない。どちらかと言えばクライアントの要件よりも、社内的な要件としてのリソースが問題になると思ってます。数パターンのUI管理、分析、検証の無限サイクル。 Takazudo Progressive Enhancementを積極的に仕事で取り入れたことはないのですが、JavaScriptでアニメーションをつける時など、複雑になると、IEでのみ動作が重くなる場合があったので、その場合は分岐してアニメーション無しにするなどはありました Takazudo Progressive Enhancementというわけではないのですが、管理画面などでは、一般的に言うブラウザシェアは無視できるケースが多いので、そういった場所でどんどん新しいことはできるのかなぁと思ってます taz8 数年前ぐらいまでは、Webサイトの見た目はできるだけ同じであるべきだと考えていましたが、最近は、そうでもなくなっています。主観的で微妙な言い方で恐縮ですが、コンテンツ自体がぶれないレベルで近似値的に近い印象があれば、OKという認識でおります。 thayashi Progressive Enhancementはローンチ直後はいいのですが、やりすぎるとその後の運用のメンテが煩雑になるのではという懸念がありますね。

Dreamweaverは、たくさんのウェブサイト制作者が愛用しているソフトウェア。毎回バージョンが上がる度に目まぐるしい発展を遂げていますし、新しいバージョンのCSを買おうと思うひとつの要因になるキーソフトだと思います。私個人は Dreamweaver を使用していませんが、それでも使うメリットを感じますし、Dreamweaver ならではの良いソリューションも少なくありません。特に印刷向けのデザイナーがスムーズにWebに向けたデザインが出来るようにした功績は素晴らしいです。ウェブサイトを制作するのにかかせない存在ではありますが、同時に改善点も少なくありません。それは「Dreamweaver」というソフトウェアの存在そのものの見直しだと感じています。 2,3バージョンくらい前からですが、わざわざ Creative Suite というバンドルの中のひとつに Dreamweaver が必要なのか疑問を感じます。「もう新しい CS が出た！」という声は新バージョンが出る度にありますが、それでも1年半か2年のブランクがあります。Photoshop や Illustrator のようなソフトであれば、そのブランクは大きなものではありません。しかし、ウェブで1年といえば相当のブランクではないでしょうか。ブラウザの状況も変わりますし、CSS や JavaScript で使える表現も進化しています。この Web のスピード感に Dreamweaver がついて行けてない気がします。事実、今頃？という機能やサポートが新版にやっと実装されていることもあれば、未実装なものも少なくありません。 つまり、CS というリリースサイクルが Dreamweaver にとって足かせになっているような気がします。 また、ウェブの姿が Drewamweaver が登場した当初から大きく変化しているのも存在が問われるひとつの理由です。ウェブ『ページ』を制作することを得意とする Dreamweaver では、サイト制作すべてをカバーしきれないのも課題です。ダイナミックページの生成も出来ますし、テンプレートを使えば効率よくページを作ることは出来ます。しかし、アプリケーション開発には向いていませんし、ページという概念を超えた制作になるとエディタを使うほうが無難になることもあります (アプリケーションはFlexで作りましょうということかもしれませんが)。 Dreamweaverを使わない理由は人それぞれだと思いますが、私が使わない理由は今のウェブとのミスマッチからくる違和感です。 Dreamweaverのサービス化 Adobeは正式版のソフトウェアをリリースした後、数回のパッチをリリースしていますが、小さなバグフィックスがほとんどで、機能は次のリリースまで先送りになる場合があります。CSのリリースを軸にした機能追加ではなく、ウェブのスピードに合わせたリリースサイクルは可能にならないのでしょうか。バグフィックのためのパッチだけではなく、小さな機能追加もパッチに盛り込むことが出来るサイクルであれば、常に新しい Dreamwaver を体験出来ます。 ソフトウェア全体のテストではなく、新しい機能を追加する度にテストを繰り返すのもメリットがあります。プライベートβとオープン版と両方ありますが、オープン版のβがパッチのリリース前に毎回公開されることで、利用者の声を反映しやすくなるだけでなく、高い頻度でウェブ上で話題になるという別効果もあります。 イニシャルは低コストで年会費を支払っている間はパッチを無料でダウンロード出来るという別の料金モデルも考えられます。CSのタイミングではなく、Dreamweaver が考えるタイミングでメジャーリリースか、パッチで済ませれるのかを判断出来るとウェブのスピードに合わせやすいと思います。ソフトウェアだけど、ウェブアプリケーションのように扱った開発モデルのほうが Dreamwaver に合うのではないでしょうか。 サードパーティとの連携 すべてを Dreamweaver でカバー出来ないのは当然なので、Adobe では、Exchange で、サードパーティのアドオンソフトの掲載をしていますし、Extensionsも独自コミュニティが存在しています。サードパーティへのリーチもされていますし、開発環境が整ってはいますが、ユーザーとの距離はまだあると思います。 例えば BridgeやExtension Managerが、サードパーティのソフトをダウンロード購入出来る App Store のような役割をもっていたら、より距離は縮まると思います。「この CMS を使って制作するなら、この組み合わせ」といった Dreamweaver Bundle というのもあると便利かもしれません。 自分の環境をクラウド化 従来、デスクトップアプリケーションだったものが、ウェブブラウザだけあればいつでも使えるようになってきました。では、Dreamweaver もウェブアプリケーションになるのかといったら一概にそれがベストではないでしょう。ただし、設定や使っている Extensions が、オンラインで同期することが出来ると、複数のパソコンにおいて同じ環境で仕事もしやすくなりますし、再インストール後のリストアも楽そうです。ある程度ウェブで出来ること（もしくは得意なこと）は、ウェブにまかせてしまうのもひとつの形だと思います。 ウェブはこれからも目まぐるしく変化していくと思いますが、Drewamweaver というソフトが今後どのように姿を変えて行くのか期待しています。

前回に引き続き、いろいろな方が使っているサイト制作ソフトの紹介です。 以前、制作ソフトに関して神森さんと話したことがあります。制作ソフトそのものの使い方を習得することも重要ですが、実は OS の特徴をいかに把握して活用するかが制作ソフトの使い勝手に大きな影響を及ぼします。テキストをダブルクリック、トリプルクリックしたときにどのような挙動が起こるのか、コピーしたデータがどのようにクリップボードに保管されるのか、他のアプリとの組み合わせで相乗効果があるのか・・・といったことを知っていると知っていないとでは大きな違いです。 自分が使っているソフトを支えている技術や別のソフトを改めて見つめ直すことで、自分の『武器』がさらに手に馴染むと思いますよ。 ブックマークに使用している制作ソフトを書いている方もいらっしゃいますね。他にもあればぜひ @yhassy でコメントよろしくお願いします。 wooyan Crescent Eveというエディタを使っています。軽さと程よい補完機能が便利ですね。それと編集中のファイル内を調べて入力支援してくれるところが最高です！ Kazabana やっぱりDWが多いですね。WPテンプレート編集するのに使ってますが、WPタグを扱うのがちょっとアレです。 floral DreamWeaver,CSSSEdit,SKEdit,Jedi X。JChecker Xは、コードや全角・半角チェックをしてくれるので重宝するっす versionfive Mac買ってからずっとskEditです．軽い上にローカルとリモートの同期も簡単にできるとこがいいっす hatto 最近はほとんどEmEditorかな。昔はDreamweaverだったけど今の環境に合わないのとCSSはじめたあたりから。 thayashi DWとEmEditorです。DWはコード補完があるので使っている感じです。JSもいっしょに書くときはAptanaでやることも増えてきました。Aptanaのコード補完もなかなかよく出来ています。 trico_lour 僕はWinではDreamweaver、家のMacではCodaですね。某所でとある外国の方が使いこなしていたTextMateもちょこっと気になってます。 hiloki Eclipse+AptanaStudio です。社内のphp開発でEclipseが使われているので業務の連携上。AptanaもそれなりにDW的な機能も備えてますし、リソースの検索が便利なので起動時の重さ以外は特に不満無しです。 aknk DWCS3+CSSEdit。DWは挟み込スニペットを設定し、主要タグ・スニペットにキーボードショートカットを割当て、コード画面で作業。width,height,alt,th等はコード画面を見つつビジュアルUI側から作業。書く手間をとにかく減らしたいので。

エディタは何度か放浪しながら、そのときのワークフローに合ったものを使っています。今でもメインは相変わらず skEdit ですが、サイト管理の機能がとても良い Coda も併用しています。Coda はまだまだエディタとしては物足りないですが、バージョンが上がる度に良くなってきていますし、1.6.1 に導入された プラグイン でどれだけ多くの開発者の協力を得ることが出来るのかが今後の鍵でしょう。 また、CSSEdit を開発している MacRabbit が Expresso という本格的なエディタを開発しているのも見逃せません。こちらも Sugars という拡張機能が備わっており、カスタマイズ性も高いです。 そんなにエディタ変えてコーディング面倒そうと感じる方もいるかもしれませんが、コードのスニペッツの多くは TextExpander に格納しています。仕事とは関係ないですが、ブログでレビューを書く際も、ショートカットで hReview のテンプレートを書き出しています。アプリケーションに依存することなく自由にコードを呼び出せるので重宝しますね。 いろいろチョイスが増えている近年ですが、他の方はどのソフトを使っているのか気になりますし、理由も知りたいですよね。そこで Twitter を使って「使っているサイト制作 (主にコーディング) ソフトって何ですか？」と聞いてみました。140文字という制限でどういったコメントが返ってくるのか楽しみでした。 予想通り Dreamweaver が大多数でした。使い分けしなくても全部入っているのは魅力ですし、バージョンを重ねる度に洗練されている精度の高いコードヒントも人気の秘密なのかもしれません。ただ、同じ Dreamweaver でも使っている理由はそれぞれ違うのが興味深いです。全体的な印象としては、高機能をとるか、軽さをとるか、もしくはその２つのバランスをとるかの3種類かなと。 いろいろな方の視点が気になるので、ぜひ @yhassy でコメントよろしくお願いします。 risay HTML/CSS/サイト管理ならDreamweaver。何かが優れていると言うより癖や拡張ポイントがわかるまで使い続けられたから kiryushiki 自宅では，EmEditor Free(6.00.4)と真魚（まな）を使ってます．タブごとに開けるのと，カスタマイズがある程度利くこと，フリーソフトだから，というのが理由です． onthehead skEdit + CSSEdit。理由：は頻繁に使う操作にショートカットが割り当てられてるからー。 mimochan まだ慣れてないですがDreamweaver CS4。CS3よりも良くなっているという期待を持って使っています。 nagoya_no_naoki Jedit Xですかね。理由？慣れです。(^ ^ CSSやるときはDw. 理由、コードヒントが楽(^ ^ chibicoo html/cssならDW。たんにエディタとして使いやすいから・・。エディタとしてはたまにTeraPad ciqlie DW、たまにCodaです。DWでの制作を条件とする案件が多かったりで今はメインで使用してますー。 likealunatic Dreamweaver：サイト管理機能が秀逸だから。　GVim：キーバインドが手になじんできたから。　です！ rea Windows だと秀丸 + TeraPad、Mac だと skEdit + Coda です。理由はハンドコーディングが好きだから、かな。いわゆるオーサリングツールは使いません。 netsinweb Dreamweaverがメイン。でもコードビューのみ。ライブラリー機能を使いたいためだけ。なので、Aptana StudioとかskEdit、CSSEditも併用してます。 keis DWとエディタ（EmEditor）ですね。DWメインで修正にエディタ使うって感じです。同時に数サイト触ることが多いため、サイト管理ですぐに切り替えできることがDWをメインに使う理由です。 waiz DWとエディタ（CSSEdit・skEdit）使ってます。サイト管理するのにDWは欠かせなくなってますね。CSS書くのにはCSSEditの方が楽だと感じて使ってます。 tenkao skEdit。ですがバージョンアップ以降代わりを探し中。最近はCoda試用してます。会社ではDW 2nose 基本的にはDWです。後はPeggyPadを使っています。サクサク起動するのと、クオートの閉じをしないと強烈に画面の色が変わるので閉じ忘れがないです。 kotarok Komodo Editです。理由は、機能と軽さのバランスがいい、様々な言語に対応、XULベースでOSを問わない、オープンソース、開発元が信頼できる(Active State)、JS or Python による高い拡張性、でも最初から高機能。 digibot 大急ぎで作る場合のみwinでDW（長いこと使ってたので慣れている）、それ以外はCoda使ってます。軽いし、プレビュー楽だしコードナビゲーターやクリップ機能は便利、そして何より使ってて楽しいです。 tkstnmr エディタならskEditラブです。軽快さとオートコンプリートが良いです。 tstudio DWでっす！理由は、「愛」かな（笑）。っていうか、慣れもあるけれど、隅から隅まで知っているだけに、オペレーション技術さえ伴えば、デザインビューでの作業効率の良さは、秀逸だと思います。デザインビュー使っている人あまりいないけど。 seltzer DWです。コードヒントや画像の参照、width, height属性の補完など細かい機能が他のソフトを圧倒してます。 armytoru DWCS4。コード画面の入力補完機能。強力な検索置換。簡単な作業はGUIで。それぞれ、他のソフトにもありますが、結局、DWは統合制作環境としての強みがありますので。 ism01saka