ホーム > 読んだ >

これからのWebサイト設計の新しい教科書
CSSフレームワークでつくるマルチデバイス対応サイトの考え方と実装

書誌

author松田直樹、後藤賢司、こもりまさあき
publisherエムディエヌコーポレーション
year2015
price2800+tax
isbn978-4-8443-6489-4

目次

1感想
2抄録

履歴

editor唯野
2015.8.10読了
2015.9.8公開

副題にもあるようにCSSフレームワーク、特にBootstrapを用いてレスポンシブWebデザインによる設計と実装を解説した本。私自身は特にBootstrapにこだわる理由がなかったので、どちらかといえば最近のWebサイト設計における概要を理解する目的で読んだ。そのため注力して読んだのは主に前半部分であるが、モバイルサイト向けなどでは1ページに情報を集約してしまうのが流れのようである。その場合のSEOとの兼ね合い等がどうなるのか私にはよく分からないものの、結局はユーザの利便性が優先されるということなのだろう。

レスポンシブWebデザインと聞いて初めは「何だそれは」と思ったが、要はCSSのmediatypeで主要な閲覧デバイス(スマホ、タブレット、PC)の画面幅に応じて、Webページを構成するブロックの表示を分岐させる??ということである。Bootstrapなどは、そのためのフレームワークであり、ブラウザ間の実装の違いなども吸収しつつ、統一されたインタフェースを提供している。確かに複数人で多数のWebサイトを製作する立場であれば、この種のルールが統一される効果は大きい。

私自身はCSSというよりも、この種のことはHTMLテンプレートで部品ごとに分けるイメージでいたため、そういう意味では勉強になったが、言い換えれば、よりBootstrapに関心のある人が読むべき本だと思った。

抄録

12-19

マルチデバイスによるWeb閲覧が一般化したことで、Webで求められる情報も「必要な時に必要な情報を得る」ことに比重が移ってきた。現在ではそのためにレスポンシブWebデザイン(RWD)がよく用いられている。これは2010年にEthan Marcotte氏が提唱したもので、Fluid Grids (サイズ可変グリッド)、Fluid Images (サイズ可変な画像や動画)、CSS3 Media queries (上記を実現するためにCSS3のMedia Typeを使う)という点に特徴がある。RWDは現状ではスマートフォン、タブレット、PCを想定して作られることが多い。

20-35/96-99

スマートフォン用サイトではモバイルユーザーにとって今知りたい情報が上位に来るようにする必要がある。このような考え方をモバイルファースト、コンテンツファースト、ユーザーファーストという。また、表示に要する時間(サイトパフォーマンス)が重要になるが、これらの改善にはGoogleの提供しているPageSpeedInsightsやモバイルフレンドリーテストが利用できる。そのため、必要な情報を簡潔に伝えるシンプルなデザイン(フラットデザイン)や従来の階層型ではないぺーじスクロールを優先して情報を1ページに集約したワンページデザインなどが増えつつある。

38-45/104-109

全文を読まれる場合はログインしてください


Up