..


スポンサーリンク

スマートフォン用に最適化されたサイトの基本レイアウト

Web上で、我々はスマートフォン用のWebページをデザイン、レイアウトと空間の無限の組み合わせで夢中にするために使用される場合、我々の創造意欲を修正しなければならない、あるいは少なくとも、私たちの仕事の視聴を目的としたディスプレイの限られた大きさのサイズを変更。

注:ビデオの解像度がモデルに応じて、当然のことながら、変化する、次世代のスマートフォンのほとんどが240の最小値から480ピクセルの最大値までの幅を持つディスプレイを持っている。 最も一般的な解像度は320ピクセルの幅以上、 ポートレートモードで、カウントすることができます。

2つ、3列または4列のレイアウトを忘れる! コンテンツへの適切なユーザビリティを確保するためにのみ可能な解決策を私の視点から、 すべてのコンテンツが垂直方向のためのカスケード接続 (すなわち、他の下のもの) に沿って編成されている単一列の設計、である。 あなたが常に覚えて、ウェブページを作成すると、最も重要なことはなおさらディスプレイがスマートフォンに限定されているときに、優れたユーザビリティを確保するとしている、シンプルさは常に前方に最良の方法です。

ご覧のように、私たちの構造は非常に単純で、最初は三つの部分から構成されています。

  • ヘッダ:ページの上部で、サイトのロゴ、おそらく一階のいくつかの他の要素に対応するように設計されている。
  • ページ本体:それは私達のウェブサイトのページの実際のコンテンツの中央部分に対応するように設計されている。
  • フッター:それはどんなクレジット、法律上の参照、著作権表示、連絡先、等を置く一般的ですがここでは、下部に、最後の部分です。

ナビゲーションメニュー

ページの中央部分は、順番に、他の領域を(必要に応じて変化する)収容するために使用されます。
本質的な要素は、もちろん、サイトの他のページ/エリアをアクセスするためのナビゲーションメニューです。 これらは少数である場合(最初の解決策)を直接そうでなければ、必要なリンクを持つツールバーを作成することができます-スペースの理由から、 -それは、クリックすると、すべてのページ/分野の一覧を表示する、単一のボタンを追加するほうがよいです(第二の溶液)利用できる

内容

また、上記のすべて、コンテンツには心にあなたのスマートフォンの小さな画面を保持する必要があります。 ここでも、そのため、シンプルさと直線性は、私の考えでは、最良の選択です。

、ウェブデザインの良いルールであり、それはモバイルデバイスのために、ディスプレイの小さなサイズに関連する質問については、使用可能な帯域幅に関連する理由により、Webページの開発にさらに多くの場合不必要なフリルのグラフィックを避ける(だけでなく、コストを持っているそれは本質的な何かに集中するのがベストですので、3Gの帯域幅)は、常に高速ではありません。

であっても内容のため、従って、お互いをフォローで様々なレイアウト要素(テキスト、画像、ビデオ)カスケードを示唆している。

次のレッスンでは、<HEAD>(タイトル、メタタグやCSS)によって、もちろん、開始当社のウェブサイト上のHTMLコードをビルドする方法について説明します。

モバイルデバイス用のサイトを開発するのに役立ちます
E -ラーニング
CSS(コース) CSS(コース)
W3C CSSやXHTMLに応じてWebデザインとアクセシビリティ。 29€から開始。
エクセル(電子ブック) エクセル(電子ブック)
スプレッドシートおよび計算を作成します。 ちょうど25€。
Photoshopの(コース) Photoshopの(コース)
人気のAdobe PhotoshopでWebグラフィックや写真の編集。 49€から。
スポンサーリンク