レイアウトのセオリー
統一する：マージン、行間、フォントサイズなどのレイアウトを構成する要素をなるべく統一する。 揃える：位置を揃える、端を揃える、大きさを揃える。複数同じような要素がある場合は、必ず揃えて配置する。 流れを意識する：目線が始 …
Design
デザインについて
誰でも簡単にWebデザインで妥当な配色をする方法
下記の3種類の色を基本にして、他の色はなるべく使わないようにする。 ベースカラー：主に文字に使用する基本的な色（全体の50%~70%程度） メインカラー：見出しや強調させたい箇所に使用（全体の20%〜30%程度） アクセ …
黄金比よりも便利な「1/3の法則」
レイアウトや写真の構成を考える時、黄金比は計算がだるい。そのため、簡単に利用できる「1/3の法則」を使用した方が楽にいいデザインができる。 全体を9等分に分ける線を引き、各線の交点にメインとなるものを配置するようにすると …
人物写真のトリミングのコツ
関節部分で切り取らない 関節部分で切り取ってはいけず、上記の部分で切り取るのがよいらしい。
Webサイトで使用する写真の選定方法について
下記を意識するとだいたいハズレはなくなる。 よく見かける写真は使わない 自然なシーンの切り抜きを使用する（変に作り込まれたり、CGがかった写真を使うとサイトのイメージが疑わしくなる） 日本人をターゲットにする場合は、日本 …
コントラストの小話
公的サイトにおいて、お国からのお達しである JIS のアクセシビリティ規程の等級AAに到達するためには、Web上のコントラストを「4.5：1」以上の割合にしなければいけない。 1.4.3 コントラスト (最低限) : テ …
ワニとジャンプー
コンテンツの内容をわかりやすく手法として、強調したい要素とそうでない要素を区別するために 大きさを変える 色を変える 密度を変える という手法が使用される。 このうちの、「大きさを変える」ことのそれぞれの要素の比率をジャ …
（随時更新）Web上の文字をカンタンに美しくみせるテクニック集
Webデザインはタイポグラフィが90%以上。文字を美しく見せることはとても重要である。タイポグラフィのテクニックについてまとめていく。 和欧混植 和文フォントと欧文フォントで異なるフォントを組み合わせること。これにより文 …
怠惰の法則を読んだ
TakramCast 62 「怠惰の法則」https://note.com/kinya_tagawa/n/n11b74dcd3831 世の中で生き残ってきたサービスはすべて既存のものよりも便利なもの。例えば、火起こしとい …
心理学とデザイン
またデザインの話題。 心理学とデザインについて。 デザインと心理学は切っても切り離せない関係にあり、なぜならデザインはユーザーという人間の心を意図する目標に向かわせるための行為だからだ。 デザインでよく使われる心理学用語 …