初心者のレスポンシブWebデザインならこの一冊  HTML5&CSS3デザインブック

HTML5&CSS3デザインブック (ステップバイステップ形式でマスターできる)

そろそろ無視できなくなってきたWebのモバイル最適化のために買って読んでみました。

まず最初に勘違いがあるといけないので書いておきますが、この本はタイトルが勘違いを誘発するモノになっています。

本書では「HTML5&CSS3デザインブック」というタイトルですが、内容にhtml5のタグの説明やcss3のプロパティについて説明するようなことはありません。

上の画像の中段やや下に「レスポンシブWebデザイン」と書かれていますが、こちらが正しいタイトルです。

私はたまたまAmazonのレビューでそれを確認できたので良かったですが、これは間違えて買う人がいるのも仕方ない、といいますかこのタイトルの付け方には少し悪意のようなものを感じなくもないですね。

気をとりなおして内容については、正直なところ新しい発見はありませんでしたが、想像していたものの確認になった、という感じです。

これは私が普段からそれなり程度にはWeb制作界隈にアンテナを張っていたので知識があり想像していたからですので、「htmlタグは知っているけど、まだサイトは1,2個ぐらいしか作ったことがない」という方には最適な一冊だと思います。

特に従来のdivを使った方法をまず提示し、それをhtml5で書きなおしながらという本書構成は初心者には特にわかりやすいと思います。

レスポンシブWebについては大きくわけて2パターンあると私は思っています。

ひとつはhtmlに対して完全にPCとモバイルで2つのcssファイルでデザインを分離する方法。

もうひとつはPCかモバイルのcssを最初に書いて後からもうひとつのデバイス向けの部分のみを適宜再定義したり変更する方法。

前者だと言ってしまえば2つデザインを作るようなもので手間はかかりますが、cssの共用部分が無いのでスムーズに装飾管理できます。

後者だとデザインは1つだけのようなものですが上手にcss管理をしないと、こっちのcssを書き換えたらあっちが、あっちを変えたらこっちが、の状態に陥るリスクがあります。

本書はこの後者の方法で紹介しているので、最初に手間がかかってもバグ率を減らす思考の私とは方向性が違った感は否めませんでした。

でも、たしかに2つ、解像度対応の幅によっては3つcssを書くというのは作業時間的に難しいのも事実ですので、落とし所がいまいち掴みきれていない感じです。

ブログ程度であれば2つ用意したほうが良い気がしますが、大規模サイトだと悩ましいものがありますね。

いっそ、「モバイルのデザインをPCでも見れる」というモバイルファーストの考えでやれれば楽は楽ですが、PCで見た時にどこかチープになってしまいますし・・・。

スマホが発売された時は「やっとこれでPCサイトだけでいける!」と感動したものですが、まさか今日のようにモバイルサイトとPCサイトの分離どころか中途半端なハイブリッド状態に陥って余計に面倒くさいことになるとは思いませんでした・・・。

このレスポンシブWebの考え方だと営業マンも価格をのせられなくて厳しいでしょうね。中途半端な知識のある人はワンソースでいける!と思って無茶を言ってきそうです。こっちのほうが2つサイトをつくるより遥かに技術力いりますけどね。


これならいっそガラケーとPCサイトの時代のほうがビジネス的には良かったのかもしれません。

かなり話が横道に逸れてしまいましたが、これまで特に情報収集をすることもなかったhtml初心者の方の「レスポンシブweb対応」には、本書の構成はわかりやすくて良い本だと思うのでぜひ一読されてみてください。