Webデザイナーの必須の知識としてはHTMLやCSS、javascriptなどが挙げられます。
今回はそれらの中でもCSSに関する記事です。
CSSは普通のプログラミング言語と比べると非常に簡単で、本を1,2冊こなせばすぐにある程度は書けるようになります。
しかし、それは”ある程度”に過ぎません。
最初のうちはそれだけで問題ないかもしれませんが、何個もWebサイトを作ったりしていくうちに、その”ある程度のレベル”では物足りなくなります。
もっと見栄えのいいWebデザインを行いたいと思った際に、CSSの技術を上達させる必要が出てきます。
もちろんJavascriptやjQueryでWebサイトに動きをつけることで、それなりのWebサイトは作れますが、
もっとおしゃれなものを作りたいのであれば、CSSに立ち返る必要があります。
今回は、CSSはある程度使えるけど、もっとCSSの技術を上達させたいと思っている方向けに、その上達方法を紹介します。
Contents
１、CSSを上達させるための方法①
CSSを上達させるためには、大きく分けて二つの方法があります。
まず最初に紹介する方法が、模写です。
具体的な方法としては、まずおしゃれだなと思うWebサイトを一つ選びます。
そして、そのWebサイトの中で最もおしゃれだと思うページを選びます。
基本的にはそのWebサイトのトップページがおすすめです。
なぜならトップページはどこのWebサイトも最も気合を入れて作っているからです。
どのサイトを模写するか決めたら、あとはひたすらそのWebサイトを模写していきます。
HTMLとCSSを駆使して、できるだけそのサイトにそっくりのデザインのサイト(１ページのみ)を作ってみてください。
やってみれば分かると思いますが、模写はかなり大変です。
今まで自分のもっていたCSSの知識や技術では太刀打ちできない部分等が出てきます。
これがまさにあなたのCSSの能力を上達させるために最も重要です。
今までのあなたの知識や技術ではできない部分は、必ずグーグルで検索してそのやり方を調べてください。
こうすることであなたのCSSの知識や技術はまた一段階うえにいくことができます。
また、どうしても分からない際には、あまり悩み過ぎずそのWebサイトのソースコードを実際に見ましょう。
ブラウザはChromeを使っている場合、そのWebサイト上で右クリックを押し、”検証”というボタンを押せばそのWebサイトのソースコードを見ることができます。
いわゆる模写の答え合わせをすることができます。
Webサイトの模写は結構大変ですが、間違いなく力はつきます。
最初のうちは数週間に一サイトなどしかこなすことができないかもしれませんが、それでも間違いなく徐々にあなたのCSSの能力は初心者や中級者を脱して上級者に近づいていきます。
これがCSS上級者を目指すための一つ目の方法です。
２、CSSを上達させる方法②
続いて紹介する方法は、本を使った勉強方法です。
CSSに関する本の多くが初級者向けの本ですが、探してみると中には中級者や上級者向けの本もあります。
今回はそんな本の中でも、特におすすめな本を２冊紹介します。
目的によって使うべきかどうかが違うので、やみくもに全ての本をこなす必要はありません。
自分の目的に合った本を選んでください。
2-1、『CSSシークレット 47のテクニックでCSSを自在に操る』
まず最初に紹介する本が、「CSSシークレット 47のテクニックでCSSを自在に操る」という本です。
こちらは、初心者のための本ではなく、あくまでCSSを今までに学んだことがあり、最低限の知識は身についている人向けの本です。
CSSの上級者になるためには必須の一冊と言っても過言ではありません。
初心者向けの本に載っていることはほとんど載っていませんが、初心者向けの本しか読んだことがない人にとっては目からウロコのようなCSSの技術がいっぱい載っています。
もちろん、この本に載っている全ての技術を一度に使うことはないと思いますが、この本に載っている技術を知っておけば、間違いなくCSSでできることの幅がかなり広がります。
理想としては、この本をこなした後、それを参考にしながら模写をしていくのがおすすめです。
ですが、そんなに時間を取ることができない場合は、とりあえずこの本だけをこなしておくべきです。
CSSを上達させるための本としては、最もおすすめの一冊です。
2-2、『Web設計者のためのCSS設計の教科書』
次に紹介するのが「Web設計者のためのCSS設計の教科書」という本です。
先ほど紹介した本とはかなり毛色が違います。
こちらの本は、より保守しやすい、修正しやすい、再利用しやすいCSSを書くための方法をマスターするための本です。
一度でも自分自身でCSSを書いてWebサイトを作ったことのある方であれば分かると思いますが、一度書いたCSSを後から修正したりするのはかなり大変です。
どこに何を記述していたのか、クラス名はどのようにしたのか、などを思い出しながら修正していく必要があり、これはかなり大変な作業です。
この本では、それらを改善するための知識を身につけることができます。
今までやみくもにCSSを書いてきた人は絶対に読むべき本です。
ちゃんとCSSの書き方を最初から決めて設計すれば、CSSを書くのもかなり効率的になりますし、より保守しやすいものを書くことができるようになります。
仕事でCSSを使うのであれば、これらの知識は必須です。
この本はかなり実用的なので、上級者を目指す人は一度目を通した方がいいと思います。
おわりに
今回はCSS中級者に向けた、CSSを上達させる方法を紹介しました。
理想としては、本を読み進めながら、その本で学んだことを使って模写するのが最も上達する方法です。
是非皆さんも試してみてください。