MdNCORPORATION

web creators特別号 Webデザイン表現&技法の新・スタンダード

web creators特別号 Webデザイン表現&技法の新・スタンダード

web creators編集部 編
定価 1,980円
(本体 1,800円+税10%)
※電子書籍の価格は各販売ストアにてご確認ください。
発売日 2011-01-29
仕様 A4変型判/152pP
ISBN 978-4-8443-6173-2
いま知らないと困るWebデザインの流行テクニックと最新情報を一冊にまとめました。レイアウトや配色設計の手法から、人気のデザイン表現、ユーザビリティを劇的に向上するナビゲーション&インタラクション、CSS3+HTML5やスマートフォンサイト制作などの最新技術まで、Webデザインとコーディングに関する多彩な情報を解説しています。サンプルデータをダウンロードできるので、解説を読みながら実際の動作も確認できます。さらに、多様なサービス展開を見せているホスティング業界の最新情勢も掲載。あなたのWebデザインの知識とテクニックを一大リニューアルする必読書です!!

→facebookの「web creators」公式ファンページはこちら

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



目次

【Webデザイン表現&技法の新・スタンダード】

■CHAPTER01 レイアウト【Layout】
01 固定枠のマルチカラムレイアウト① 2段組みレイアウト
02 固定枠のマルチカラムレイアウト② 3段組みレイアウト
03 絶対配置で指定するグリッドカラムレイアウト
04 ウィンドウ幅にあわせて可変するリキッドレイアウト
05 テキストブロックの指定で表現するレイアウト
06 IEで見られる縦書きレイアウト
07 ヘッダーとフッターの位置固定
08 構成要素の位置を固定するレイアウトテクニック
09 リスト定義をベースにしたナビゲーションレイアウト
10 背景画像を固定配置したスクロールテクニック
11 ウェブサイトのカラースキーム設計
12 1枚の絵のような写真とテキストのレイアウト
13 tableを見やすくするCSSデザインパターン
14 Webの特性を考慮した長文レイアウト術
15 可変の線と固定の線を同時に表現するヘッドライン
16 Progressive Enhancementの考え方

■CHAPTER02 デザインパーツ【Design parts】
01 ドット柄の抽象的なメインビジュアル
02 透過PNGを使用して背景や画像を透けさせる
03 パターン+テクスチャで雰囲気を高める
04 陰影と照明光を表現したナビゲーションバー
05 グラデーションを利用したサイトになじむ見出しバー
06 レイヤー感と奥行きのあるカラフルな分布図
07 メタリックで映り込みのあるロゴ
08 光沢のあるポップなイメージのアイコン
09 繊細な手作り感のあるパーツのデザイン
10 テキストの長さに応じて幅が伸縮するボタン
11 質感を加えるテクスチャとグラデーション
12 光と影を感じさせるサイトデザイン
13 フォームをカスタマイズする

■CHAPTER03 ナビゲーション【Navigation】
01 CSSのみで実装するシンプルなロールオーバー① ベーシックタイプ
02 CSSのみで実装するシンプルなロールオーバー② CSSスプライト
03 ふわっと画像が切り替わるロールーバー
04 ドロップダウンでメニューを一斉表示
05 階層構造がわかりやすい多重階層メニュー
06 階層の構造ごと表示するツリー型ナビゲーション
07 スクロール時に透ける上部固定型ナビゲーション
08 Cookieを利用したパス型パンくずリスト
09 シンプルで汎用性の高いパンくずリスト
10 アコーディオン機能があるスライド型パンくずリスト

■CHAPTER04 インタラクション【Interaction】
01 JavaScriptライブラリjQueryを活用しよう
02 Twitter APIで学ぶWeb API活用術
03 スライドショーで動きのあるサイトに
04 リアルタイムでフォーム入力を判定する
05 ドラッグ&ドロップでユーザビリティを向上
06 Lightbox風に画像表示を演出する
07 アクセスするごとに画像をランダムに表示
08 ブロック要素の全体をリンク領域に設定する
09 ビジュアルがスライドするナビゲーション

■CHAPTER05 CSS3&HTML5【CSS3&HTML5】
01 border-radiusで手軽に角丸を実装する
02 text-shadowで文字をリッチで読みやすく
03 border-imageを利用したネスト不要の画像フレーム
04 背景画像の複数指定で手軽にリッチなデザインに
05 属性セレクタを利用して効率よくスタイリング
06 :nth-child疑似クラスでコーディングをシンプルに
07 :nth-of-typeで効率的に色分けする
08 ターゲット疑似クラスで移動先を明確にする
09 表現の幅が広がるRGBaプロパティ・バリュー
10 CANVAS要素でグラフを描画する
11 HTML5のセクションマークアップ

■CHAPTER06 スマートフォン【Smartphone】
01 スマートフォンにおけるHTML5の対応状況
02 サイトを見やすくするViewport
03 PCとスマ-トフォンでページを切り替える
04 スマートフォンサイトのページデザイン
05 スマートフォンサイトのデバッグ環境を構築する
06 iUIを使ったUIデザインの構築
07 スマートフォンに対応した動画ページをつくる

■CHAPTER07 ホスティング【Hosting】
いまどきのホスティングサービス 賢い選び方
ホスティングサービスガイド
全国ホスティングサービス一覧

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

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