「Web Directions East 2008」カンファレンス レポート
#2 ダン・セダーホルム氏『Bulletproof A-Z─あらゆるデバイスに対応できるウェブデザインの考え方』
「Web Directions East 2008」のカンファレンス,2番目のトラックでは,Dan Cederholm(ダン・セダーホルム)氏による,『Bulletproof A-Z─あらゆるデバイスに対応できるウェブデザインの考え方』と題した講演が行われた。
ダン氏は「Craftsmanship in implementation」と力強く語る。「デザインも,職人による手作業である。家具で例えてみよう。家具の取っ手の重要性は,使ってみなければわからないだろう。Webもそうだ。使ってみなければ,その重要性に気づくことはない」と述べた。
そして,ダン氏は自身が制作した「Iced or Hot.com」の制作事例を元に,単純な作業で複雑な構造が必要ない柔軟性に富んだサンプルをAtoUで紹介した。
以下に,その一部を紹介するので,参考にしてほしい。
- A:ANCHOR LINKS WITH META INFORMATION
-
メタ情報入りアンカーリンク(データに関してのデータ)をfloatを使って左右に重ならないように配置することで、リスト式ナビゲーションは全ての行が選択できる。
- B:BORDER-RADIUS
-
CSS3で実装されている角丸。これらのデザインが要求される場合には、それぞれのブラウザにあった処理を施す。これらの処理はCSSを分けて記述することで可読性を向上できる。
- C:COLOR TRANSPARENCY WITH RGBa
-
ある要素を透過する場合には,opacityプロパティよりもbackground-colorをRGBaで記述するのが有効だろう。IEなど透過そのものがサポートされていないブラウザでは,ベタの背景色を指定し,要素そのものをユーザーが視認できない状況を回避しなければならない。
- D:DO WEBSITES NEED TO LOOK EXACTLY THE SAME IN EVERY BROWSER?
-
「Webサイトはすべてのブラウザにおいてまったく同じように表示されなければならないのか?」。この恒久的に制作者を悩まし続ける疑問に,「No」と明確に答えた。「Sundance Film Festival 2008(※すでに2009年バージョンのデザインになっている)」や「Foamee」を例にあげて,「可読性に影響しない範囲で,重要な要素でない場合は,それがある種のブラウザで表示されなくても構わない。変にマークアップを使うよりはずっといい」と述べた。
「Web Directions East 2008」カンファレンス レポート
- #6 マイク・ミジャースキー氏『Visualization A Web Of Data─Web上における情報データの可視化』
- #5 ダグ・シェパーズ氏『Standards based graphics in the browser─Web標準的ブラウザのグラフィックのススメ』
- #4 アンディ・バド氏『Guerilla Userbility Testing─高効率・低コストで行うユーザビリティテストの仕組み』
- #3 ジェレミー・キース氏『Bulletproof─使い勝手と見やすさを両立するAjaxを使ったサイト設計』
- #2 ダン・セダーホルム氏『Bulletproof A-Z─あらゆるデバイスに対応できるウェブデザインの考え方』
- #1 エリック・メイヤー氏『State of the web─ブラウザの多様化でみる最良のウェブ開発』
- 2009年12月第3週号 1位は,CSS3を使うことで,より素晴らしく,より短時間にデザインされた実践的テクニック,気になるネタは,バイドゥ,日本語入力システム「BaiduType」公開
- 2009年12月第2週号 1位は,ミニマルなWebレイアウトを作るために必要なこと,気になるネタは,絶対に覚えたい iPhone+Google音声検索・10の技
- 2009年12月第1週号 1位は,RGBAカラーの使い方,気になるネタは,思いどおりの日本語入力 - Google 日本語入力
- 2009年11月第4週号 1位は,CSS3の新機能をデザインに活かす方法,気になるネタは,THE NORTH FACE タッチパネル対応のグローブを発売中
- 2009年11月第1週号 1位は,今どきのCSSレイアウトの特徴,気になるネタは,日本版Twitter,「つぶやき」から「ツイート」に



