第１章-ホームページ作成前に知っておくこと-

• ホームページのしくみ

• ホームページとは

• 最大の特徴

• WWWとは？

• WWWサーバーとURL

• パスをもう少し詳しく説明しましょう

• ファイルとフォルダ

• ファイルとフォルダの関係

• 新しいフォルダの作成

• ファイル名、フォルダ名には決まりがあります

• 皆、見る環境が同じとは限りません！

• Webブラウザとは

• 見る環境の違い

• インターネットに公開される仕組みとは？

• WebデータをWebサーバーへ転送

• Webページを閲覧するための要求に対するWebサーバーの対応

• なぜホームページのテーマが重要視される？

• ホームページのテーマを決めていますか？

• 素材を用意しましょう！

• ホームページを作成する方法を決める！

• 自分で思い通りに作りたい！〜テキストエディタで作る〜

• 自分では作りたいけど、タグを覚えるのは面倒です。〜タグ挿入型HTMLエディタで作る〜

• ホームページを効率的に作るための便利なパソコン操作とは？

• ドラッグアンド（＆）ドロップを覚えましょう！

• コピーアンドペーストを覚えよう！

• カットアンドペーストを覚えよう！

• 本題の便利なショートカットキーです！！

• 拡張子についての説明と設定

• 拡張子について

• 拡張子の種類は？！

• 拡張子は表示されていますか？

第２章-HTMLの基礎-

• HTMLについて

• HTMLの正体を見よう！

• タグと要素について

• タグの入れ子

• HTMLの基礎構造編

• 属性を学ぼう

• 必須属性とは？

• ブロック要素とインライン要素

• 推奨されない要素と属性

• コメントを記述する

• HTMLファイル作成の流れ！

• 任意の場所にフォルダを作成しよう！

• メモ帳を起動しよう！

• 実際にHTMLを入力してみましょう！

• HTMLファイルを保存しよう！

• メモ帳の終了

• HTMLファイルをブラウザで表示しよう！

• 一度作ったHTMLファイルを編集しよう！

第３章-いよいよ本格的にページを作成します-

• 最も基本的な要素

• 見出しを表示しよう！

• 段落を作って文章を表示しよう！

• 改行しましょう！

• 文字を強調しましょう！〜em要素〜

• 文字を強調しましょう！〜strong要素〜

• 文字を太字で表示しよう！

• 文字を斜体で表示しよう！

第４章-画像の利用と区切り線を表示しよう！-

• 画像利用の前に…

• 画像を埋め込みましょう！

• 画像の幅や高さを指定しましょう！

• 横の罫線を表示しよう！

第５章-箇条書きを表示しよう！-

• リストの表示

• リストを表示しよう！

• ３段階のリストを作ってみよう！

第６章-リンクを設定しよう！-

• リンクについて

• ページ間をリンクで結びつけよう！

• ページ内の特定の部分へのリンクを設定しよう！

• 別のページの特定の部分へのリンク設定です！

• リンクにメールアドレスを設定する！

第７章-表を作ろう！-

• 表利用の前に…

• 表を作成しましょう！

• 表に罫線を表示しよう！

• 表に見出しセルを表示してみましょう！〜表の１行目を見出しセルに〜

• 表に見出しセルを表示してみましょう！〜表の１列目を見出しセルに〜

• 表に題名を表示する！

• 表の横幅を指定しよう！

• セル内の文字の横の位置を指定しよう！

• セル内の文字の縦の位置を指定しよう！

• セルを横に結合しましょう！

• セルを縦に結合しましょう！

• セルどうしの間隔を指定しよう！

• セル内の枠線と文字の間隔を指定しよう！

第８章-CSSの基礎！-

• スタイルシート（CSS）を利用しよう！

• CSS（Cascading Style Sheets）とは？

• CSSのメリット！

• CSSのデメリットはあるの？

• 見栄えを指定するHTMLはあまり使用しない

• CSSの記述！

• CSSの基本的な書式

• 一つのセレクタに複数のプロパティを指定しましょう！

• 改行や半角スペースを投入できる位置は？

• 複数のセレクタも指定できます！

• 記述をわかりやすくするためのコメント

• 単位と長さ

• CSSをHTMLに適応させる三つの方法

• どんな方法があるの？

• CSSの利用方法その１〜style属性を使う！〜

• CSSの利用方法その２〜style要素を使う！〜

• CSSの利用方法その３〜link要素を使う！〜

• 外部CSSファイルの作り方

• 特定の場所のデザインを変えるのに必要な知識は？

• タグにクラス名を付ける

• タグで区切られてない部分をデザインしたい！

第９章-フォント、テキストをデザインしよう！-

• 文字のデザインを設定しましょう

• 文字の大きさの指定

• 文字の太さの指定

• 文字の種類の指定

• 文字の色を指定

• 文字の色を指定しよう！

• 行の高さの設定

• 行の高さを設定しよう！

• テキストを配置しよう！

• 見出しや段落などのテキストを配置しよう！

• テキストの下線、上線などの指定

• 文字を装飾しよう！

• 文字列の縦方向の位置の指定

• 文字列や画像の縦方向の位置を指定！

第１０章-背景をデザインしよう！-

• 背景に関するプロパティ

• 背景に色を塗ろう！

• 背景に画像を設定しよう！

• 背景画像の繰り返しパターンの指定をしよう！

• 背景画像を好きな位置に配置しよう！

• 背景画像を固定しよう！

• 背景関連のプロパティをまとめて指定しよう！

第１１章-ボックスの指定-

• 余白（マージン）を指定しましょう！

• マージンとパディングの違いを知っておこう！

• 要素の上下左右のマージンの指定

• 上下左右のマージンをまとめて指定

• 枠線をデザインしよう！

• 枠線をデザインする前に…

• 枠線の太さを設定しよう！

• 枠線のスタイルを設定しよう！

• 枠線の色を設定しよう！

• 枠線の太さ、スタイル、色 をまとめて設定しよう！

• パディング（余白）の指定！

• パディング（余白）を指定しましょう！

• 幅と高さ

• 要素の幅や高さを指定しよう！

第１２章-回り込み-

• 回り込みの効果

• 回り込みや段組みを指定しよう！

• 回り込みを解除しよう！

第１３章-リストのデザイン-

• リストの行頭の記号の変更

• リストの行頭の記号を変更しましょう！

第１４章-疑似クラス-

• リンクをデザインしよう！

• リンクをデザインする前に…

• 未訪問のリンクをデザインしよう！

• 訪問済みのリンクをデザインしよう！

• マウスポインタをリンクに合わせたときのデザインを設定！

• マウスボタンが押されたときのリンクのデザインを設定！

第１５章-ホームページを公開しよう！-

• ホームページスペースを用意！

• ホームページスペースとは？

• プロバイダのホームページスペース

• 無料・有料レンタルサーバーのホームページスペース

• FTPソフトを用意しよう！

• FTPとは？

• FTPソフトのダウンロード

• ファイルのアップロード

• サーバー情報

• FFFTPでのファイルの転送

• Webページの確認

△ページトップへ <TOP>