CSS Nite LP35：マルチデバイス対応

CSS Nite へ実に5年ぶりぐらいに参加してきました。今回のテーマは「マルチデバイス対応 2014」ということで、話を聞いて気になった点のまとめです。

http://cssnite.jp/lp/lp35/

Android 化の加速？

AEON がスマホの通信産業に参入し、その格安のプランによって、今までガラケーだったシニア層や現料金プランに不満のある人たちが Android にシフトしてくる可能性がある。

回線速度の低速化

AEON のスマホで提供される SIM カードの通信速度は 200kbps。それを考えると、サイトのサイズなどを考慮しないと、かなり厳しいことになりそう。Network Link Conditioner などでシミュレートしてみるといいらしい。

最近はファイルサイズを極端に気にして制作することも少なくなった気もするが、かつてのダイアルアップ時代のように、いかに最適化して表示速度を高めるかといったノウハウは必要になってくるかもしれないなぁと思った。

ネイティブアプリから html5 への移行

• メリット
  • 初回利用が容易
  • バージョンアップが確実
  • iPhone/Android 以外にも対応できる

これは間違いなくそういうサービスが増えていくんだろうなぁ。

レスポンシブ Web デザインのワークフロー

• 早い段階で動くものを作って検証することが大事
• メリット
  • 完成とのズレがなく進められる
  • 早めに問題に対処できる
  • 余裕をもって進められる

CSS フレームワーク (Bootstrap とか Foundation とか)

• 「コンポーネント」レベルの設計システム
• メリット
  • 実装工数の短縮
  • 変更・メンテナンスに強い
  • 実機検証の効率化
  • 信頼と実績（これは大きなと思った）
• 使えるところだけ使えばいい
• クラス名がセマンティックじゃないのが気になる場合、sass で @extend してしまえばいい（なるほど！）
• プロセス、およびチーム全体の基礎設計、ルールにできる

スマートデバイス時代の Javascript

• 便利さより速さが求められてきている(vanilla.js?)
• alt JS(クラスベースで考えられる TypeScript 試してみたい)

気になったプラグインとかライブラリ

• grunt-uncss
  使ってない css を削除してくれる grunt プラグイン
• KSS
  最近は StyleDocco より流行ってる？
• intention.js
  デバイスに応じて、要素のクラスを差し替えたり、画像を差し替えたり、href 属性などの入れ替えをする
• jQuery throttle/debounce
  イベントに紐づいた処理を間引く jQuery プラグイン
• pleeease
  auto-preficer とか combine-media-queries とかがバンドルされているのかな？