課題: ネット上の記事へのコメントのWebページを作成する
前回と同様に、HTMLファイルを作成していきます。
HTMLファイルの内容は、
「インターネット上のあらゆる記事へのコメント」
とします。
1. インターネット上の記事にコメントをする
(1) 情報を集める
自分が現在興味のあるテーマについて、
インターネットからニュース等を探して、
自分が興味を持った記事を1つ集めなさい。
(2) 情報にコメントをつける
記事を探したら、次の順にコメントを作りなさい。
なお、文字数は、「200文字以上」としますが、
内容はささいなことでかまいません。
やり方は、第3回の課題と同じです。
第3回の課題の説明を見てください。
2. HTMLファイルの作成
第4回の課題で作成したファイルをもとに、
今回の課題を作成します。
(1) ファイルのコピー
第4回の課題のファイルをコピーして、新しいファイルを作ってください。
ファイルには、次のようなファイル名をつけてください。
- 「0518」+「学籍番号」+「.html」(半角文字で!)
(学籍番号がC2092000の場合、ファイル名は 0518c2092000.html」)
(2) HTMLのレイアウト
作成するページのレイアウトは、
下の図を参考にしてください。
また、作成するときには、
第4回の課題での注意点を参考に、
今回分のコメントと目次へのリンクを作成します。
- ページのレイアウトの例
ページのタイトル
目次
・第5回のコメントへのリンク
・第4回のコメントへのリンク
・第3回のコメントへのリンク
・第2回のコメントへのリンク
・プロフィール
---
第5回の課題のコメント
...
[トップへ戻る]
第4回の課題のコメント
...
[トップへ戻る]
第3回の課題のコメント
...
[トップへ戻る]
第2回の課題のコメント
...
[トップへ戻る]
プロフィール
...
[トップへ戻る]
---
連絡先・著作権の情報
(3) プロフィールへの画像の追加
プロフィール(自己紹介)のところに、
自画像や自分の好きなものなどの、
プロフィール用の画像を作成してもらいます。
Windows付属の「ペイント」を使って描きます。
- 「スタート」ボタンをクリックして、「プログラム」→「アクセサリ」→「ペイント」の順に選択
- 「ペイント」が起動したら、メニューから「変形」→「キャンバスの色とサイズ」を選択
- 「幅(W)」を「100」、「高さ(H)」を「100」に設定
- 「OK」ボタンをクリック
ペイントの機能を活用して、自由に自分のプロフィール画像を描いてください。
描けたら、次のようにして保存してください。
- メニューから「ファイル」→「名前をつけて保存」を選択
- ファイルを保存する場所を「マイドキュメント」に選択
- 「ファイルの種類」を「PNG (*.PNG)」に設定
- ファイル名に「profile.png」を設定(半角文字で!)
- 「保存」ボタンをクリック
最後に、次のように見出しを設定したり、
プロフィール用の画像を貼り付けてください。
- 「プロフィール」の見出しの下に、h3要素で「イメージ」という見出しを書く
- 今回学習した image要素を使って、作成したプロフィール用の画像を貼り付ける
- 最後の「10の質問」の前に、h3要素で「自己紹介」という見出しを書く
- プロフィール部分の例
プロフィール
イメージ
自己紹介
| ○○への10の質問 |
|質問 1 ...|回答 1 ...|
|質問 2 ...|回答 2 ...|
| ...| ...|
|質問 9 ...|回答 9 ...|
|質問 10 ...|回答 10 ...|
(4) HTMLファイルの作成
第3回から今回までに説明した、HTMLの技術を使って、
自分のコメントからHTMLファイルを作成してください。
注意点は、次のとおりです。
- 情報源へのURLは、その情報源にアクセスできるようにリンクにすること
- 第3回の課題で説明した注意点を守る
- ページの中に書いた、すべてのhr要素の属性(width,size)を削除する
例: <hr size="80%"> ―<訂正後>→ <hr>
- ファイルの最後にある、連絡先の「更新日」の日付を更新する
<address>
作成日: 2010-04-20; 更新日: 2010-05-18<br>
Copyright (C) 2010 兵庫太郎, All rights reserved.<br>
このページに関する問合せ先:<br>
E-Mail. <a href="mailto:c2092000@ed.hyogo-dai.ac.jp">c2092000@ed.hyogo-dai.ac.jp</a>
</address>
まだ提出ではありません。
次へに進んで、課題を行ってください。