スマホサイト 容量問題について

こんにちは!厳しい寒さは昨日で終わりのようですね!

みなさまいかがお過ごしでしょうか?

 

前回に引き続きのスマホネタ。容量問題についてまとめたいと思います。

****************************************************

目次

1.ファイルの容量を減らすためにすべきこと

2.利用すると便利!サービス各種

3.ファイルサイズの規約について

************************************************************

1.ファイルの容量を減らすためにすべきこと

スマホサイトはなんといっても軽さと情報凝縮が大切!

 そんなわけで以下のポイントを押さえて作ってみましょう

 

①ファイルをなるべく少なくする。
CSS,jsなどはリセット、スタイルなどを同じファイルに!

②改行や空白なども容量にカウントされてしまうため削る。

jqueryなどを使うとどうしてもファイルが増え、容量増加の原因となってしまいます。ファイルをそれぞれまとめることで、コンパクトにしましょう。

*********************************************************

2.利用すると便利!サービス各種

CSS圧縮する


 CSS Minifyというサービスを使う。
 http://cssminifier.com/
 日本語訳版
 http://translate.google.co.jp/translate?hl=ja&sl=en&u=http://cssminifier.com/&prev=/search%3Fq%3DCSS%2BMinify%26client%3Dfirefox-a%26hs%3Dj5Y%26rls%3Dorg.mozilla:ja:official%26hl%3Dja

④JSはこれ
 http://jscompress.com/

※必ずバックアップを!!

⑤img圧縮はこちら(jpgやgifもOK)
 http://www.punypng.com/signup

HTML以外すべてのファイルが圧縮できるのですね!少しでのファイルを小さくするために大事なことです。

********************************************

3.ファイルサイズの規約について

 

●画像データは2メガピクセル以内
 JPEGデータのピクセルサイズは32メガピクセル以内
●アニメーションGIFのデコードサイズは2MB以内
Canvas要素は2MB以内 
●input type="file"によるファイルアップロードは原則不可
●HTML CSS Javascript ストリーミングファイルは10MB以内
javascriptの実行時間は10秒以内
JavaアプレットFlashは使えない
PCとの大きな違いはFlashが使用できなくなったことでしょう。

CSS3にはanimationやtransitionなどのプロパティが登場し、JSと組み合わせることで、Flashに近い動作も可能となってきました。

 

今日は以上となります。御精読ありがとうございました。