5

これについてはさまざまな意見がありますが、Webページを設計するとき、最適なウィンドウサイズ、つまりビューポートサイズはどれくらいに対応する必要がありますか？今、これはあなたが幅広い一般大衆に食料調達したいと思っていることを前提としています（つまり、ゲームのウェブサイトを作成した場合、そこで転がる人々は800x600の画面を持たないでしょう...）

また、メインを含むdivを自動サイズのままにしておくのが最善ですか（ストレッチしたくない固定要素が内部にない場合は、画面サイズに合わせてストレッチされます）、または幅を固定しますか？私はいくつかのWebサイトを設計しましたが、2012年のベストプラクティスがまだわかりません。

4

5 に答える 5

5

レスポンシブ Web デザインについて詳しく調べてください。基本的な概要は次のとおりです。メディア クエリを使用して css を設定し、さまざまなサイズに対応するようにスタイルを調整する必要があります。%また、 moreと lessを使用して、より流動的なレイアウトを念頭に置いて設計する必要がありますpx。

これらは、レスポンシブ デザインのかなり一般的なメディア クエリだと思います。

/* Landscape phones and down */
@media (max-width: 480px) { ... }

/* Landscape phone to portrait tablet */
@media (max-width: 767px) { ... }

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { ... }

/* Large desktop */
@media (min-width: 1200px) { ... }

これを html の先頭に追加します。

<meta name="viewport" content="width=device-width" />

ユーザーが 1 つのモンスター スタイル シートをダウンロードする必要がないように、個別のスタイル シートが必要な場合は、次のようにします。

`<link rel="stylesheet" type="text/css" media="only screen and (max-width: 480px), only screen and (max-device-width: 480px)" href="/assets/css/small-device.css" />`
于 2012-07-16T17:19:59.767 に答える
2

imakeitpretty が言ったように...しかし、現在人気のあるデバイスのサイズについて心配する必要はありません...見た目が悪くなるまでサイズを変更してください...そしてブレークポイントを作成してください...すべてが見栄えがするようにします.

/* break point 01 ----------- */
@media only screen 
and (min-width : *size-it-gets-ugly*px) {
/* Styles */
}

/* break point 02 ----------- */
@media only screen 
and (min-width : *size-it-gets-ugly*px) {
/* Styles */
}

/* break point 03 ----------- */
@media only screen 
and (min-width : *size-it-gets-ugly*px) {
/* Styles */
}
于 2012-07-16T19:51:57.500 に答える
1

最適なサイズは、サイトを表示しているディスプレイのサイズです。
j08691が指摘したように、レスポンシブは 2012 年のベスト プラクティスです。空っぽのバズワードのように聞こえるレスポンシブ デザインは本当に便利です。あなたのコンテンツは、閲覧者のブラウザと常に同じサイズです。

流動的なグリッドでメディア クエリを使用すると、見栄えがよく、最も使いやすい結果が得られます。独自のものを書くことに熱心でない場合は、 Responsive Grid Systemのような既存のものを見てください。

于 2012-07-16T17:22:26.120 に答える
1

幅 940px + レスポンシブ メディア クエリの最小幅: 780px と 480px を使用します。

于 2012-07-16T17:16:29.840 に答える
0

960pxは、しばらくの間、堅実な標準幅でした。

推論はここでこの他のSOの質問に入れられます。

ユーザーを理解することは非常に重要ですが、ゲーマーについてあなたが言ったことは完全に真実です。

私はレスポンシブに精通していませんが、それも有望に見えます

于 2012-07-16T17:44:19.357 に答える