web creators特別号　いますぐ悩みが解決する！　Webデザイン　仕事で役立つ54のアイデア

web creators編集部編

定価 1,980円
（本体 1,800円＋税10%） ※電子書籍の価格は各販売ストアにてご確認ください｡

紙の本を買う

紙の書籍を購入
- Amazon
- ヨドバシ.com

発売日	：2013-01-29
仕様	：A4変型判／144pP
ISBN	：978-4-8443-6316-3

Webデザインとコーディング全般における、流行・定番テクニックと最新情報を1冊に凝縮しました。近年さかんに目にするパララックス効果やMasonryを利用したレイアウトをはじめ、見やすくて使いやすいナビゲーション、フォームや製品紹介ページのユーザビリティを向上するインタラクション、表現の可能性を広げるHTML5＋CSS3の機能、制作効率を向上するフレームワークの紹介、スマートフォンサイト制作のポイントとTipsなど、Web制作の仕事に役立つ54のアイデアを満載。掲載サンプル＆コードもダウンロードできるので、動作を試しながら実践的に解説を読み進められます。Webデザインの“どうしよう？”を“これだ！”に変える、現場のためのネタ帳の登場です！【CHAPTER1】デザイン＆レイアウトレスポンシブWebデザイン／jQuery Masonry／フルスクリーン画像／パララックス効果 etc 【CHAPTER2】ナビゲーション＆メニューパンくずリスト／ドック風メニュー／アコーディオンメニュー／ドロップダウンメニュー／タブ etc 【CHAPTER3】インタラクション＆エフェクト Lightbox／ズーム／スライドショー／ツールチップ／カルーセルパネル／フォームの入力チェック etc 【CHAPTER4】HTML5＆CSS3 CANVAS／SVG／セレクタの記述まとめ／IE対策／ボーダーと背景／グラデーション／Webフォント etc 【CHAPTER5】フレームワーク＆API Twitter Bootstrap／99lime／52framework／Yaml4／SassとLESS／Twitter APIの変更点 etc 【CHAPTER6】スマートフォンサイト UI設計のポイント／画像フリック／jQuery Mobileテクニック／スマートフォンのViewport etc

→サンプルデータのダウンロードはこちら

■ページ見本

Introduction　新しいデバイス、新しい技術がとりまくWebデザインの“現在”

CHAPTER1　デザイン＆レイアウト
01　メディアクエリによるレスポンシブWebデザイン
02　コンテンツを隙間なくパネル状に配置する
03　可変グリッドを採用したレスポンシブWebデザイン
04　画像に沿ってテキストが回りこむレイアウト
05　水平に展開するフォトギャラリー
06　画面いっぱいに写真が広がるTOPページ
07　パララックス効果のユニークなスクロール
08　子ども向けサイトに似合うおもちゃのロゴ
09　墨がにじんだような和風文字を表現
10　光が灯ったイメージのナビゲーションパーツ
11　デザインのアクセントになる垂れ幕パーツ

CHAPTER2　ナビゲーション＆メニュー
01　画像なしでグラフィカルなパンくずリストに
02　マウスの位置に反応するドック風メニュー
03　スライドして開閉するアコーディオンメニュー
04　CSSだけで作成するドロップダウンメニュー
05　マウスオーバーでアニメーションするメニュー
06　アクセシビリティにも配慮した軽量で簡単に実装できるタブ

CHAPTER3　インタラクション＆エフェクト
01　Lightboxで画像をオーバーレイ表示する
02　ダイナミックにズームする画像ギャラリー
03　エフェクトアニメーションが豊富なスライドショー
04　画像やリンクの説明書きに便利なツールチップ
05　商品のディテールを伝えるズームアップエフェクト
06　ECサイトで定番のカルーセルパネル
07　フォントサイズの切り替えボタン
08　回転しながら出現するページトップボタン
09　送信前にフォームの内容をチェックする
10　画像をコマ送りで表示させるスライドショー
11　汎用的なJavaScriptのロールオーバースクリプト
12　CSSスプライトを使ったロールオーバー
13　HTML5のPlaceholderをIEでも利用可能に

CHAPTER4　HTML5&CSS3
01　canvasを使ってJPEG画像を透過させる
02　SVGで棒グラフのバーをアニメーションさせる
03　セレクタの記述方法を基礎から理解する
04　IEへの対応(1)｜ライブラリを利用したIEへの対策
05　IEへの対応(2)｜従来のCSSでも必要になるIE7対策
06　ボーダーと背景に関連したCSS3の新機能
07　ボタンの表現に使えるCSS3の機能いろいろ
08　CSS3でつくるつややかなボタン実例
09　フォントの選択肢が広がるWebフォントの活用

CHAPTER5　フレームワーク＆API
01　Twitter Bootstrapを使ったサイト構築の流れ
02　Web制作をスピードアップする99lime
03　HTML5対応フレームワーク52framework
04　マルチカラムとグリッドレイアウトが充実したYaml4
05　複数のメタ言語に対応した320 and Up
06　Web開発の生産性を向上させるメタ言語Sass（SCSS）とLESSとは
07　Twitter APIのバージョンアップによる変更点
08　foursquare APIでロケーション情報を活用

CHAPTER6　スマートフォンサイト
01　株式会社ディー・エヌ・エーに聞くスマートフォンサイトUI設計のポイント
02　プラグインで簡単に「フリック」を実装する
03　可変グリッドによるPCとスマートフォンの両対応
04　jQuery Mobileで簡単にモバイルUIを作成
05　jQuery Mobileのデザインを容易にするテーマローラー
06　jQuery MobileプラグインDateBoxを利用する
07　表示サイズ調整の要となるViewportの設定

Webクリエイティブの現場を支えるIntuos5
BiND for WebLiFE* 6でつくるデザイナーズWebサイト