今後WDE09の概要が明らかに!
乞うご期待を!
]]>このプレゼンで、ブラウザごとの見栄えの差異と、彼が最近はじめた新しいワークフローの試みについて詳しく説明しています。
公式アナウンス
http://www.vivabit.com/viva
これで、North, South, East, Westの全てがそろった事を嬉しくおもいます。また、同時にWeb Directionsではさらなるカンファレンスとして東南アジア地域での開催も計画しております。
今後ともWeb Directions Eastを含めて、皆様のご愛顧を頂けますと幸いです。
Web Directions East事務局
]]>Web Directions East事務局
]]>その点、CSS3も自分の範疇を超えてる事が多く似ています。実践的な使い方がわからず便利さが分からない事もしばしば。自分の中ではCSS3のtransformは特にそんな感じでした。
でも、ClearleftのNatalieがみせてくれたtransformの実装方法は、非常に実践的で素晴らしいものです。ポケットリファレンスを印刷時はCSS3のtransformを利用し90度回転させるというもの。元はBrian Sudaの発想みたいです。
非常に賢いですね。
/* rotated left */
#page1,
#page8,
#page7,
#page6 {
-webkit-transform: translate(64.5px, -64.5px) rotate(-90deg);
-moz-transform: translate(64.5px, -64.5px) rotate(-90deg);
transform: translate(64.5px, -64.5px) rotate(-90deg);
/*-webkit-transform:rotate(90deg) scale(0.6) skew(-23deg);*/
}
下記の図はスクリーンショットです。
リンク先:http://tools.westciv.com/
紹介されているツールはXRAY, MRI, CSS3 Gradient, text-shadow, box-shadowと便利なものばかりです。
XRAYは要素のwidth/height/positionを調べる事が出来るツールです。使い方はいたって簡単で、
使い方が詳しく掲載されています
MRIは要素にCSSを適用したい時にCSSセレクタの記述を教えてくれるツールです。もし、CSSを記述したのに適用されない時など、セレクタを確認する時に便利なツールです。
WebkitのnightlyバージョンとSafari4以上はCSSでbackground・border-image・list-style-imageへGradient(グラデーション)を適用できます。ただ如何せん記述が難しい。でも、このツールがあれば簡単にGradientを適用することができます。
Gradientにはliner(線状)とradial(円状)の二つのタイプのGradientがありますが、それぞれのバージョンがあるので自由に作成することができます。
ちなみにlinerを使えばiPhoneのUIに合わせたボタンやバーなどを簡単に作る事ができます。iPhoneのSafariはgradientをサポートしています。
CSS3ではテキストやボックスに陰をを付けることができます。しかし、慣れの問題とは考えていますが、感覚的に陰の方向や距離の具合を掴むことは非常に困難です。このツールはスライダーを調整するだけで自分の好みの陰を決定できます。そして、生成されたソースをコピー&ペーストするだけで簡単にtext-shadowやbox-shadowのCSSを記述することができます。
上記に紹介したツール以外にもドンドンとツールは追加される予定です。
楽しみですね。
]]>PDFもダウンロードすることも可能です。
現在のウェブでは、ユーザーのパソコンにインストールされたフォントのみウェブサイトで表示可能です。しかし、CSSのWeb Fontsを利用するとユーザーが未インストールのフォントでもウェブサイト上で表示可能になります。
この技術を利用すると、画像を使用せずとも見出しなどを作成可能になります。更には、ユーザーはテキストを自由にコピー&ペーストしたり、制作者は自由にテキストを修正/変更可能になる便利な技術です。
ただし、今迄は殆どのフォントがライセンスの問題に阻まれ自由に利用できません。無料フォントでさえも実はライセンスの問題に阻まれ利用/再配布ができませんでした。
Type-kitはこの問題に関して,Type-kitユーザーはType-kitのフォントライブラリーにアクセスし自分の使いたいフォントを選択しType-kitへ連絡(恐らく至極簡易な方法)するだけです。
後はJavaScriptを<head>に書き加えると無料フォントのみならず、商業用フォントも利用可能とのことです。フォントライブラリーについては様々な団体や企業と交渉中とのことです。どんなフォントが利用が可能になるか楽しみです。
IEはW3Cの標準とは異なりIE4の頃からEOT形式のWeb Fontsをサポートしています。これに対して、WEFTを使いEOTファイルを作成する必要があるかは分かりませんが、smoothes out differences in how browsers handle typeとあるので何とか、IEにもType-kitは対応するものと思われます。
日本語はアルファベットに比べ、桁違いに文字数は多くファイルサイズも大きくなります。実際、『超実践HTML5&CSS3』のページを作成した当初はFontin Sansフォントに比べて日本語フォントは10倍のサイズでした。コレに対しWeb Directionsは常用漢字のサブセットを作成し、
タイトルのみへ適用することでローディングの時間を短縮するように勤めました。
正式なデビューは今夏です。現在は先行登録のみ受け付けています。当初はアルファベットのみ成る予定ですが、日本語もサポートされるように働きかけたいと思います。
個人的な見解ですが、ユーザーが情報にアクセスできれば見栄えが異なっても自分はいいと考えています。ウェブにアクセスできるデバイスは段々と増えている中でデザインを統一し全てのユーザーへ同じデザインを提供できるか疑問です。
さて、本題ですが新たにウェブにアクセス可能なデバイスが1つ増えました。『カーナビゲーション』です。今迄もトヨタや日産、ホンダなどインターネットを介して情報通信するシステムはありました。ただ、今度この『カーナビゲーション』が搭載される新BMWの7シリーズはインターネットへアクセスが完全可能です。Googleやtwitterにアクセスも可能です。また、コピー&ペーストもできるのでメールに送られた住所をコピーしてナビゲーションシステムに入力し、その住所へのルート探索もできます。ちなみに操作はiDriveというsonyのロータリースイッチ(アルプス電機製)似た機構を利用します。
このナビゲーションシステムは、今年、7シリーズを始めとしてヨーロッパと米国でファクトリーオプション(日本でいう工場出荷オプション)で搭載可能になるようです。通信の仕組みは次世代の今年2009年からサービス提供されるEDGE (Enhanced Data Rates for Global Evolution)を使います。
このサービスは今後、欧州と米国で急速に広がると考えています。理由は2つ、1つ目は欧州は既にインフラが整っている事、米国も AT&Tワイヤレスがインフラ整備してること。2つ目は欧州や米国の車社会では、より車中に滞在する時間が長くユーザーのニーズが 必然的に高いことが理由です。
また安全の為、3mph(時速約5km)以上で運転席はサービスが利用できません。ただし後部座席は3mphを超えてもサービスを利用可能です。
一方でBMWのライバルであるMercedes Benz, Audiなどのメーカーは現在のところ、このサービスを提供する予定はないそうです。理由は顧客が興味を示さないから。逆にマーケティング的にはBMWの購買層はインターネットを利用する時間は長い若いCEOが多いと考えられており必然なのかもしれません。
さて、ウェブは依然として、その利用可能デバイスを広げており、カーナビゲーションのように左ハンドル、右ハンドルの違いがあり、運転者の位置が国の法規により変わったり(日本の場合、ディーラーで左右両方が選択可能)、信号待ちの僅かな時間に慌てて利用したり、昼と夜で室内の環境が変化します。
では果たしてデスクトップと同じデザインを、このような環境とデバイスに提供が可能でしょうか?また、するべきでしょうか?BMW7シリーズ左ハンドルのナビゲーションを想像して、デスクトップ使用にもカーナビゲーション使用でも耐えうるデザインカンプを描くウェブデザイナーがいるでしょうか?(ある意味Googleのデザインはそういった意味では非常にフレキシブル)
そろそろデバイスや環境、ユーザー(クライアントではない)を考えて本当にウェブを作る時代がきているのかもしれません。
参考記事
http://www.autoweek.com/apps/pbcs.dll/article?AID=/20080505/FREE/727416159/1530/FREE
の以上豪華6名を交えて行われました。
パネラーの方々はさすがと言わせる鋭い視点とウィットをどなたもお持ちでした。アドビ システムズの太田氏は、同じくアドビ システムズの轟氏と掛け合いをしながらと、御陰様で会場からは時々笑いも聞こえるなど皆さん、楽しんでいただけたようです。
さいごに『Stage of the web09』にご来場をいただきました方々ありがとうございました。また、パネラー方々、アップルストアの方々、お疲れさまでした。
世界のWeb開発者動向をWeb Directionsが世界1200名に対し、行った調査を元に講演。
ただ調査結果を眺めてみても分からないことが、この講演で内容の輪郭をつかむことできたと考えています。たしかに海外と日本語の言語の違いはあるのですが、逆に日本の開発者だけ同じブラウザやOSを使って開発を行うのに全く別の方向へ進むことはないと考えますので、1つの参考としていいんではないでしょうか。
]]>Webkit Surfin’Safari(グラディエントについての記事)
http://webkit.org/blog/175/introducing-css-gradients/
Opera SVG (SVGについての記事)
http://virtuelvis.com/archives/css3/index
http://virtuelvis.com/download/2007/09/kestrel/itunestable/
そこで、Web DirectionsのJohn Allsoppが作成したツールがこれです。
上から『Start』『End』『Stops』ボックスが並んでいる。その中で『Start』と『End』はグラデーション色、Horizontal Position=水平位置、Vertical Position=”垂直位置”をそれぞれ指定することができます。
一番最後の『Stops』は途中で色を追加するものと考えると分かりやすい。色をグラデーションの途中で追加することができる。
今後はradial(放射状)のgradientを実装するとJohnと言っていましたので、後ほど実装されると思います。
]]>http://south09.webdirections.org/
今年のWDSはビジネストラックがお目見え、そしてスピーカーとして元GE, 元CITI,元P&GのDeborah Schultzが企業のソーシャルメディアについて講演。また例年と同じデザイントラックでもグリッドレイアウトで有名なMark Boultonがwebfontなど今年注目の技術について講演。
http://south09.webdirections.org/program/speaker
合計 63,520円
もし実際に渡航するのであればこれに、他に雑費やお土産代などがかかるので、30,000円ぐらい余分に予算に必要。おそらく合計で10万もあればOK。
]]>以前に公開した資料を再度『State of the web09』のご紹介しますので、必要の方はご自由にお使い下さい。
近日、『State of the web』のプレゼン/パネルの内容をレポートします!
]]>日々、Webの動向は目まぐるしく変化しています。
『State of the web』では世界中の1200名を超える開発者におこなった調査より、世界の開発者の動向を分析します。
など、疑問をお持ちの方は是非ともご来場を!
『State of the web09』(大阪)
場所:アップルストア心斎橋
時間:5月19日(火)19:00 - 20:30
URL:http://www.apple.com/jp/retail/shinsaibashi/
定員:40名(それ以上は立ち見)
特典:50名に1名へWDE09カンファレンスチケットが当たります。
さて、そのプロモーションの一貫としてWDEメンバーのOli Studholm氏がこのたびVideo Castのmessa.tvに出演し、Web Directinos Eastについての魅力について語っています。
Oli氏が参加しているmessa.tvは大阪の株式会社 messalibertyさんのVideo Podcastです。世界中の情報を集めて動画で色々と紹介してくれています!
『state of the web』に是非とも
]]>
早割価格は36,750円(税込)、定価42,000円(税込)より5000円も割引きしております。
現在の参加状況は東京会場が残り5名、京都会場が残り2名となりました。京都会場にて参加を検討されている方はお早めにお申込みを!
また、正式にアナウンスはしませんでしたが5月3日にワークショップ募集ページをHTML5へ変更しました。またCSS3もwebfont,transform,transition,border-radius,multi-columnを実装、microformatsも実装しました。作業中にプロジェクトメンバーのOli Studholm氏がw3cのバリデータ、webkitのバグも発見しリポートをしました。<br />またHTML5ワーキンググループのIan Hickson氏よりHTMLのマークアップは元より、figure要素など実際に教授をいただきました。その他、MozillaのJohn Dagguet氏よりWEFTに変わるツールも提供いただきました。HTML5CSS3の実装作業で得られたFeedback、成果は全ての今回のワークショップの内容へフィードバックする予定としています。
microformatsも実装しましたが FirefoxのOperatorにてエラーを確認しています。ただし、開発者へのリポートも終了しております。
このワークショップを開催するにあたって、内容のCSS3とHTML5について恐らく早すぎると感じる方もいるでしょう。ブラウザの実装、特にIEの実装が進んでおらず早すぎると感じると思います。ただ、Jeffrey Zeldman が主催する『An Event Apart』、Clearleftの『UX London』、Appleの『Safari4』(注01)など、それぞれの先進性からHTML5の実装を選択しています。
Web DirectionsでもHTML5に対し、何らかの取り組みを行いたいと思い、『超実践CSS3 & HTML5』ワークショップを5月16日、17日に開催することとしました。
CSS3については、昨年の6月に『CSS Reloaded』を開催し、当時はCSS3に対して否定的な意見を述べる方もおりましたが、現在はその様な意見の方もCSS3について各地でプレゼンをされるなどCSS3への理解が非常に深まってきました。
このような中、Web Directions EastではCSS3について、今年はCSS3のデモではなく実際のウェブサイトにてCSS3を使うテクニックを学びたいと思います。transfromプロパティをUXを損なうことなく利用する。text-shadowを利用して可読性を更に向上させる等。
HTML5については、世界的に現在点で制作者向けのマニュアルも作成されていない段階ということもあり、当然ながら日本でも資料は限られています。それゆえか既に
<div>=<section>というような大きな誤解も生じていますので改めて、正しくHTML5の要素について理解を深めたいと思います。HTML5の文書構造化、secionによるoutlineなどにもフォーカスを当てます。
HTML5もCSS3も先進の技術を相場師のように実装される、されないを判断するのではなく。実装されてもいいように貪欲に身につけることが必要が将来へのリスクヘッジになるでしょう。
参加ご希望の方はWeb Directions Eastより御願いいたします。
注01:Apple の『Safari4』のウェブサイトについてはHTML5文法上ミスがあります。
]]>
『The king of web standards』などと呼ばれているJeffrey Zeldman。彼が現在、無料で過去に出版した本を配布しています。
アマゾンで5つ本をゲットしている良書『Taking Your Talent to the Web』です。2001年に発売された本ですが今でも面白い本です。今週末の一冊にいかがでしょうか?
WDE twitter
始めました。様々な情報を配信しています。
全てのセッションに対して逐次通訳のご用意を予定しております。
Webが誕生間もない1992年のWeb黎明期よりWebに積極的に関わり活動。CSSの大家であるEric Meyerらと『CSS Samurai』(http://archive.webstandards.org/css/members.html)としてCSSの普及活動をおこなう。その後、Web標準の王様と称されるJeffrey Zeldmanを中心として、いまやIE8を含める全てのブラウザのベンチマークとなったAcidテストを手がけるWaSP(http://www.webstandards.org/)を設立しWeb 標準の普及活動を世界をまたにかけ行う。
現在は豪州に居を構え、Westcivの代表として、米国、豪州、日本で行われているWeb Directionsの全てを統括。昨年は著名人により記事を掲載したSCROLL Magazineを発行するなど多岐に渡り精力的に活動している。また彼自身もA List Apart, 24ways, microsoft mixなどへの有名媒体へ執筆も多数おこなっている。
また、今回は『State of the Web 2009』に続き、国内の各大手ベンダーなどから開発者を招聘し、パネルディスカッションを開催します。
Webが誕生間もない1992年のWeb黎明期よりWebに積極的に関わり活動。CSSの大家であるEric Meyerらと『CSS Samurai』(http://archive.webstandards.org/css/members.html)としてCSSの普及活動をおこなう。その後、Web標準の王様と称されるJeffrey Zeldmanを中心として、いまやIE8を含める全てのブラウザのベンチマークとなったAcidテストを手がけるWaSP(http://www.webstandards.org/)を設立しWeb 標準の普及活動を世界をまたにかけ行う。
現在は豪州に居を構え、Westcivの代表として、米国、豪州、日本で行われているWeb Directionsの全てを統括。昨年は著名人により記事を掲載したSCROLL Magazineを発行するなど多岐に渡り精力的に活動している。また彼自身もA List Apart, 24ways, microsoft mixなどへの有名媒体へ執筆も多数おこなっている。
『State of the Web 2009』のもう1つの醍醐味は各ウェブベンダーによるパネルディスカッションです。HTML5, CSS3, Geo Location APIなど急進するブラウザの新技術の実装。それらを実装しているブラウザなどのベンダーはどのような方向へ進んでいるのか?HTML5の実装はどうなるのか?CSS3は?そんな疑問のヒントが、このパネルディスカッション隠されてるやもしれません。
パネラーは順次決まり次第ご案内いたします。
全てのセッションに対して逐次通訳のご用意を予定しております。
]]>