LIFE is 日々一歩(90)[ウェブ]2018年に買ってよかったウェブ制作を学ぶ本(1)/森 和恵

投稿:  著者:  読了時間:6分(本文:約2,700文字)


こんにちは。森和恵です。もう1月も下旬ですね。しっかりしないとあっという間に今年も終わってしまいそうです。

さて。今回は「ウェブ制作を学ぶためのオススメ本」についてお話しします。インストラクターという職業がら、書籍をたくさん購入するのですが、実際に買ってみてよかったと思うものをいくつかピックアップしてみました。タイトルに(1)とついているのは、シリーズ化しようかなと思っているためです。



●Adobe関連の書籍

まずは、昨年10月に出版した著書から紹介しますね。

【世界一わかりやすいIllustrator & Photoshop & XD Webデザインの教科書】
https://www.amazon.co.jp/exec/obidos/ASIN/4297100320/dgcrcom-22/

おかげさまで売り上げも好調で、読んでいただいた方の感想も好評でした。初学者用の書籍ではなく、これまでソフトを使ったことのある方に向けて書いた本です。

わりと古めのバージョンから最新のCCバージョンに乗り換えて、ソフトを起動してみたら変わってて、浦島太郎状態になっている方が「最新バージョンならではの使い方」を見ていただけると思います。

クラウド上に素材を保管する「CCライブラリ」を利用して、各ソフトを連携しつつ作品を仕上げていく機能は必見です。

続いては、Adobe XD関連で12月に発売されたばかりの書籍。

【Adobe XD プロトタイピング実践ガイド ~ユーザーの要求に応えるUI/UXデザイン】
https://www.amazon.co.jp/exec/obidos/ASIN/4297103567/dgcrcom-22/

プロトタイプを作成する部分に特化した書籍で、こちらも初学者向けというよりは、基礎を学んだ後に読んで実践力をつけるタイプです。

ウェブサイト制作におけるプロトタイプは、本制作前に作る試作品の役割があり、クリックやドラッグの操作で画面が切り替わって遷移する必要があります。

ラフにコーディングしてプロトタイプ版を作ってもよいのですが、やはり時間がかかります。

Adobe XDでは、静止画をつなぎ合わせてプロトタイプを制作するため、従来のデザインカンプ作成と同じぐらいの手間しかかかりません。

この書籍では、まず「プロトタイプとは何か? どういう役割があるのか?」という概念の説明から入り、その後にAdobe XDでの操作説明になります。

また、最終章のケーススタディでは、実際に動くプロトタイプを作りながら、制作フローを学びます。単なるソフトの操作説明ではなく、「プロトタイプ」についてしっかりと学べるのがオススメポイントです。

●コーディング関連の本

ウェブ制作の界隈では、最近コーディングの話題はあまり出てこなくなりました。ブログ記事やニュースでも、HTMLやCSSについてはめっきり減っています。

ですが、HTMLもCSSもどんどん進化していて、HTMLは5.2にバージョンアップしたり、CSSも新しいプロパティや属性が増えています。

という私も、しばらくきちんと調べていなかったので、去年の秋ぐらいから少しづつ勉強を始めました。

急務なのが、CSSの「フレックスボックス」と「グリッドレイアウト」です。これらは、従来のフロートレイアウトとまったく異なる方法を用いる、ウェブページのレイアウト手法なのですが、各ブラウザの表示に対応させた正しい書き方がなんなのか、調べるのに骨が折れます。

最近いきなり登場したわけではなく、昔から改訂を繰り返しているので、古い記述方法が混じっているのが原因です。

ウェブページのコーディングを学ぶときは、「エビスコム」さんの書籍に助けられることが多いのですが、去年・今年とよい本が2冊出ていました。

【CSSグリッドで作る HTML5&CSS3 レッスンブック】
https://www.amazon.co.jp/exec/obidos/ASIN/4802611897/dgcrcom-22/

今月発売されたばかりの書籍です。初学者に向けた内容になっていて、HTMLやCSSの基本についてもしっかり学べます。

HTMLの基本では、
などのセマンティックコーディングについてもしっかりとまとめられています。CSSでは「CSSの記述ルール」や「レスポンシブとは何か?」という部分まで掘り下げて解説されていて安心です。ウェブページをコーディングする工程を、追いかける形式になっています。

【HTML5&CSS3ステップアップブック】
https://www.amazon.co.jp/exec/obidos/ASIN/480261134X/dgcrcom-22/

一年前に発売された書籍です。基礎を学んだあとに「フレックスボックス」と「グリッドレイアウト」を学ぶための書籍になっています。こちらも、段階を追ってウェブページをコーディングする、ステップ・バイ・ステップ形式になっています。

最終章では「ブロークングリッド」と呼ばれている、雑誌風のレイアウトに挑戦していて、単にグリッドでマス目に並べていくだけのレイアウトから一歩進んだテクニックが学べます。

エビスコムさんは、著書のロードマップをまとめていらっしゃいますので、参考にしてみてくださいね。

【エビスコムの本のロードマップ エビスコム】
https://ebisu.com/roadmap/

最後に紹介するのが、Bootstrapの書籍です。

【Bootstrap4ファーストガイド―CSS設計の手間を大幅に削減!】
https://www.amazon.co.jp/exec/obidos/ASIN/487783432X/dgcrcom-22/

ここ数年で販売されたBootstrapの書籍はすべて読みましたが、この書籍が一番役に立ちました。「あの機能はどうだったかな?」を調べると、かなりの確率で掲載されていて、辞書的に便利な本でした。

というわけで、今回は手元にあった5冊を紹介してきました。最後まで読み切った本をピックアップしたのですが、本当にオススメです。買ってよかったなと思います。

私はヘビーな電子書籍ユーザーで、これまでに購入した書籍は4,000冊程になると思うのですが、最近また「紙」で買うことが増えています。

何度も繰り返し調べるのに手元に置いている本は、電子書籍だと検索性が悪いのです。やはり、付箋を直接はったり、紙をめくって覚えたりすることの大切さを改めて感じています。

ではまた、次回お目にかかりましょう!
(^^)

【森和恵 r360studio ウェブ系インストラクター】
mail: r360studio@gmail.com
YouTube: https://www.youtube.com/r360studio
サイト: http://r360studio.com/