Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

Tag Archives: Layout

[Web Design] 70 Examples Of Modern Responsive Web Design – レスポンシブレイアウトのモダンなWebデザイン

  • Pocket
  • このエントリーをはてなブックマークに追加

閲覧者のウィンドウサイズによってレイアウトの変化するレスポンシブレイアウトを使ったクールサイトのまとめ記事。70ものサイトが紹介されてます。つーかこの手法使って主にスマートフォンに対応するためのものだと思ってるんですが、なんつーかもうすっかりメジャーなんですね。紹介されてるサイトはどれもクールで、スマートフォン対応のサイトごとに異なる対応手法は参考になります。

[Web Layout] 21 top tools for responsive web design – レスポンシブデザインのためのツールまとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

スマートフォン対応の手段として、今後主流となるかもしれないレスポンシブ・レイアウトのためのツールをまとめた記事。フレームワークを始め、スケッチシート、グリッドシステム、イメージの拡大縮小、テキストの拡大縮小、モニターリサイザー、レイアウトテストツールなどが紹介されてます。あと記事最後にはレスポンシブ・レイアウトを採用したサイトの作例紹介サイトなんかもあります。ブラウズ環境に対してサイトに汎用性を持たせるという意味では、この手段はなかなかイイんじゃないかと思っちょります。新規にサイトを制作する際に対応しておくとイイ感じですね。

[Web Design] 10 Rock Solid Website Layout Examples – よくあるウェブレイアウトと、その作例

  • Pocket
  • このエントリーをはてなブックマークに追加

ソリッドレイアウトを前提とした、一般的なウェブレイアウトの手法とその作例の紹介。メインイメージの見せ方、ナビゲーションの構成、トピック記事の配置などに関して、ワイヤーフレームで手法を紹介した後で、そのレイアウトで作られたサイトが紹介されてます。紹介されてる作例もクールなものが多いので、ネタ帳としても使えそうです。

[CSS] 715 Awesomely Simple and Free CSS Layouts – レイアウトのネタ帳まとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

CSSで行うレイアウトのネタがまとめられた記事。レイアウト例とそのソースを配布している12サイトをまとめた記事、と言った方が分かりやすいかも。サイト制作時のプロトタイピング(ワイヤーフレーム)の際に必ず出てくる「レイアウトどうすっかなー」という段階において役立ちそうです。わたくしシングルカラムレイアウトが苦手でして、なんつーか横幅いっぱいに使うのって難しくないですか? サイドバーがあった方がデザインしやすいだなんて、典型的なブログ病と言えるんですが、なんつーか精進しないとイケませんね。