2011-09-15 3 views
0

このサイトはコードシンタックスではなく、サイトの開発を開始する前に仕事戦略について書かれています。media-queries VS.さまざまなモバイルフォーマットのための流体グリッド

スマートフォン(アンドロイド{3種類のサイズ}、iphone {2種類のサイズ}、その他のスマートフォン以外の携帯電話)のモバイルサイトのフロントエンドを設計する必要がある場合はどうすればよいですか? (MY DESIGNは、これらすべてのデバイスで同じを仕事とする必要がある)

1 - 私は柔軟なイメージと流体グリッド(フレキシブルDIV:S)についての考え、次の私の仕事を設計するものとします。

又は

2-セット毎にターゲットモデルの異なるメディアクエリ・サイズ? (より多くの開発作業を作成することがあります。このソリューションは、それではない?)年の思考のための非常に

おかげで...

答えて

0

使用流体グリッド最初。その後、メディアクエリを使用していくつかの最終調整を行うことができます。例えばのように。余裕があれば画像を右に浮かべます(ランドスケープモード)。

この方法で、あなたはそこにいるほとんどすべてのデバイスをサポートしています.Bright 2だけではありません(ブラックベリーは私が信じているAndroidよりも大きいですが)。

0

@ YoniGeek; fluid layoutを使用する必要があります。このため

だけscreen width代わりにdevice width &を定義maximum device画面サイズにcssを定義します。そう;デバイスごとに異なるcssを定義する必要はありません。

http://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/

この記事を読んでインスピレーションhttp://mediaqueri.es/ &のためにこのサイトをチェックし、すべてのデバイスで同じように見えます。

0

本当に優先事項です。流体デザイン、メディアクエリー(CSSトランジションあり)、またはすべてのテクニックの組み合わせを使用できます。

私の最近のプロジェクトでは、私はメディアの問い合わせを受けました。基本的な設計が完了したら、幅240ピクセルから幅960ピクセルのさまざまな解像度で作業するのに1時間もかかりませんでした。だから、もっと多くの開発作業...そうではありませんでした。

あなたの前の質問の中に私のprevious勧告はまだ立って:

  1. デザイン(すなわち:1つのdesign.cssファイルまたはなどfonts.css、typography.css、など複数のファイルに分割..)場所を指定することなくサイト。 HTML 5のリセット、フォントフェイスの実装、背景の設定、リンクの色付け、入力のスタイルの設定(例:ヘッダー、ナビゲーション、コンテンツ、フッターセクションがある場合は配置しないでください) 。

  2. あなたのビューポートをターゲットにして、すべてのものを適切に配置するために、メディアクエリ(つまりlayout-240.css、layout-960.css)を使用します。彼らは一般的に100行未満のCSSを含み、3KB未満のディスクスペースを占有しますが、それは無関係です。

関連する問題