月: 2013年2月

WebサイトやWebアプリをデザイン・開発する際にどうしても問題となってくるのがマルチデバイスへの対応です。iPhone、Androidなどスマートフォンの普及に始まり、iPad、nexus7、nexus10などタブレット端末の急速な普及も著しく、Webを取り巻く環境は急速に変化し、ワークスタイルさえも変えようとしています。その一方で、制作者としては、どのようにデザイン設計すればよいのか?、どういう特性があり、ぞういう問題点があるのか?、どこまで対応させればよいのか? など悩みは尽きません。そもそも、デバイスごとにインターフェイスを変えるべきなのか、統一するべきなのか、コンテンツ自体も変えるべきなのかという、根本的な問題も賛否両論あるところです。そこで、今回はマルチデバイス対応する際の制作上の注意点や手段などの事例やテクニックについてお届けしたいと思います。

講師として、Web Designingへの寄稿や「jQuery Mobile スマートフォンサイト デザイン入門」のデザインでおなじみの、鍋坂 理恵さん、東京のCSS Niteやセミナーイベントでも多数登壇されている、前川 昌幸さんをお迎えしてのセミナーになります。

マルチデバイス時代に抑えておきたいWebデザインのポイント

スマートフォンやタブレットの普及により、様々なスタイルでWebサイトを閲覧するようになりました。
複数デバイスでの表示を考慮しなくてはならない現在、Webデザイナーに求められるものも変化しています。
従来のPC用のサイトのみを制作していた頃とは異なり、画面の設計や操作するシチュエーションなど、配慮しなくてはならない要素が多くあります。
これらを踏まえて、デザイン時に抑えておくべきポイントをお話ししたいと思います。

鍋坂 理恵 (なべさか りえ)
株式会社サン・サン 代表取締役
http://www.sonsun33.com/blog/

香川県生まれのWebデザイナー。
Web制作会社にてWebデザイン、各種制作を経て独立。
Webサイトの企画・デザイン・制作を行ない、主にWebデザインを得意とする。

Web DesigningにてCSS・Webデザイン関連の記事執筆。
共著に『jQuery Mobile デザイン入門』（アスキー）、『すべての人に知っておいてほしい スタイルシートデザインの基本原則』（MDN：2012年5月25日発売）がある。

マルチデバイス対応のコーディング・マークアップのポイント

PC向けのみのサイト制作から、スマートフォン・タブレットなどを対象に加えるときに、「HTMLはどう書けばいいの？」「CSSは？」「JavaScriptは？」と心配になるかもしれません。「PC向けの延長でいいだろう」「がらっと一新して作らなければ」果たしてどちらが正しいのでしょうか？実はどちらも正解だったりします。ただ、なにもわからない状態では正解の出しようもありません。
ということで、マルチデバイス対応に向けたコーディング・マークアップについて初めて取り組む場合を念頭に置いたトピックを時間の許す限り紹介していきます。

前川 昌幸 (まえかわ まさゆき)
株式会社スクイズ研究所
http://sqz.jp/

1972年兵庫県生まれ

CD/VIDEOショップ店長、バーテンダー兼会社役員、コミュニティFMパーソナリティ、職業訓練校講師を経て2006年から現職。専門はマークアップ。他にサーバ保守管理、サーバサイドプログラミング、モバイルサイト開発、iOS/Androidアプリインターフェース等担当。2011年よりokayama-jsを主宰。

岡山WEBクリエイターズ、CSS Nite in OKAYAMA、CSS Nite in TAKAMATSU、okayama-jsなどで主にJavaScript、マークアップなどのテーマで登壇。2012年から岡山WEBクリエイターズではセッション後のトークセッションのコーディネーターを担当。