html5勉強会 36回目 - kogee's diary

ざっとまとめだけｗ

offline firstとSPDYあたりが面白かった

offline first ≒ mobile first 2010/9/3

オフラインを最初に考える思考 2012/11/26

レスポンシブルウェブデザインが言われ始めたのが2010.05.25
なのでだいたい言葉ができてから浸透するのは1年半から2年くらい？

なのでoffline firstは2014年くらいにはやる？

オフラインwebの到来は 2014年くらい？

オフラインでもページがよめるメリット
・オフラインで使える
・スピード(早く読み込める)

すべてのリソースはオフラインにキャッシュ => ユーザービリティの向上

"offline is a feature"

オフラインは機能

ニュースなど読む中心のものはデータの新鮮さが必要なのでオフラインニムていない？

書き込むのもは向いてる？
google slidesはオフラインに対応している => いつでも編集できる

アプリの特性によりオフライン機能をいれるかいれないかきめる

企業向けのモバイルアプリの大半はHTMLに？
フォームが多くて途中で編集、保存したりするのにむいてる

実現するAPI

なので上にあげたgoogle slideのオフライン機能もchromeのみ

他のブラウザが対応する気配はまだないかんじ

offline firstの勘所

ラッパーを通じてwebAPIを呼び出す漢字
setMemoなど通信する方法はかわる可能性があるので変えやすいように

新しいサイト、期間限定のページならhtml5を使いやすい

html5を導入しているサイトは

doctypeはhtml5だけど完全にhtml5化しているわけではなく一部のタグでhtml5を導入しているところがおおい

microdata/RDFa など
検索エンジン対策で
Media Query
-W3C

などがサイトで採用している
画面サイズによってcssや画面のデザインをかえれたりする
静的なコンテンツのほうが動的コンテンツより操作しやすい
動的コンテンツはパーツのサイズがかわったりあまりむいてない

PC/モバイル　それぞれ先につくったデザイン新色されてむずかしい

navigation timing API 画像をdataURL(MIME Type +base64文字列に変換)したり
http://hi0a.com/demo/img-base64-datauri/
こんなかんじ？
多少重くなるがリクエスト数は減らせると

こういうサイトからレスポンスの特徴が出せる
http://tools.pingdom.com/fpt/

画像が多いとか何にレスポンスに時間かかる傾向があるかとか

HTTP2.0とSPDY

単一のSPDYセッションで複数のリクエストを送ることができるただしhttpsのみ

facebookとかが採用してる
何故か自分のブラウザでは確認できませんでしたがw

chromeでこのあたりみるとgoogleとかでつかわれてることが確認できます
chrome://net-internals/#spdy

Chromeでワイルドカード証明書でSPDYを利用していると、DNSレコード情報が一致しているサイトへのSPDYセッションは1つにまとめられるらしい

SPDYがHTTP2.0のベースになりそうな予感