基礎から覚える、深く理解できる。Webデザインの新しい教科書

2013年2月22日、エムディーエヌコーポレーションから「基礎から覚える、深く理解できる。Webデザインの新しい教科書」が発売されました。

基礎から覚える、深く理解できる。Webデザインの新しい教科書

この本は、わたくし赤間と、こもりまさあきさんとの共著でリリースした本です。

Webサイト制作の初心者の方に向けて「本当に必要な正しい基礎」を伝えるWebデザインの入門書です。全体は8章構成で、WWWやインターネットの仕組みを皮切りに、Webサイト制作のワークフロー、HTMLとCSSの技術的な解説、小規模のWebサイトを公開・運用するまでの基礎知識を、系統立ててわかりやすく解説しています。

これからWebデザインをはじめる、基礎知識を身につけたい方に向けての書籍です。

この本をお買い求めいただけるサイト

オンラインでは、Amazonやインプレスダイレクトでお買い求めいただくと、送料無料です。実際の店舗では、コンピューター関連の書籍を取り扱うお店(ヨドバシカメラ、ジュンク堂、未来屋など)で、お手にとっていただけます。

Kindle版はこちら

AmazonのKindle端末はもちろんのこと、iPadやiPad miniのKindleアプリ(無料)でもご利用いただけます。

基礎から覚える、深く理解できる。Webデザインの新しい教科書

Facebookページ

Facebookページを準備しました。いいねとか、応援していただけると嬉しいです。よろしくお願いします!

この本の掲載内容

1章から8章まで、系統立ててWebデザインに必要な事項を解説しています。最新の技術というよりも、「そもそもこういった意味で」とか、「いろはの“い”」的な内容が中心です。

Web制作を始める人たちの一助になれば、幸いです。ぜひ「基礎から覚える、深く理解できる。Webデザインの新しい教科書」をよろしくお願いします!

Lesson 1 Webデザインの世界を知る

  1. インターネットとWWWの歴史
  2. WebページがWebブラウザに表示されるまでの仕組み
  3. 多様化するWebブラウザのことを知ろう
  4. Webデザインって何をすること?
  5. 実際のWebサイトができるまで
  6. Webサイト制作にはどんな人たちが関わるのか?
  7. Webサイト制作のために必要な技術
  8. Webサイト制作に必要なツール
  9. これからのWebデザイン

Lesson 2 Webサイトを設計する

  1. Webサイトは何のためにあるのか?
  2. Webサイト全体の構成を見てみよう
  3. Webページの構造を分析してみよう
  4. Webページを一般的な文書に置き換えてみよう
  5. 文書のアウトラインを考えてみよう
  6. 情報を多様な環境で取得しやすくすることの大切さ
  7. 情報の意味を伝えるために必要なHTML
  8. ワイヤーフレームを使って情報を視覚的に配置する
  9. HTMLをデザイン・レイアウトするCSS
  10. 高度なインタラクションを追加するJavaScript
  11. これからのWebサイト設計

Lesson 3 HTMLの役割とできること

  1. HTMLとはどんなもの?
  2. テキスト情報に意味を与えるマークアップ
  3. HTMLファイルをWebブラウザで表示してみよう
  4. 要素(タグ)と属性の違い
  5. HTMLの基本構造
  6. head要素とbody要素の違い
  7. head要素の中に入る要素
  8. ブロックレベル要素とインライン要素
  9. 見出しを表すh要素と段落を意味するp要素
  10. 文字列に意味を与えるインライン要素
  11. 引用や出典を示す要素
  12. 強制改行を意味するbr要素と水平の区切り線を表すhr要素
  13. 情報の削除を示すdel要素と修正を意味するins要素
  14. 画像を挿入するimg要素
  15. 文書同士をつなげるa要素
  16. 文書の制作者などを示す要素
  17. リストを表現する要素
  18. 情報をグループ化するdiv要素とspan要素
  19. 表組みを作るための要素
  20. フォームを作るための要素
  21. 文章をマークアップしてみよう
  22. HTML5とはどんなもの?
  23. HTML5で新しく追加された要素

