コンピュータ基礎演習３

コンピュータ基礎演習４

リンク

第３回　Dreamweaverの基本[マークアップ]（4月23日）

課題：Dreamweaverを使っての文書のマークアップ

指定のテキストにDreamweaverを使ってマークアップする

授業前の準備

  • 教材のダウンロード：web_02.zip
  • ダウンロードしたフォルダの名前を変更する
    • 例：web_02_10810000
  • 授業終了時にはフォルダを削除すること
  • 必要に応じてデータは各自でUSBメモリなどにコピーする

サイト設定

  • Dreamweaverを起動し、「サイト」メニューから「新規サイト...」を選択する
  • サイト名とローカルルートフォルダを設定する：設定例
  • 退室時はサイト設定を削除してからDreamweaverを終了する

新規ファイルの作成

  • 「ファイル」メニューから「新規...」を選択する
  • 新規ファイルパネルで「空白ページ＞HTML＞なし」を選択、ドキュメントタイプは「XHTML 1.0 Transitional(トランジショナル)」を選択して「作成」をクリックする
  • 作成したファイルをサイトルートに保存する（ファイル名と拡張子に注意）
  • 作業はできるだけ分割ビューで行う
  • ページタイトルを設定する

マークアップ

  • テキストデータを流し込みマークアップ（定義付け）を行う
  • 定義付けは基本的に段落単位で行う
  • 段落を選択し、プロパティパネルのフォーマット、もしくはテキストメニューの段落フォーマットからフォーマットを選択する
  • 箇条書きやメニューなどはリストフォーマットを適用する
  • 見出しフォーマット適用のルール
    • 見出し１が最も重要度が高い
    • 見出し１（<h1>）は１ファイルに１度だけ使用できる
    • 見出し１から順序を守って使用する
    • 文字の大きさで適用する見出しを選択しない

画像の配置

  • 画像はファイルパネルからドラッグ＆ドロップで配置する
  • 画像を挿入するとアクセシビリティ設定ダイアログが表示されるので代替テキストを設定する
  • 設定ダイアログが表示されない場合や代替テキストを変更する場合はプロパティパネルで設定する

評価ポイント

  • ファイル名が正しく設定できているか？（20点）
  • ページタイトルが正しく設定できているか？（20点）
  • マークアップが適切に行われているか？（20点）
  • 見出しフォーマット適用ルールを守れているか？（20点）
  • 画像の挿入と代替テキストの設定が正しくできているか？（20点）

HTMLファイルのみを提出する

ファイル名に全角文字や記号を使わないこと

提出期限は授業日の翌週の月曜日の午後９時まで