注: 「CSS Layouts:The Fixed。」の記事の翻訳。 流体。 エラスティック。」 、 レイアウトという用語のロシア語の類似物として、 レイアウトが使用されます。 この記事では2種類の「ゴム」レイアウトについて説明しているため、そのうちの1つは区別のために「弾性」とマークされています(弾性、貴重なコメントはMTonlyに感謝します )。 著者は、考慮される各レイアウト(レイアウト方法)の主な長所と短所を要約しています。どのレイアウトレイアウト(カスケードスタイルシート、CSSを使用)が最適と見なされますか? それらにはそれぞれ独自のハック(
癖 )と独自の長所と短所があります。 そのうちの1つは、他の誰よりもユーザーフレンドリーになりますか? どれくらい簡単ですか? それぞれにどのような問題があり、どのように回避するのですか? そのうちの1つは他のものよりも構成が簡単ですか? その中に完全に不適切な欠陥品はありますか? ほとんどの場合、多くの人がこれらの質問に明確に答えますが、私はそんなに急いでいません。 私はこれらのレイアウトのそれぞれが好きです、そして、あなたが賢明にそれをするならば、それぞれは何らかの方法で適用できます、そして、ユーザーのすべてのカテゴリーのために使いやすさと同等のアクセシビリティを注意深くチェックしてください。 それらはすべて、Webサイトの
プレゼンテーション層の一部であるため、ほとんどのアクセシビリティの問題は、セマンティクスと一般的なレイアウトルールの正しい使用に起因します。 次に、
固定の固定 、適応性のある
流体、および拡張可能な弾性レイアウトの私の見解を説明します。
固定幅レイアウト
固定幅のサイトレイアウトは、メインコンテンツ領域(
wrapper )で異なり、ユーザーエージェント画面の解像度に関係なく、その幅は変更されない値に設定されます。 最も一般的で妥当なのは760ピクセルの幅です。解像度が800×600のモニターのユーザーは、追加の水平スクロールに頼ることなく、サイトのメインコンテンツを画面のほぼ全幅で見ることができます。
著者のブログはそのようなレイアウトの例ですが、現在の画像を変更せずに簡単にゴムまたは伸縮性のあるレイアウトにすることができます。
このレイアウトの利点
- サイトのメインコンテンツのコンテナは固定されており、最大幅または最小幅を設定する必要はありません(実際には、現時点ではクロスブラウザをサポートしていません)。
- 場合によっては、固定幅レイアウトを使用すると、特定の効果を作成したり、デザインを決定したりするのが簡単になります( たとえば、ドロップダウンメニューやツールチップを配置してフィールドを形成するなど )。 一部のデザインレイアウトは、メインコンテナーの固定幅のみを使用した合理的なレイアウトです。
上記のメインフィールドの幅に基づくレイアウト-760ピクセル-このようなタイプのレイアウトの典型的な幅は、私の意見では、テキストの最大の可読性に最適です( 記事の著者に部分的に同意します。 その場合、約200ピクセルを割り当てることができますサイドメニュー、およびサイトは1024×768の幅で配置されますが、メインフィールドの幅は1000ピクセルになります )。