![]()
iOSデバイス iPad,iPhone などへの
パブリッシュ機能が問題となっていたのか、
今春、体験版もクローズしていた「Adobe Director 12」。
久しぶりにAdobeのページを見ていたら、
すでに販売されていました。5月中旬からのようです。
製品版が14万円
アップグレード版が4万2,000円
Lingoスクリプトや JavaScriptを利用して開発。
Adobe Director 12
レスポンシブwebでのラフデザイン
![]()
通常は、ワイヤーフレームの後、
ラフ・デザインに入ります。
レスポンシブの場合は、
画面サイズをバリアブル ( 可変 ) と据えるので、
ピクセルパーフェクトとは考えず、
ラフもデザインもいらないかというと、
そうではないことの方が多いですよね。
具体的には、
まだまだイメージできないことが多いので、
デザインを共有しなければ、前に進めません。
——————-
うちの場合は、
通常のPC向けデザインを確定させ、
レスポンシブ向けには、
大きく二種のラフを必ず描いています。
( ミーティングに使わない場合もある )
その後の、早い段階で、
コーディングしたプロトタイプを見せてしまう。
という流れです。
——————-
特に、Androidの画面設定は無限なので、
PC + レスポンシブという形式でも、必要とされますし、
Googleが 去年の六月、レスポンシブを推奨したことからしても、
強いサイトには必須になっていくんじゃないか。
と考えています。
Style Tiles で合意をとりまとめていく方法なども、
ラフデザインの段階でフォーマット化の予定です。
http://styletil.es
※ Style Tiles についてはコリスさんでも紹介されていました。
スマホ開発時の JS 配置について
![]()
画像などのコンテンツを すべて読み込んでから、
JS を動作させたいという場合があります。
( JS 動作が先だと、空のコンテンツのため、崩れる )
そういったときに、
開発環境が高速回線だと、崩れる現象が見えないので
気にならないのですが、
実際の利用環境では、デバイスによって、
・アンテナが、シングルだったりデュアルだったり、
・回線が 3Gだったり、LTEだったりと、
まちまちなので、
低速な環境を想定した上で、行っておきたいのですね。
================
1、
コンテンツの読み込みを先にさせるため、
jQueryの 通常のファンクションを変更する。
$(function() { ・・・
ロードしてから ( ページがすべて読み込まれてから関数実行 ) に変更する。
$(window).load(function(){ ・・・
2、
読ませる順序を意識することでスムーズにさせる。
head 内に 置かないで、
body 閉じタグ直前に JS を下ろしてやる。
3、
JS を なるべく一つのファイルにして、さらに圧縮をかける。
4、
CSSの参照タグを JS の参照タグよりも先に記述する、
5、
favicon.icoを設置する。
ブラウザはバックグラウンドで favicon.icoを要求してきている。
さっさとキャッシュさせておく。
==================
JS 内部コーディングの高速化は別途。
追記 : イメージーズローデッドをつかう書き方もありました。
$("#XXXXX").imagesLoaded( function(){
//ロード完了後の処理
});