ホワイトスペース使ったウェブデザインの考え方

ウェブサイトの要素をレイアウトをする際に非常に重要な ホワイトスペースの考え方について、すこしまとめてみました。 私が人にウェブデザインを教えるときは、まずここから始めます。 boxとboxとの空間の開け方、要素と要素の「間」は、音楽でいうところの「リズム」だと考えています。 リズムが整っていれば、他の要素が主張したことが上手に伝わります。 リズムが整っていなければ、けんかしあい、不協和音＝見づらい状況を作り出します。 自分なりのリズムを見つけていけば、それが個性・ジャンルになるのです。 どれが間違っている、というお話ではなく、どんな風に感じたかを大事にして読んでみてください。 とてもとてもシンプルな例を出してみます。 AとBを比較してみてください。 どちらのほうが読みやすいように感じますか？ どんなふうに感じましたか？ この例では、Bのほうに大きな余白を与えました。 ４隅すべて同じぐらい

[mizukemuri]

「ホワイトペース使ったウェブデザインの考え方」と読んだ自分はもうダメだ

[ku_marin]

余白大事。

[ktakegawa1]

余白について

[forsuccess4]

webデザイン

[gurimmer]

ホワイトスペースからの視点って考えたことなかった。これとこれを区別したいからスペースをあけるって考え方だったから。

[suikomiman]

余白 レイアウト

[unitro]

記事の美しさが内容の説得力を増している

[kosigan]

Webに限らず、余白の取り方で印象が変わる

[etcheverry]

製作,勉強,資料

[indigoworks]

グラフィックデザインができてる人は、こういうのちゃんと出来てる。コーディングにしか興味ない人はできてないイメージ。ただwebの特性考えると余白大きいのってスクロール量増えるから考えもの

[saka39]

“余白を変えると、雰囲気が変わります。”

[YKKT]

　ウェブサイトの要素をレイアウトをする際に非常に重要な ホワイトスペースの考え方について、すこしまとめてみました。

[cha_m]

メモ

[deg84]

俺の場合は、line-heightは基本1.5にしてる。文字サイズやpaddingなどの値を見て、変えるけど。

[tsuki-rs]

どういうふうに工夫してすっきりさせるか。

[ichigaya555]

ギッチギチに詰め込むデザインが多くて息苦しい昨今

[premyth]

この例だと読みにくいのは余白のせいではなく、ボックス幅とかフォントサイズとか別要素の影響が大きいと思うの

[sivadselim]

バニデザノート - ホワイトスペース使ったウェブデザインの考え方

[harumomo2006]

しかし業務で作るサイトに空白を入れると「ここにあと1行入るじゃないか、ちゃんと仕事しろ」と言われたりする。デザインに興味のない人に空白の価値を説明するのは困難

[pistaro]

わかりやすそうなまとめなので、あとでじっくり読んでみよう。余白大事だよね。

[drakontia]

余白にもリズム。 > バニデザノート - ホワイトスペース使ったウェブデザインの考え方

[yocchi24]

余白は大事。Excelで表つくるときも適度にセル内に余白もたせたほうがいいよ。それだけで一気に表がみやすくなる。

[hajimechan0323]

デザインってホントに奥が深いよね。毎回こういう風に考えられてコンテンツのデザインが決まっていると思うと驚くよ。

[warriorking]

バニデザノート - ホワイトスペース使ったウェブデザインの考え方

[al001]

最初の例だけAの方が好き。不思議。！最初の例だけ、AとBの情報量が違う。

[invent]

line-height

[sakirin0421]

講師してた時、生徒ちゃんはこういった事を学びたかったんじゃないだろうか。基礎だけどすっごい大事と思う。

[caraldo_k]

こういう内容を文章に出来るのが凄いと思う。

[jayase]

余白の効果的な使い方について。おさらい。

[lastel]

(ノ)･ω･(ヾ)ばにばにっ

[hiroshi_revolution]

バニデザノート - ホワイトスペース使ったウェブデザインの考え方