仕切り線 ようこそ、A班HP勉強会のページへ!

練習問題

  • トップ
  • 事前準備
  • フォルダー構造作成
  • ビルダーの起動
  • ビルダーの初期設定
  • 編集画面の設定
  • Web ページ
  • バージョン選択
  • ページ作成
  • ファイル保存
  • ブラウザ確認
  • HTML の基礎
  • 文字の入力
  • 見出しタグ
  • 練習1 index.html
  • 段落タグ
  • 水平線の挿入
  • 練習2 dog.html
  • 強調表示
  • イメージの配置
  • リストの挿入
  • リストの入れ子
  • 住所・著作情報
  • 区画
  • リンクの挿入
  • ページ内リンク
  • トップページ
  • CSS の基礎
  • スタイルの指定
  • 文字フォント指定
  • 文字色の指定
  • 文字位置指定
  • 背景画像
  • 画像を回り込む
  • ボーダー指定
  • 間隔・余白指定
  • 中央揃え
  • リンクの修飾
  • 対象限定スタイル
  • トップページ装飾
  • 外部 CSS
  • レイアウト
  • 1カラム
  • 2カラム
  • 参考資料
  • 参加者作品
  • 問い合わせ

~フォルダー構造作成~

ここではビルダーを使って サイトを作成する前の準備項目を説明します。

準備するフォルダー構造とは

[マイドキュメント]下に、ホームページ専用のフォルダー構成を作ります。

ホームページ・ビルダーのサイト作成の流れの途中でもフォルダーを作成できるのですが、Windows のエクスプローラーで単独に作成することで、その名前や場所を簡単に認識でき混乱を避けるるためにも、あらかじめ作成しておきます。

トップ フォルダーはサイトを作成する際には、サイトのトップ フォルダーとなります。サイトを作成すると、トップ フォルダー名の変更はできません。サブ フォルダーは、ファイル形式別に作成すると管理しやすいでしょう。

フォルダー構成は、新しくサイトを作るごとに新しく作ります。サイト内の作業で作成され、編集された HTML ファイルや付随するファイルなどは該当のフォルダー下に保存することになります。

ヒント今なぜフォルダーを作らなければならないか、あるいは、作っておいた方が良いか、については、ホームページを保存するフォルダーを作っておこうにアクセスします。

準備内容

➊ エクスプローラーを起動します。

ヒントエクスプローラーは、タスクバーにある、ライブラリ アイコン ライブラリアイコン をクリックすることで素早く起動できます。

➋ [マイドキュメント] 下に、以下のようなホルダー構造を作ります。準備するフォルダー構造

ヒント設定のヒント:
大かっこ [xxxx] 内はフォルダー名です。トップ フォルダー名 A班HP勉強会(名前) は日本語でも構いませんが、サブ フォルダー名 html、img、css は必ず半角英数字で名前を付けます。(大括弧 [ ] は記入しません。)

ヒント[マイドキュメント] と トップホルダーの階層の間にいくつかの階層があっても構いません。

➌ エクスプローラーを閉じます。

➍ 再度エクスプローラーを起動し、[ドキュメント]から、作成したトップフォルダーまで辿れることを確認します。

  • 作成されたフォルダ構造

ヒントトップフォルダーが分からなくなったら、マイドキュメントから辿ることで見つけるようにしましょう。

⇒ ビルダー起動 へ進む


| |