MdNCORPORATION

レスポンシブWebデザインテクニックブック プロが教えるマルチデバイス対応の手法

レスポンシブWebデザインテクニックブック プロが教えるマルチデバイス対応の手法

加藤 俊司 著/川下 城誉 著/根岸 良樹 著/岩堀 真吾 著/大竹 孔明 著/野田 一輝 著/藤田 拓人 著/清水 豊 著/野田 真穂 著/細川 富代 著
定価 3,080円
(本体 2,800円+税10%)
※電子書籍の価格は各販売ストアにてご確認ください。
発売日 2013-07-02
仕様 B5判/256P
ISBN 978-4-8443-6353-8
タブレット、スマートフォンなどのさまざまデバイスが登場・浸透し、それにともなってWebサイトのユーザーの閲覧・利用スタイルもますます多様化しています。現在の通信環境の事情なども含めて、レスポンシブWebデザインの必要性・重要性がさらに注目されてきており、実際に採用しているサイトもその数を増やしています。とはいえ、実際には制作が難しいと言われているレスポンシブWebデザイン。技術的なことだけでなく、制作ワークフローの面から見ても、従来とは違ったポイントがあります。本書は、そのレスポンシブWebデザインの実際の作り方を各ケーススタディとして解説します。一から設計する方法や、時短・バグ軽減にもつながるフレームワークを使った方法まで、さまざまな作例を紹介。まずは実際に手を動かして慣れてみて、あなたのWeb制作にお役立てください。サンプルデータはダウンロードできます。


■ページ見本










目次

INTRODUCTION レスポンシブWebデザインの基本
01 レスポンシブWebデザインとは
02 レスポンシブWebデザインの特徴
03 制作をはじめる前に

CHAPTER 1 ほぼ可変デザイン
CASE STUDY 01 [コーポレートサイト] 可変を前提としたレスポンシブWeb デザイン
CASE STUDY 02 [ブログサイト] CSSフレームワーク「One% CSS Grid」と「Responsive Navigation Menu」を使用する可変デザイン

CHAPTER 2 レイアウトを変更するデザイン
CASE STUDY 03 [コーポレートサイト] デバイスによってレイアウトを変更し、画像を振り分ける設計
CASE STUDY 04 [ブログサイト] 画面サイズによってレイアウトを6段階に変更するデザイン

CHAPTER 3 1カラムベースのデザイン
CASE STUDY 05 [ブログサイト] CSSフレームワーク「Initializr」と「HorizontalNav」を使用する1カラムベースのデザイン
CASE STUDY 06 [コーポレートサイト] コーポレートサイトに適した1カラムベースのデザイン

CHAPTER 4 見えない領域を使うデザイン
CASE STUDY 07 [プロモーションサイト] スマートフォンで見えなくなった領域をjQueryを使って表示を切り替える
CASE STUDY 08 [コーポレートサイト] 見えない領域をうまく使ったインタラクティブなデザイン

目的別索引

ダウンロードデータ

レスポンシブWebデザインテクニックブック プロが教えるマルチデバイス対応の手法
サンプルデータダウンロード


このたびは、「レスポンシブWebデザインテクニックブック プロが教えるマルチデバイス対応の手法」をご購入いただきまして、誠にありがとうございます。以下に本書の解説で使用したサンプルデータを用意致しましたのでご利用ください。


CHAPTER1.zip(0.5MB)

CHAPTER2.zip(5.2MB)

CHAPTER3.zip(16.1MB)

CHAPTER4.zip(0.8MB)


■ダウンロードにあたってのご注意■

ダウンロードファイルは、ZIP形式で圧縮されています。

Windows、Macそれぞれの解凍ソフトを使って圧縮ファイルを解凍してください。 圧縮ファイルはCHAPTERごとに分かれており、解凍したフォルダー内には記事番号のフォルダに分けてサンプルデータが収録されています。各CHAPTERのフォルダーには「はじめにお読みください.html」が同梱されていますので、ご使用の前に必ずお読みください。


■ダウンロードファイル解凍時のご注意■

Windowsをご利用の場合は、ダブルクリックしてもダウンロードファイルを正しく解凍できない場合があります。
リンク画像が表示されないなど、サンプルファイルの閲覧に問題がある場合は、次の手順でファイルの解凍をお試しください。

[1]ダウンロードしたファイルを右クリック
[2]表示されたメニューから[すべてを展開...]を選択
[3]ファイルを解凍するダイアログが表示されるので、保存場所を選択して実行
[4]指定した場所にファイルが解凍される


※弊社Webサイトからダウンロードできるサンプルデータは、本書の解説内容をご理解いただくために、ご自身で試される場合にのみ使用できる参照用データです。その他の用途での使用や配布などは一切できませんので、あらかじめご了承ください。ただしサンプルデータ中に含まれるjQueryや各種プラグインなどの一般に公開されているライブラリ類については、各ライブラリのライセンス条件に従います。

※弊社Webサイトからダウンロードできるサンプルデータの著作権は、それぞれの制作者に帰属します。

※弊社Webサイトからダウンロードできるサンプルデータを実行した結果につきましては、著者および株式会社エムディエヌコーポレーションは一切の責任を負いかねます。お客様の責任においてご利用ください。

※本書に掲載されているHTML、CSS、JavaScript等のコメントや改行位置等は、紙面掲載用として加工していることがあります。ダウンロードしたサンプルデータとは異なる場合がありますので、あらかじめご了承ください。

制作の基本からデザイン業界の最新状況まで! MdNのデザイン・グラフィック書8選

デザイン・制作・マーケティング Webでもう困らない! わかりやすくて知識が身につく8冊