MdN Web Mook 現場のワークフローで覚える Webサイト制作教室
エムディエヌコーポレーション / 2012年04月20日 / 全321ページ
【“いま”の技術が身につくWebデザインレッスン!】 Web制作でお悩みの方のために、Webデザインの基礎知識から、ワイヤーフレーム・モックアップづくり、HTML+CSSコーディングと、制作ワークフローに沿ったスムーズな仕事の進め方とつまずきやすいポイントを紹介。さらにHTML5+CSS3、jQuery、SNSとの連携、スマートフォン対応、WordPress導入法など、いま現場で必要とされる技術もわかりやすく解説しています。サンプルデータもWebサイトからダウンロード可能。超人気ブログ『Webデザインレシピ』の著者による必修のWebデザインレッスンです!【著】高橋のり
目次
- 扉
- はじめに
- 目次
- サンプルデータについて
- ■INTRODUCTION Webデザインってなに?
- LESSON001 Webデザインをするなら忘れちゃいけない3つのこと
- LESSON002 Webデザインにあたって注意しておきたいこと
- LESSON003 ユーザーの閲覧環境とWebデザインの関係
- ■CHAPTER 1 サイトの設計図をつくる
- LESSON001 まず、Webサイト公開の目的とターゲットを明確に
- LESSON002 コンテンツにあわせたWebサイトのレイアウト
- LESSON003 コンテンツを整理してサイトマップを作成
- LESSON004 最終的な設計図となるワイヤーフレームづくり
- ■CHAPTER 2 デザインモックアップをつくる
- LESSON001 Webを制作するときのPhotoshopの設定
- LESSON002 モックアップづくりに便利なPhotoshopの機能
- LESSON003 大枠のレイアウトをつくってみよう
- LESSON004 操作が伝わるUIエレメントをつくる
- LESSON005 モックアップから画像を切り出す
- LESSON006 CSS3による表現と画像による表現の違い
- 扉
- はじめに
- 目次
- サンプルデータについて
- ■INTRODUCTION Webデザインってなに?
- LESSON001 Webデザインをするなら忘れちゃいけない3つのこと
- LESSON002 Webデザインにあたって注意しておきたいこと
- LESSON003 ユーザーの閲覧環境とWebデザインの関係
- ■CHAPTER 1 サイトの設計図をつくる
- LESSON001 まず、Webサイト公開の目的とターゲットを明確に
- LESSON002 コンテンツにあわせたWebサイトのレイアウト
- LESSON003 コンテンツを整理してサイトマップを作成
- LESSON004 最終的な設計図となるワイヤーフレームづくり
- ■CHAPTER 2 デザインモックアップをつくる
- LESSON001 Webを制作するときのPhotoshopの設定
- LESSON002 モックアップづくりに便利なPhotoshopの機能
- LESSON003 大枠のレイアウトをつくってみよう
- LESSON004 操作が伝わるUIエレメントをつくる
- LESSON005 モックアップから画像を切り出す
- LESSON006 CSS3による表現と画像による表現の違い
- ■CHAPTER 3 HTMLのマークアップで気をつけたいこと
- LESSON001 HTMLは文書構造をマークアップする言語
- LESSON002 アウトライン構造をつくる(1) (X)HTMLのアウトライン
- LESSON003 アウトライン構造をつくる(2) HTML5のアウトライン
- LESSON004 HTML5で変わった要素の分類と文法
- LESSON005 HTML5での追加要素と意味が変わった要素
- LESSON006 HTML5でのマークアップの実際
- ■CHAPTER 4 CSSで装飾する
- LESSON001 ボックスモデルと視覚整形モデルのしくみ
- LESSON002 displayプロパティとインライン/ブロックの関係
- LESSON003 ボックスの配置(1) 通常フローのしくみ
- LESSON004 ボックスの配置(2) フロートのしくみ
- LESSON005 ポジションプロパティを使った配置
- LESSON006 z-indexで要素の重なり順を変更する
- LESSON007 CSS3を使ったさまざまな表現
- LESSON008 Webフォントを使ってみよう
- ■CHAPTER 5 jQueryでインタラクション
- LESSON001 CSSがわかればjQueryは簡単
- LESSON002 jQueryでつくるドロップダウンメニュー
- LESSON003 プラグインを利用したコンテンツスライダー
- LESSON004 フォームの入力項目をチェックする
- LESSON005 フォームエレメントのデザインを変える
- LESSON006 jQuery UIでつくるアコーディオンパネル
- LESSON007 jQueryを使ったレイアウトテクニック
- LESSON008 jQueryで文字サイズ変更
- ■CHAPTER 6 ソーシャルサービスと連携する
- LESSON001 Twitterのボタンを設置する
- LESSON002 Facebookのプラグインを埋め込む
- LESSON003 ソーシャルブックマークのボタンの設置
- LESSON004 Googleマップをカスタマイズ
- LESSON005 Googleを利用したサイト内検索
- LESSON006 YouTubeの動画を埋め込む
- ■CHAPTER 7 スマートフォン対応サイト
- LESSON001 スマートフォンサイトとPCサイトの違い
- LESSON002 デバイスにあわせてHTMLやCSSを切り替える
- LESSON003 スマートフォンサイトコーディングのポイント
- LESSON004 Media QueriesでレスポンシブWebデザイン
- LESSON005 jQuery Mobileを使ってみよう!
- ■CHAPTER 8 WordPressでサイト構築
- LESSON001 WordPressでサイトを構築しよう
- LESSON002 WordPressサイトのファイル構造
- LESSON003 テンプレートタグと記述のルール
- LESSON004 固定ページ機能で小規模サイトを作成
- LESSON005 カスタム投稿タイプで更新型コンテンツを表示
- INDEX
- 奥付
※このデジタル雑誌には目次に記載されているコンテンツが含まれています。それ以外のコンテンツは、本誌のコンテンツであっても含まれていません のでご注意ください。
※電子版では、紙の雑誌と内容が一部異なる場合や、掲載されないページがある場合があります。