実践しながら学べる Webデザインの本

696viewsh94jksja09h94jksja09

このエントリーをはてなブックマークに追加
作りながら学ぶ HTML/CSSデザインの教科書

CHAPTER 1  はじめる前に

ウェブサイト制作のための準備

代表的なブラウザ

テキストエディタを選ぼう

CHAPTER 2  HTMLファイルを作成しよう

HTMLの基本

  • HTMLファイルの作成と保存
  • ブラウザで表示する

HTMLタグの意味に基づいてマークアップをしよう

  • ページの全体構成を把握する
  • 見出しと段落を表示する
  • リストを表示する
  • 表を作成する

HTMLのアウトラインを理解しよう

  • セクションタグを挿入する
  • 構造を表すタグを挿入する

CHAPTER 3  CSSで装飾しよう

CSSの基本

  • CSSファイルの作成と読み込み
  • 文字サイズを変更する
  • 個別にCSSを指定する

色を変更しよう

  • 文字色を指定する
  • 文字の背景色を指定する
  • 色の指定方法

罫線と余白を調整しよう

  • 文字に罫線をつける
  • 文字の余白を調整する
  • 区切り線の追加と余白の調整

リストと表を装飾しよう

  • リスト記号を変更する
  • 表を装飾する

さまざまなブラウザで確認してみよう

  • ブラウザによる表示の違い
  • 文字のフォントを指定する
  • 文字の高さを指定する
  • normalize.cssを読み込む

CHAPTER 4  画像を編集し、HTMLで表示しよう

ウェブページ用の画像を作成しよう

  • 画像サイズを理解する
  • 切り抜きツールで画像を切り抜く

画像を挿入しよう

  • HTMLに画像を挿入する
  • 画像を図版として指定する
  • 図版にキャプションを挿入する

CHAPTER 5  共通部分の作成とレイアウト

ページヘッダーとページフッターを挿入しよう

  • サイト名とキャッチコピーを挿入する
  • ウェブフォントを設定する
  • コピーライトを挿入する
  • ページのヘッダー・フッターとして指定する

ページをレイアウトしよう

  • ページ全体をセンター寄せにする
  • 2段組レイアウト
  • CSSの範囲を限定する

CHAPTER 6  リンクを設定し、ナビゲーションを作りこもう

リンクを設定しよう

  • 外部サイトへリンクする
  • リンク色を変更する
  • 他のページへリンクする

ナビゲーションを作り込もう

  • ローカルナビをデザインする
  • グローバルナビをデザインする
  • パンくずナビを設置する
  • ページ内リンクを設置する

CHAPTER 7  各ページを作成しよう

ページを複製しよう

  • 複製したページの記事を編集する

一覧ページを作ろう

  • 一覧ページに記事と画像を挿入する
  • 一覧ページをCSSでデザインする

その他の下層ページを作ろう

  • 下層ページを作成する
  • 立体的なボタンを作成する

トップページを作ろう

  • メインビジュアルを配置する
  • 3段組レイアウト
  • おしらせを配置する

タイトルと概要をつける

  • タイトルをつける
  • 概要を設定する

CHAPTER 8  サイトに動きをつけよう

スライドショーを作ろう

  • JavaScriptとjQuery
  • jQueryプラグインでスライドショーを作る

地図を配置しよう

  • Googleマップを埋め込もう

お問い合わせフォームを設置しよう

  • Googleフォームを利用する

CHAPTER 9  サイトの公開と仕上げ

サイトを公開しよう

  • レンタルサーバーを契約する
  • FTPソフトを利用する

最終チェックをしよう

SNSボタンの設置

アクセス解析を導入しよう

感想

なかなか勉強になります。

関連まとめ

本のまとめカテゴリー


コメントを書く