0

この投稿は、コードの構文についてではなく、サイトの開発を開始する前の作業戦略についてです。

スマートフォン (Android { 3 種類のサイズ}、iPhone {2 種類のサイズ}、およびその他のスマートフォン以外の携帯電話) 用のモバイル サイトのフロントエンドを設計する必要がある場合、どのように進めればよいですか? (私のデザインは、これらすべてのデバイスで機能し、同じでなければなりません)

1- 柔軟な画像と流体グリッド (柔軟な DIV:s) に関するアイデアに従って作品をデザインします。

また

2- ターゲット モデルごとに異なるメディア クエリ サイズを設定しますか? (このソリューションは開発作業を増やす可能性がありますね?)

考えてくれてどうもありがとう...

4

3 に答える 3

0

それは本当に好みの問題です。流動的なデザイン、メディアクエリ（cssトランジションを使用）、またはすべての手法の組み合わせを使用できます。

最近のプロジェクトでは、メディアクエリを使用しました。基本的なデザインを完成させたら、240ピクセルから960ピクセル幅までのさまざまな解像度で動作させるのに1時間もかかりませんでした。それで、より多くの開発作業...そうではありませんでした。

あなたの以前の質問の1つに関する私の以前の推奨事項はまだ立っています：

  1. 何も配置せずにサイトをデザインします（つまり、1つのdesign.cssファイルまたはfonts.css、typography.cssなどの複数のファイルに分割します）。HTML 5のリセットから始めて、フォントフェースを実装し、背景を設定し、リンクに色を付け、入力のスタイルを設定しますが、何も配置しません（つまり、ヘッダー、ナビゲーション、コンテンツ、およびフッターのセクションがある場合は、それらを配置しないでください） 。

  2. メディアクエリ（例：layout-240.css、layout-960.css）を使用して、ビューポートをターゲットにし、それに応じてすべてを配置します。それらは一般的に100行未満のCSSを含み、3 KB未満のディスクスペースを占有しますが、それは関係ありません。

于 2011-09-15T22:07:10.227 に答える
0

最初に流体グリッドを使用します。その後、メディア クエリを使用して最終的な微調整を行うことができます。たとえば、余裕がある場合は画像を右に浮かせます (横向きモード)。

このようにして、ビッグ 2 だけでなく、ほぼすべてのデバイスをサポートします (ただし、Blackberry は Android よりも大きいと思います)。

于 2011-09-15T14:51:59.537 に答える
0

@ヨニギーク; 使用する必要があるかもしれませんfluid layout。

これについては、画面サイズを& 定義するscreen width代わりに定義するだけです。そう; デバイスごとに定義する必要はありません。device widthcssmaximum devicecss

この記事を読むhttp://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/

インスピレーションについては、このサイトをチェックしてください http://mediaqueri.es/ & すべてのデバイスで同じように見えます.

于 2011-09-15T15:13:14.620 に答える