タグ

Webとタブレットに関するkanedasakaeのブックマーク (3)

  • Webデザインの代表的な4つのレイアウト、その特徴と相違点 -Liquidapsive

    デモページ Responsive(レスポンシブ) Adaptive(アダプティブ) Liquid(リキッド) Static(スタティック) Responsive(レスポンシブ) レスポンシブは、デスクトップ・スマホ・タブレットなど異なる解像度ごとにレイアウトを定義するのが特徴です。一見するとリキッドのように見えますが、表示サイズに応じて要素の幅のサイズやレイアウトが変化します。 デバイスごとに合わせた一種のリキッドレイアウトであると考えることもできます。 Liquidapsive: Responsive Adaptive(アダプティブ) アダプティブは、デスクトップ・スマホ・タブレットなど異なる解像度ごとにレイアウトを定義するのが特徴です。レスポンシブとは異なり、単にレイアウトを変えるだけではありません。ユーザーのコンテクスト(環境・状況・目的など)に応じて表示するコンテンツ(レイアウト)

    Webデザインの代表的な4つのレイアウト、その特徴と相違点 -Liquidapsive
  • Webアプリをあっという間にカッコよく! BootstrapによるレスポンシブWebレイアウト

    筆者は、このような画面を頻繁に目にします。なぜなら、デザインに疎い筆者自身がWebアプリを開発すると、このようなシンプルな画面がたくさん出来上がるからです。 そもそも業務アプリケーションでは、業務で取り扱う数多くの情報を、データベースや他システムなどから取得し、アプリケーション内でそれらの情報を、安全かつ正確に処理するためのコーディングを行う必要があります。開発規模が大きくなれば、再利用性の高い設計になるようさまざまな知恵を使う必要がありますし、取り扱う情報には機密性の高いものも含まれるため、セキュリティなどにも細心の注意を払う必要があります。そのため、どうしてもビジネスロジックの開発に注力しがちで、画面デザインやレイアウトなどのフロントエンド開発は、ついつい後回しになってしまいます。 しかしながら、Webアプリの操作性は、システムの顧客満足度を左右する重要なポイントになります。また、パソ

    Webアプリをあっという間にカッコよく! BootstrapによるレスポンシブWebレイアウト
  • ウェブデザインをはじめるあなたへ - ウェブ雑記

    ウェブデザインについてまったくわからない頃によく見て勉強してた資料群です。+いくつかの自分で作った資料 SlideShare 色彩センスのいらない配色講座 色相、明度、彩度で色を説明できるようになる。 ベースカラー、メインカラー、アクセントカラーで配色を説明できるようになる。 その上で、あまり間違いのない色の選び方がわかるようになる。 ノンデザイナーのための配色理論 最後に紹介されているこのツールがベースカラー、メインカラー、アクセントカラーを決める上で便利。 ウェブサービスの企画とデザイン 僭越ながら明治学院大学で講義した時に作った資料。 なんとなくウェブサービスを作るときの流れとか感じてもらえたら幸いです。 かんたんキレイなウェブデザイン 僭越ながら勉強会 (UT Startup Gym) 用に作った資料。 なんとなく CSS フレームワーク、グリッドシステム、レスポンシブデザイン、ウ

    ウェブデザインをはじめるあなたへ - ウェブ雑記
  • 1