６月１０日

サイト全体のCSSでは、影、角丸、グラデーションを使うだけで見た目の印象が大きく変わる。特に、記事カードに影を付けると要素が浮いて見え、画像に角丸を付けると柔らかい印象になる。ボタンにグラデーションを使うとクリックできる場所が分かりやすくなる。

・ただし、すべての要素を派手にしすぎると、どこを見ればよいのか分かりにくくなる。見出し、画像、カード、ボタン、リンクのすべてに強い影や派手な色を使うと、画面全体がうるさく見える。読者の視線が分散して、記事本文を読む邪魔になる可能性がある。

・目立たせる場所と落ち着かせる場所を分ける必要がある。例えば、見出しは目立たせてよいが、本文は読みやすさを優先する。ボタンはクリックしてほしい場所なので目立たせてよいが、普通の文章リンクまで派手にしすぎると見づらくなる。画像は記事の雰囲気を伝える重要な要素なので影や角丸を付けてよいが、地図やアイコンまで同じ演出にすると不自然になることがある。

・影を使うときは、強すぎる影を多用しないようにする。影が濃すぎると、ページ全体が重く見える。記事カードや画像など、浮かせたい要素だけに使うと効果的である。逆に、すべてのブロックに影を付けると、どの要素が重要なのか分からなくなる。

・グラデーションはサイトの印象を一気に変えられるが、使いすぎると読みにくくなる。背景、見出し、ボタンのすべてに強いグラデーションを入れると、色が多すぎてまとまりがなくなる。基本的には、サイト全体の背景は淡く、見出しやボタンは少し強めにするくらいが扱いやすい。