WCK Meeting Vol.52「レスポンシブあれこれ」レポート
2017年8月18日(金)高知市文化プラザかるぽーとで WCK Meeting Vol.52「レスポンシブあれこれ」が開催されました。
今回の企画・登壇は、WCK実行委員の入交昭さん(HOOP Design)。ウェブ制作の現場では今や必須となったレスポンシブウェブデザインについて、あらためて掘り下げてお話いただきました。
基礎からおさらい、レスポンシブウェブデザイン
レスポンシブウェブデザインの誕生から7年。マルチデバイス対応の必要性は誰もが実感するところですが、時折「スマホ対応=レスポンシブ」という誤った認識が見られることもあります。
今回はマルチデバイス対応として、次の3つの手法について、それぞれのメリット・デメリットを解説いただきました。
- セパレートURL…デバイス毎に異なるURLのページを作る
- 動的配信…CMS を用いて、デバイスに応じたテンプレートを出し分ける
- レスポンシブ…1つのHTMLをデバイスに応じたスタイルで表示させる
気になる Google の評価についても「同一コンテンツをリダイレクトなしに同じURLで提供し、新しいユーザーエージェントにも対応できる」という点が推奨されているのであって、動的配信よりレスポンシブウェブデザインが良いとされている訳ではないと教えていただきました。
また、エンドユーザー、クライアント、ディレクター、デザイナー、コーダーそれぞれの視点から見た「マルチデバイス対応」についてのお話も興味深かったです。
実装方法やテクニックが語られることの多いレスポンシブウェブデザインですが、サイトの設計やデザインによってそのコストは大きく変わってくるとのことでした。
メンテナンス性や、デザインの自由度、制作に関わるメンバーの技量などなど、案件によって最適な手法は異なります。今回、各手法のメリット・デメリットや選択の決め手となるポイントを解説いただき、非常に参考になりました。
レスポンシブあれこれ徹底討論!?
勉強会の後半では、レスポンシブウェブデザイン制作のコツやよくある疑問を取り上げて解説いただきました。
- デザインする上での注意点は?
- レスポンシブウェブデザインではスマートフォンのデザインカンプはいらない?
- 画像の切り替えはどうする?
- タブレットへの対応をどう考える?
- 表組み(table)はどうする?
従来の静止画カンプでは検討しきれないレスポンシブウェブデザインだからこそ出てくる「あるある」にどう対応するかを、実例やデモ、具体的なテクニックを交えながらお話いただきました。
レスポンシブといえど、全てのデバイスに完璧に対応するとなると、コストも相応にかかります。「レスポンシブでは完璧をもとめない」のフレーズに頷いている方も多かったようです。
質疑応答のコーナーでは、時間いっぱいまで質問が止まらず、アンケートでも「もっと聞きたかった」「質疑応答の時間がもっと欲しかった」との声が挙がっていました。
今後も登壇者と参加者、また参加者同士でも意見交換のできる場ができると良いですね。
入交さん、ご参加いただいた皆様、ありがとうございました!
撮影:上野洋平(notch)