配色、デザイン、文章、写真、センスがないとあきらめる前に勉強しよう！

ということで、センスを言い訳にしてしまいがちな分野の基礎を学べるすばらしい記事を集めました。この記事自体単なるまとめ記事ですが、できるだけ厳選し、読んでほしい順に並べました。皆さん、あきらめずに一緒に勉強しましょう。

配色

アクセントになる色を使うのが苦手で、同色系の色ばかり使ってしまうのですが、これらを読めば恐れずに使えそう。

色彩センスのいらない配色講座

ベースカラー、メインカラー、アクセントカラーに分類してどのような色を選ぶべきか分かりやすく解説してくれています。具体例もあって分かりやすいです。

配色パターンからWebデザインを考える | Webクリエイターボックス

色が与える印象を具体例を踏まえて説明してくれています。サイトの目的に合わせて適切な色が使われているのが分かります。

配色初心者でも効果的なカラーデザインが出来るようになる4つの工程 / Maka-Veli .com

色に対する印象やアクセントカラーの決め方など、色を決める手順が紹介されています。

デザインの基礎

デザイン、レイアウトなどの基本を丁寧に説明してくれています。

デザインの基礎力をワンランクアップしたい私︵Webデザイナー︶の注意書き

レイアウトの基本や図版率、ジャンプ率など初心者には聞きなれない言葉など幅広く親切に紹介されています。

良いデザインって？技術を学ぶ前に知っておきたいデザイン・レイアウトの基本的なこと | 秋田県webデザイナー︻weblog︼

サイトの目的やターゲットによってどのようなデザインにすべきかを、基礎から詳しく説明されていています。

[Webデザイン] 文字組みについて本気出して考えてみた | Stocker.jp / diary

細かいところですが、実践すると印象もかなり違ってきます。﹁括弧﹂を細くとか﹁円﹂を小さくっていうのは、知ってるか知らないかだけで別にセンスの問題ではないので、ちゃんと勉強しておきたいです。

デザインの基礎、黄金比から大和比、第2黄金比まで : Web Design KOJIKA17

普段全くしにしていないですが、洗練されたデザインだなと思ったサイトをよく見てみると、ここで紹介されている比率になっていたりします。取り入れるとデザインが安定するかもしれないです。

細部にこだわったデザイン

ちょっとした線や影を追加するだけで全然印象が変わってくるという

少しの手間で大きく変わる、細部にこだわったWebデザインを | Webクリエイターボックス

1pxの線や小さな影などちょっとしたことで全然印象が変わってきます、ということを実際のサイトで解説してくれています。

素人っぽいデザインから脱却するための12のデザインチップス | webox blog

先ほどのものと似た内容でご本人はご謙遜されていますが、こちらも実例があってすごく分かりやすくていいです。

Webデザインにおける、1pxへのこだわり « Parkn' Park

すごい細かいところにまで注目されています。おもしろいです。

文章

文章を書くのって昔から本当に苦手なんですよね。これも、デザインと一緒で様々なルールや技術があります。

読みやすい文章を書くための技法 - #RyoAnnaBlog

読みやすい文章を書くうえで知っておきたい技法がたくさん紹介されています。知らず知らず使っていることも多いですが、効果を知ったうえで使えばよりよい文章になると思います。

驚くほど違う→あなたの文章を最適化するたった4つのルール 読書猿Classic: between / beyond readers

論文用に書かれた記事ですが、分かりやすい文章を書くという意味ですのでどこでも使えます。例が多くて分かりやすいです。

﹁シンプルな文章の書き方﹂ ― 読まれなかった文章をカイゼンしてわかったこと : earth in us.

シンプルって逆に難しく感じるんですよね。

人を惹きつけ人を動かす文章を書く方法　初心者にもわかるコピーライター養成講座　～言葉で世の中を動かそう - プログラマーkkの勉強/成長ブログ@ライブレボリューション

奥が深いです。ブログのタイトルにも役立ちます。

写真撮影

画像があるのとないのではサイトの印象は全然違いますね。普段素材サイトの写真を使わせていただいていますが、自分で撮るとどうしても素人っぽくなります。

素人から脱却するデジカメの撮り方テクニック集 | nanapi[ナナピ]

様々な状況に合わせたテクニックがたくさん紹介されています。

写真がうまくなりたい？﹁ひとつ上の構図﹂を目指すための9のTips | IDEA*IDEA

サンプル写真があって分かりやすいです。写真の一部を切り取って使う場合なんかも使えます。

写真がうまくなる36の法則 - ライフハックブログKo's Style

いろんなサイトを見てお勉強

これらを学んでから色んなサイトを見ていると、﹁このサイトよく考えられているな﹂と感心することも多く、勉強になると思います。

ということで、個人的によくみるギャラリーサイトを3つ紹介しておきます。

WEBデザインの見本帳｜WEBデザイナーのためのデータベース・リンク集、サンプル・配色・参考・ご提案に!!

1ページに載せられているサイト数がかなり多いです。クリックすると大きめの画像になります。

Webデザインギャラリー | I/O 3000

ページの移動なくどんどん見られます。クリックする必要はありますが、オートページャーみたいな感じです。

WEBデザインのクリップ・リンク集｜Web Design Clip ︻Webデザインクリップ︼

細かく分類されているので、探しているタイプのサイトが見つかりやすいかも。

まとめ

﹁センス﹂なんて結構あいまいな言葉で、生まれ持ったみたいなイメージがあるので言い訳に使われがちだと思います。

けど、何事においても自分で限界を決めてしまうと成長しないと思います。

今回紹介した﹁読みやすい文章を書くための技法 - #RyoAnnaBlog﹂より。