岐阜県なんちゃってブロガーyossyの書き綴るブログ。[公開記事480件/2016年11月27万PV]

カテゴリー

固定ページ

本レビュー|CSS3&jQueryで作る スマートフォンサイトUI図鑑

yossy'sイチオシ記事セレクション

名古屋散策した時にジュンク堂書店(ロフト名古屋店)で購入した本『CSS3&jQueryで作る スマートフォンサイトUI図鑑』が長らく未読の状態が続いていたので、重い腰を上げてようやく今月になって本を開いてお勉強しはじめまして、今日ようやく完読したので、この本のレビュー・感想を書こうかなと。

『CSS3&jQueryで作る スマートフォンサイトUI図鑑』の概要

本のタイトル通り、CSSとjQueryを用いてスマートフォンサイトで使ういろいろなUI(ユーザーインターフェイス)の作り方を実例を実践しながら学ぶことができる内容になっています。
特にスマートフォンサイトのデザイン・実装に欠かせない定番のいろいろなUIが紹介されています。

最近あまりWEB制作のスキル的な事のお勉強をやっていなかったので、脳みそをフル回転でどうにか完読できた感じですね。
サンプルデータを使ってCSS&jQueryをエディタで実際にコード書きながら、本で紹介されている全サンプル(43個)を順番に読み進めていきました。
なんだかんだで完読するのに2週間ぐらいはかかりました。ん~よく頑張ったよ、自分(笑)

完読してみての感想はというと、脳みそフル回転した分、スマホサイトを制作するスキルというか引き出しが結構増えました(^_^.)
スマホサイトを制作する場合、画面の幅がPCと比べると小さいし、マウではなくて手でタップしたりスワイプして使う感じになるので、PCサイトとは違う制作スキルや考え方が必要になったりするんですけども、この本ではスマホサイト制作で必要だったり便利なCSSやjQueryの使い方・使いどころが多くの事例を使って紹介・解説されています。

具体的には、定番中の定番のハンバーガーアイコンを使用したナビゲーションバーやスライドバーなどの作り方、アコーディオンパネル、スライドメニュー、FontAweSomeを使用した各種アイコンの表現、インフィニットスクロール、タブパネル、カルーセルパネル、モーダルウィンドウ、フォトギャラリー、ポップアップムービー、Google Maps APIを使用したGoogleマップ、などなど、計43個のスマホUIの実サンプルデータで学ぶことが出来ます。
トリッキーなものはほとんどなくて、スマホサイトで定番で使われているよく見かけるUIがほとんどなので、実用性も高い制作テクニック・ノウハウを習得できると思います。

自分の場合、jQueryの基本的な事はうる覚えながら多少習得済みだったので、良い復習にもなりましたし、新たにjQueryの記述方法を学ぶ事も出来て、ちょうど良い内容でした。
本の難易度的にはjQueryを全く触った事がない人にはちょっと難しいかもな内容なので、そういう方はjavascript・jQueryの初心者向けの書籍(よくわかるJavaScriptの教科書など)から始めた方が良いかもですね。
jQueryの基本的な事がやれる人なら、この本の内容は簡単すぎず、難しすぎずでちょうど良い内容だと思うので、そういう方には特におすすめの本だと思います。

この本で習得できるスマホUIの実例

この本で習得できるスマホUIの実サンプルがどんなものなのかというのを、本でも紹介されていた実際のサイトURLで紹介したいと思います。
しっかり習得すれば、スマホサイトで人気のUI・定番のUIデザインを自作できるようになります。
ちなみに以下に紹介するURLはPC向けサイトではなくスマホサイトのUIなので、PCブラウザで見る場合はブラウザの画面幅を小さくしたり、シュミレータを使ってiPhone・Androidスマホ環境を再現して閲覧したり、はたまた実物のスマホで確認してもらう必要がありますので、あしからず(^_^.)
では、この本で習得できるスマホUI43の実例サンプルのうち少しだけ紹介します。(UIが変わっていたりしたら御愛嬌で)

プルダウンメニュー
スターバックス

スライドメニュー
MERY

シェアボタン
SHEEN

インフィニットスクロール
I/0 3000

タブパネル
livedoor

タブパネル
トンボ鉛筆

カルーセルパネル
dentsu

フォトギャラリー
mezza9

ポップアップムービー
nymi

グラフ
みるみるわかるEnergy

まとめ

CSS3&jQueryで作る スマートフォンサイトUI図鑑』はユーザに使いやすいスマホサイトを制作したいという方におすすめの書籍だと思います。
この書籍でCSSとjQueryを勉強をすれば、実際の企業・お店のスマホサイトでよく使われているUI(ユーザインターフェイス)を実装したスマホサイトを自作して制作できるようになると思います。
本の難易度的には、CSSとjQueryの基本的記述が既に出来る方には、ちょうど良い内容だと思います(^_^.)
CSSとjQueryの全くの初心者の方にはちょっと難しい内容なので、初心者の方はjavascript・jQueryの入門書(よくわかるJavaScriptの教科書など)から始めた方が良いかもです(^_^.)

メッセージ・感想フォーム

このブログの記事に関してメッセージや感想などあれば、下記フォームよりご連絡下さい(^_^.)

お名前
メールアドレス
メッセージ本文
岐阜県美濃加茂市のyossy(よっしー)
ブログの書き手:yossy(よっしー)
岐阜県美濃加茂市在住。1979年2月生まれ。♂。
趣味はギター・読書・グルメ散策など。
2015年2月から自分への備忘録・雑記としてブログを始めました。
身の回りの出来事・思った事・少しは他の誰かに役立つかもしれない情報などをフリーテーマで書き綴っています。
クレオフーガで気まぐれに自作した音楽をアップしてたりします。

ヨッシーのつぶやき

Amazonで一週間だけのビッグセール開催中ですがな(~12/12)。
早速プリンタのインクとワイヤレスキーボード&マウスをポチっちゃった(/・ω・)/

月別アーカイブ

ページトップへ