今、HTML5とCSS3で必要とされる知識・テクニックをどのように使うか、その考え方も分かるオススメの本
Post on:2016年11月11日
スマホ向けのWebサイトが普及し始めた数年前から、HTMLとCSSの書き方は大きく変わりました。HTMLのタグやCSSの機能が変わったわけではありません。デスクトップとスマホの両方に対応するためには、それまでとは異なる考え方で実装する必要があります。
この「考え方」について重点が置かれ、HTMLの組み方からCSSの実践的なテクニックまで、基礎から詳しく解説されたオススメの本を紹介します。
一見、完全な入門書のように見えますが、初心者だけでなく、中級者にもお勧めしたい本です。基礎知識の解説は一通りシンプルにしっかり解説されており、知っている人は復習がてらさっと見て、知らない人は過不足なく学べます。
最新のHTMLとCSSの書き方、日本語の文字、コンポーネント、Flexboxを使ったレイアウトなどをどのような考え方で実装するのか、実践的な知識・テクニック・考え方を整理し、身につけることができます。
Kindle版は、お値段が少しお得です。
そんな紙面をキャプチャで少しだけ紹介します。
本書は10章構成で、1章では制作を始める前に知っておきたい基礎知識、2-9章ではHTMLとCSSを、最後の10章ではサイトを実際にします。
1章ではWebの概要、制作環境などを確認しておきましょう。
2章からいよいよ、本番です。
HTMLを書くために必要な基礎知識を身につけ、実際の例を見ながら実装方法を学ぶことができます。
基礎知識はどの本でも大差ないと思いますが、本書では考え方も詳しく解説されているのが大きな特徴です。考え方を理解することで、例にはでてこない実装、新しい技術に対応するときでもきっと役立つと思います。
CSSも単に基礎知識を学ぶだけでなく、適用する手順や考え方が大切です。どういうプロセスでそうするのかが分かります。
4章以降は各要素・コンポーネント単位で実装を学んでいきます。4章では読みやすい行間の作り方、システムフォントやWebフォントを使ったフォント設定など、実務で役立つテクニックも満載です。
コンポーネントやページのレイアウトでよく使うのがdiv要素です。情報をグループ化してまとめ、整理する要素の代表格と言えるでしょう。ただし無意味に使用していると、divだらけになってしまうことがあります。
フォームの実装が苦手、という人も少ないないと思います。フォームで使用する各要素のデスクトップ・スマホでの実装を学ぶことができます。
9章では、レスポンシブ対応のレイアウト・ナビゲーションを例に、実践的なコーディングについて学びます。
2カラム・3カラムのレイアウトやナビゲーションはFlexboxを使った実装で、Flexboxについても基礎からやさしく解説されています。
最後の10章ではここまで学んだ知識・テクニックを使い、実際のWebサイトを作成します。
本書で使用されているサンプルデータは専用サイトからすべてダウンロードできます。
いちばんよくわかるHTML5&CSS3デザインきちんと入門の目次
- Webサイトの仕組みを知ろう
- HTMLの基礎知識とマークアップの実践例
- CSSの基礎知識とページデザインの実践例
- テキストの装飾
- リンクの設定と画像の表示
- ボックスと情報の整理
- テーブル
- フォーム
- ページ全体のレイアウトとナビゲーション
- レスポンシブWebデザインのページを作成しよう
知識やテクニックも大事だと思いますが、もっとも身につけるべきなのは「考え方」です。知識やテクニックはぐぐれば、分かります。もちろん一冊にまとまっているだけでも便利ですが、その知識やテクニックをどのように使うかが重要です。
学ぶべきことがきちんと解説されている一冊です。
献本の御礼
最後に、献本いただいたSBクリエイティブの担当者さまに御礼申し上げます。
当サイトでは随時、献本を受け付けています。
お問い合わせは下記よりお願いいたします。
sponsors