目次

表紙
著者プロフィール
はじめに
本書の読み方
目次
Chapter1 Webサイトを作成する準備をしよう
Lesson01 Webサイトが表示される基本的な仕組みを知りましょう
Lesson02 Webサイト制作の大まかな流れを把握しましょう
Lesson03 Webサイトの構成とデザインを決めましょう
Lesson04 「Google Chrome」をインストールしましょう
Lesson05 テキストエディタ「Brackets」をインストールしよう
Lesson06 ファイルの種類を表す「拡張子」を表示しましょう
Lesson07 文字コードを理解しましょう
Chapter2 HTMLの基本を学ぼう
Lesson08 HTMLとは何かを知りましょう
Lesson09 HTMLの基本構造を知りましょう
Lesson10 タグの基本的な書き方を知りましょう
Lesson11 代表的な要素について学びましょう
Lesson12 ディレクトリとパスについて学びましょう
Lesson13 HTMLを書いてみましょう
Lesson14 Webページに画像を挿入してみましょう
Lesson15 読みやすいHTMLを書きましょう
Chapter3 共通部分のHTMLを作成しよう
Lesson16 完成形をイメージしましょう
Lesson17 ページの骨組みを作成しましょう
Lesson18 ヘッダーとグローバルナビゲーションを作りましょう
Lesson19 メインエリアとパンくずリストを作ろう
Lesson20 サイドバーとフッターを作りましょう
Chapter4 共通部分から個別のページを作成しよう
Lesson21 共通ページをもとにしてトップページを作成しましょう
Lesson22 講座案内ページの表組みを作成しましょう
Lesson23 ギャラリーページの画像リストを作成しましょう
Lesson24 お問い合わせページのフォームを作成しましょう
Chapter5 CSSの基本を学ぼう
Lesson25 CSSとは何かを知りましょう
Lesson26 CSSの基本構造を知りましょう
Lesson27 セレクタについて理解しましょう
Lesson28 CSSが競合するスタイルを解決する仕組みを知りましょう
Lesson29 スタイルの継承について知りましょう
Lesson30 文字の書式を設定するプロパティを知りましょう
Lesson31 色の指定方法を知りましょう
Lesson32 要素のサイズと間隔の指定方法を理解しましょう
Lesson33 Webページの主なレイアウトパターンを知りましょう
Lesson34 フロートを利用したレイアウト方法を理解しましょう
Lesson35 ディスプレイを利用したレイアウト方法を理解しましょう
Lesson36 ポジションを利用したレイアウト方法を理解しましょう
Lesson37 CSSを書いてみましょう
Chapter6 CSSで共通部分をデザインしよう
Lesson38 タイプセレクタを使ってページ全体の書式を整えましょう
Lesson39 ボーダーと背景でメインコンテンツの見出しを装飾する
Lesson40 幅を設定してヘッダーエリアを整えましょう
Lesson41 フロートを利用してグローバルナビゲーションを整えましょう
Lesson42 メイン部分を2段組みにしましょう
Lesson43 ボーダーと背景設定を組み合わせてサイドバー内を整えましょう
Lesson44 グラデーションを利用して立体的なボタンを作りましょう
Lesson45 フッターナビゲーションをインライン化して整えましょう
Lesson46 疑似要素を使ってパンくずリストを整えましょう
Lesson47 アニメーションによる視覚効果を追加してみましょう
Chapter7 コンテンツのデザインを整えよう
Lesson48 トップページのデザインを整えましょう
Lesson49 講座案内の表組みを装飾しましょう
Lesson50 ギャラリーの写真を格子状に並べましょう
Lesson51 フォームを装飾してみましょう
Chapter8 スマートフォンに対応しよう
Lesson52 スマートフォンに対応する方法を知りましょう
Lesson53 スマートフォンでの表示をパソコンで確認しましょう
Lesson54 Viewportを設定してWebページの表示方法を制御しよう
Lesson55 メディアクエリでCSSを切り替えましょう
Lesson56 Webフォントでアイコンを表現してみましょう
Chapter9 Webサイトを公開しよう
Lesson57 Webサイトを公開するサーバを用意しましょう
Lesson58 FTPクライアントを使ってファイルをアップロードしましょう
Lesson59 Webサイトの品質を確認しましょう
Chapter10 機能を追加して集客しよう
Lesson60 検索結果にWebサイトの情報が詳しく載るようにしましょう
Lesson61 ブックマークやスマートフォン用のアイコンを設定しましょう
Lesson62 ソーシャルネットワークを活用しましょう
Lesson63 Google マップを埋め込みましょう
付録 HTML要素＆CSSプロパティ一覧
索引
本書サンプルコードのダウンロードについて
奥付

著者プロフィール

• 赤間公太郎（著者）

  赤間公太郎（あかまこうたろう）株式会社マジカルリミックス 代表取締役CEO。宮城県出身。コンピューター系の専門学校を卒業後、仙台のデザイン会社に入社。Webサイトのデザイン/コーディングをはじめとし、各種デジタルメディアのデザインに従事。2002年退職後すぐにマジカルリミックスを創業。2007年に法人化で株式会社マジカルリミックスを設立。サイト運用に関するコンサルティング、社内ITトレーニング、セミナー出演、執筆など。2005年から仙台の専門学校で、非常勤講師としてWeb関連講義を担当。

• 大屋慶太（著者）

  大屋慶太（おおやけいた）株式会社デック 代表取締役社長。名古屋芸術大学美術学部卒業。某大手通信会社系列の企業で印刷物のデザインを担当。その後退職し、愛知県の印刷会社で、Webデザイナー兼コーダーとして5年ほど在籍。大手クライアントの案件も、多数手がける。2005年スタジオ・デックの屋号で、フリーランスとして独立。2006年に株式会社デックとして法人化。近年は制作会社経営のかたわら、講師、本の執筆、制作業界の人々が集う飲酒会運営などさまざまな方面で活躍中。

• 服部雄樹（著者）

  服部雄樹（はっとりゆうき）服部制作室 代表。愛知県名古屋市出身。2014年までインドネシア・バリ島で活動し、世界各国のクリエイターと交流。多くの海外案件に携わる。帰国後、服部制作室を設立。Webサイトの制作だけでなく、各種WebサービスのテンプレートデザインやUI設計、セミナー登壇、コラムへの寄稿など精力的に活動中。“かっこいいを簡単に"をモットーに、海外のWebデザインを日本向けにローカライズした新しいデザインを提案している。