Webおよびタブレット向けの設計-レスポンシブデザイン

• かもしれません 3, 2024

レスポンシブという用語はしばらくの間、最前線にありましたが、正確にはどういう意味ですか？インターネットは長年にわたって、主にテキストベースのプラットフォームからインタラクティブで魅力的なマルチメディアおよびマルチデバイス環境に大きく変化しました。

過去10年間で、インターネットとそれを表示するために使用するデバイスの改善を反映して、Webページが変更されました。デバイスといえば、コンピューター、ミニコンピューター、タブレット、スマートフォンなど、いくつかの種類があります。デバイスの数とそのバリエーションが増えると、問題が明らかになります。各デバイスとデバイスの各バリエーションには、独自の画面サイズがあります。

デスクトップおよびラップトップコンピューター用のWebサイトのみを設計する必要があった場合、主な考慮事項は、コンピューターまたはWebブラウザーに関係なくWebページが同じように表示されるようにすることでした。答えは、上位のWebブラウザーと最も一般的な画面解像度に合わせて設計することでした。それは短期間働いた。これらのパラメーターが変化し続けると、別の問題が明らかになりました。最初のコンピューターの画面サイズは800 x 600でしたが、とにかく気に入っていました。その後、1024 x 800が標準になりました。現在、コンピューターは27インチ以上に拡大しています。そのため、ウェブサイトの目標解像度は変化し続けました。

これらの大きな画面向けのデザインを楽しみ始めたちょうどその頃、スマートフォンとタブレットの人気は大幅に向上し、そのクールなアプリは小さい画面でした。実際、スマートフォンやテーブルは、数年のうちにコンピューターを使用するよりも頻繁に使用され、ウェブを閲覧することが予測されています。最初は数台のモバイルデバイスしかありませんでした。そこで、コンピューターユーザー用のメインWebサイトとモバイルユーザー用の2つ目のサイトの両方の設計を開始しました。しかし、これでは固定幅レイアウト用に設計しているため、問題は完全には解決しませんでした。

これで、視聴者がウェブサイトを表示するために使用するデバイスを推測することはできません。そのため、特定の固定画面サイズ用に設計することは、問題に対する最良の答えではなくなりました。必要なのは、ユーザーのデバイスの画面サイズを決定し、それに応じてWebページを表示する方法です。したがって、レスポンシブWebデザインでは、CSSを使用して画面の幅を決定し、必要に応じてWebページを異なる方法で表示します。これにより、必要に応じて複数のバージョンに変形するWebサイトを1つだけ持つことができます。

動画の説明: CIWユーザーインターフェイス(UI)・デザイナー資格コース - CIWウェブ＆モバイルデザインシリーズ (かもしれません 2024).