CSS Nite ＠Co-Edo, Vol.17参加レポート！レスポンシブWebデザイン実装時に必要な手法や注意点など - Design Color
CSS Nite ＠Co-Edo, Vol.17参加レポート！レスポンシブWebデザイン実装時に必要な手法や注意点など 2018 1/03 レスポンシブWebデザインとは PC、スマートフォン、タブレット…最近は本当に色々な種類のデバイスがあります。それらの数多くのデバイスにワンソースで対応する技術が「レスポンシブWebデザイン」です。具体的には、閲覧しているデバイスの画面サイズに応じてサイトのレイアウトを切り替えてくれるというもの。 例えば以下のサイトでは画面幅が変わるごとにレイアウトとおじさんの顔が変化するという面白い作りになっています。 Hello Fisher 他にPCサイトを各デバイスに対応する方法としてはPHPなどで表示を切り替える方法がありますが、そうなると各デバイス用のデザインやソース、画像を新たに用意する必要が生じてきます。 もちろん、何も対応しなくても各デバイスからPC
私が初めてブログのデザインをした時の流れ - Design Color
もくじ 「ブログらしいデザイン」を知る デザイン前に手描きでワイヤーフレームを作る 配色はツールにお任せ【Kuler】 デザインにぴったりなフォントを選ぶ【Nexus Font】 おまけ：どこかひとつに「おっ」と思わせるしかけを 「ブログらしいデザイン」を知る 以前に「ポータルサイトのデザインをする時に意識したこと5つ」という記事を書きましたが、「ポータルサイトらしいデザイン」や「ブログらしいデザイン」というように、サイトによって「向いているデザイン」も変わってきます。 ブログの第一の目的は「記事を読んでもらう」こと。なので、デザインにとりかかる前にまず「記事を読んでもらえるようなデザイン」とはどういうものかを調べました。また、たくさんのブログのレイアウトを観察しました。 こちらの記事が参考になりました！ [非Webデザイナー向け] カッコイイブログを最速でデザインするための簡単 5 ステ
ポータルサイトのデザインをする時に意識したこと5つ - Design Color
もくじ グローバルメニューを埋れさせない 色を使いすぎない 余白を空けすぎない 囲み線を多用・強調しすぎない サムネイルに黄金比や白銀比を使ってみる 1.グローバルメニューを埋れさせない ポータルサイトは情報量がとても多いです。ユーザーを迷わせないためには、画面が遷移しても変わらずそこにいてくれる「グローバルナビゲーション」は頼りになる存在です。それが他の情報に埋れてしまってはもったいないですよね。なので、デザイン時にはまずこの子に注目してみました。 白抜きのメリット 色々なサイトを観察していると、ナビゲーションバーに白抜きを使っているサイトが多く見られました。 調べてみたところ、白抜きは小さな文字でもやや大きく見えるというメリットがあるとか。なぜなら、白は「膨張色」だからです。 膨張色とは明度が高いことから、他の色に比べて膨らんだり広がったり錯覚する色のことです。白や明度の高い暖色系が膨
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
