「CSS3デザインプロフェッショナルガイド」はデザイナー必携本だ

HTML5+CSS3のサイト構築も徐々に増えつつあるわけですが、まだまだ日本語でのサンプルやリファレンスが少なく、「CSS3だとこれはどうしたら?」なんて場合に苦労している人も多いはず。

そんな現状を打開してくれるであろう一冊「CSS3デザインプロフェッショナルガイド」を献本というか賜本いただきました。

CSS3デザインプロフェッショナルガイド

「CSS3デザインプロフェッショナルガイド」は、7月11日発売予定の「Facebookページプロフェッショナルガイド」と同じく蒲生さん主導で進められた書籍です。

蒲生さんをはじめ、ピクセルグリッド外村さん、小山田さん、合同会社かぷっとの秋葉秀樹さん、秋葉ちひろさん、Carpal inc.の宮澤さんによる共著となっています。

“CSS3″の基本から応用まで学べる構成

この書籍の何が凄いって、基本から応用まで一気に解りやすく学べてしまう構成そのものにあるという点。

現状、日本語によるリファレンスが少ない上に、ぽつぽつとしか情報がないわけですが、それらばらけた情報をまとめ上げ、且つ深掘りしてあります。まさしくCSS3を使いこなしたいという人にとって、必携の一冊であることは間違いないでしょう。

サンプルリファレンスがごっつ豊富

こういうリファレンス系書籍にありがちなんですが、終始CSSのセレクタとプロパティを並べまくって「みんな覚えたね!」なものとは全く違って、兎にも角にもサンプルのリファレンスがすんげーいっぱい収録されています。

CSS3デザインプロフェッショナルガイド
CSS3デザインプロフェッショナルガイド

ある程度「こんなことを実現するには?」な形でまとまっているのですが、どれもこれも習得すれば応用性のあるサンプルばかりです。
ベンダープリフィックスも一目でわかるのも好印象。対応するブラウザのことも一目で把握できますよ。

CSS3はWebデザイナーこそ覚えるべきもの

CSS3はこれまでのCSSと違って、まさにWebデザイナーこそ覚え使いこなすべき言語です。

まぁ、これまでのHTML+CSSにしてもWebデザイナーが使いこなせないでどうするんだ・・・という気もしますが。(実際Webデザイナーだけどデザインしかやれないというパターンはままありますからね)

CSS3の場合、CSS3そのものがデザインを作り上げる重要不可欠なパーツとなってきます。

そのため、Webデザイナーがデザインを作り、コーダーあるいはマークアップエンジニアがそのデザインを再現するという流れになると、場合によってはデザイナーが意図しているものが反映されないことになってしまう恐れがあります。

実際、これまでのHTML+CSSでも多少こうしたことはあるわけですが、これがより顕著になる可能性が高いかなと。

簡単に言えばCSS3は画像を使うことなくグラデーションのカラーリング、リンクボタンといったものが実現できますが、画像がない状態で、グラデーションやボタンを、コーダーがデザインカンプを元にコーディングするとなると、まったく同じデザインを再現することが不可能に近いとも言えます。

繰り返し繰り返し修正をかければ、だんだんと近づいていくのは間違いないでしょうが、制作進行の視点で言えば無駄以外の何者でもないわけで。

となると、Webデザイナー自身がデザインを行い、そのデザインをCSS3で組み立ててしまったほうが、デザイナーの意図や細部のクオリティを短時間でロスも少なく完成にこぎ着けるわけです。

そういう意味では、逆にこれまでコーディングを主体としていた人が、Webデザインをきちっと学んでしまうというのもアリかもしれません。まぁこの場合、その人のデザインセンスがどんなもんかにも寄ってきてしまう気はしますけど。

いずれにしても、制作工数やクオリティの維持・向上といったところを眼目に置いて言うならば、CSS3はWebデザイナーが習得しておくに越したことはありません。ディレクター目線で言えば、むしろ習得しておいてくれないと困るくらいの感じです。

CSS3はこれからのPC向けサイトだけでなく、現状すでにシェアを伸ばしてきているスマートフォン向けサイトにおいても不可欠なものですしね。

個人的に、今後のWeb制作においてWebデザインはますます重要視されていく傾向にあると考えています。見た目だけにとどまらないデザインが求められ、なおかつそれをきちんと制作することのできるデザイナーが、会社・個人を問わず必要とされるのではないかなと。

そうなったときに、CSS3を習得・マスターしている人材が、非常に頼りになることは間違いないと思うわけです。
今のうちからマスターしてやるぞ! というやる気のある人は、是非この一冊を読んでおくといいと思いますよ。

[amazon asin=”4839935467″ type=”banner”]