Lesson 4 CSSの役割とできること

  1. CSSとはどんなもの?
  2. CSSで情報をデザインする
  3. HTMLはブラウザにどう表示されている?
  4. HTMLにCSSを適用するには?
  5. セレクタとはどんなもの?
  6. よく使われるセレクタ
  7. 覚えておきたいCSSのルール
  8. CSSを書いてブラウザで表示してみよう
  9. プロパティを性質の違いで大きく2つに分類してみる
  10. 文字や背景に色をつけてみよう
  11. 背景に画像を表示する
  12. 文字のサイズを設定する
  13. 書体(フォント)を指定する
  14. 文字の行間や開始位置を調整する
  15. リンクの色を変更する
  16. マウスの状態に応じてリンクのスタイルを変えるには?
  17. 疑似要素の使い方と効果
  18. CSSを書く前に覚えておきたいボックスモデル
  19. 内容の幅と高さを指定する
  20. 情報の含まれるブロックにボーダーを設定する
  21. パディングを調整する
  22. 隣接するブロックとの間隔を調整
  23. 情報をブロック単位で並べる
  24. 文書構造順に積み木感覚でブロックを配置
  25. floatプロパティによる回り込みの解除
  26. 意図した場所にブロックを配置
  27. CSSによるレイアウトの実践
  28. displayプロパティによる要素の表示状態の切り替え
  29. 背景画像を使って文字を画像に置き換える
  30. リストを装飾する
  31. テーブルを装飾する
  32. フォームを装飾する
  33. 次世代の規格「CSS3」について

Lesson 5 Webサイトを構成する素材

  1. Webサイトで使う素材
  2. 著作権とライセンス
  3. テキストと文字コード
  4. Webサイトの標準的な色空間
  5. 画像を構成する単位「ピクセル」
  6. 画像フォーマットについて
  7. Webサイトに使える映像素材や音声素材

Lesson 6 Webサイトを表現する色

  1. カラーモードの違い
  2. 色の三属性
  3. 色指定の方法
  4. 代表的な配色技法

Lesson 7 Webサイトを公開する

  1. ホスティングサービスの種類と選び方
  2. Webサイトの公開前に確認すること
  3. Webサイトの品質を確認する
  4. ローカル環境でWebサイトをチェックする
  5. サーバーとクライアントの関係
  6. 制作したWebデータの送信に利用するFTP
  7. FTPクライアントでデータをアップロードする
  8. ブラウザで表示確認する

Lesson 8 Webサイトを運用する

  1. ソーシャルメディアと連携する
  2. Googleにサイトを登録するには?
  3. アクセス解析でWebサイトの効果を測定する
  4. Webサイトの調査、改善を行うには?
  5. サーバソフトウェアのアップデートとセキュリティ対策

ぜひとも、応援していただければ幸いです!

オススメ書籍

10日でSEO&アクセスアップ Jimdoデザインブック

かっこいいだけではなく、人が集まるホームページを作る!

「Jimdo」(ジンドゥー)でのホームページの作成方法と運用方法を解説した書籍。解説記事を順番に読み進めて行くことで、Jimdoを使ったホームページの作成・運用・宣伝・集客の基本を、10日間で習得するのが本書のコンセプトです。12章構成の解説の中で、Jimdoの基本操作とホームページの作成、デザインとコンテンツ(内容)のレベルアップ、そしてSEOやリスティング広告を含む宣伝・集客の基本を解説しています。

コメントを残す

メールアドレスが公開されることはありません。

CAPTCHA


ABOUTこの記事をかいた人

株式会社マジカルリミックス 代表取締役CEO/JimdoExpert 宮城県出身。コンピューター系の専門学校を卒業後、仙台のデザイン会社に入社。 Webサイトのデザイン・コーディングをはじめとし、各種デジタルメディアのデザインに従事。2002年退職後すぐにマジカルリミックスを創業。2007年に法人化で株式会社マジカルリミックスを設立。Webサイト運用に関するコンサルティング、社内向けITトレーニング、セミナー出演、執筆など。2005年から仙台の専門学校で、非常勤講師としてWeb制作講義を担当。主な著書に『10日で作るかっこいいホームページ Jimdo(ジンドゥー)デザインブック』(エムディエヌコーポレーション)『HTML5+CSS3の新しい教科書 基礎から覚える、深く理解できる。』(共著、同)『基礎から覚える、深く理解できる。Webデザインの新しい教科書』(同)。