HTMLとCSSは学んだ。で、どうやってWebサイトを作るの？という人のための本 #教科書では教えてくれないHTML&CSS
Webサイトを作るとき、HTMLやCSSについて学ぶ人は多いでしょう。私もその一人。色々な本を買い、HTMLのタグやCSSについてある程度の知識は手に入れました。
しかし、実際にWebサイトを作ろうと思うと、どこから手をつければいいのかわからないです。確かにタグは知っているので、他のサイトをコピーしてところどころ変更して作ることはできるのですが、一からデザインしようとすると難しいもの。
デザインのセンスがないので、結局は他のサイトをコピーしたり、BootstrapなどのCSSフレームワークを使ったりして、テンプレートのデザインをそのまま使って作ってしまうことも。そんな人にオススメなのが今回の『教科書では教えてくれないHTML&CSS』です。
ゼロから作ることの大切さ
現在は便利な世の中で、HTMLやCSSのテンプレートはたくさん公開されています。そして、冒頭にも書いたようにCSSフレームワークがあるので、ちょっと見栄えのするデザインを作ることも簡単になりました。
しかし、これでは「既存のサイトと似たデザイン」のサイトができあがってしまいます。せっかくWebサイトを作りたいのに、オリジナルのデザインではなく他のサイトのコピーになってしまうのは残念なもの。
そんなとき、この本では表紙の下に書かれているように「ゼロからコーディングする」ことを一冊を通して解説されています。
このときに難しいのが、Webサイト全体での統一感を出すことです。CSSフレームワークを使えば簡単に統一感は得られますが、ゼロから作ると個別に指定するのが難しいもの。
この本では、ページを「コンテナ」に分けて、それぞれをパーツとして組み合わせてWebサイトを作っていく方法が採られています。これにより、ページ全体の構造を意識しながらデザインを進められるようになっています。
構造とデザインの分離がわかりやすい
HTMLやCSSを学ぶと必ず登場する言葉に「構造とデザインの分離」があります。HTMLでは構造を表現し、CSSではデザインを表現する、という考え方ですが、慣れないとHTMLでデザインまで指定してしまいがちなものです。
しかし、この本ではヘッダーとフッター、本文の構造をきちんと分離し、順序よく学ぶことができます。どういう考え方で、どこにデザインの指定を書けばよいのかがよくわかるのです。
複雑なデザインや、レスポンシブデザインなどの場合も、具体的な手法が書かれているため、目的に応じた「逆引き」の感覚で「こういうことをしたいときはこうする」というのがよくわかります。
デザインをダウンロードできる
わかりやすいけれど、ゼロから入力するのは面倒、という場合も、この本では解説の中で使われているデザインデータをサポートページからダウンロードできます。
プロが作ったデザインを使えるため、見栄えのするWebサイトを簡単に作れるのです。個人的にも試してみたいと思えるような、発想が広がるデザインが多いので、これからも役に立ちそうです。
サポートページは以下からアクセスできます。
まとめ
デザインに自信のない私はいつもCSSフレームワークに逃げてしまうのですが、この本を読んでゼロから作ってみたいな、と感じる本でした。そして、実際に手を動かしてみると、CSSについて知らないこともまだまだあると感じました。
これまでにHTMLやCSSを学んだけれど、その知識を活かせていないという方は、ぜひ手に取ってみてください。
この記事が気に入ったらサポートをしてみませんか？