楽しい「情報」演習 第5回(最終回)
自分の好きなテーマのWebページを作ろう
〜情報発信の楽しさを知ろう〜
 

神奈川県立川崎北高等学校
柴田 功
isao@johoka.net
http://www.johoka.net

 はじめに
 ハイパーリンクや、画像貼りつけなどWebページ作成技術を指導するのは簡単ですが、そのWebページ全体のテーマやコンテンツをどうするかといった指導は大変難しいものです。テーマを教員側から与えてしまうと生徒のモチベーションは低くなり、そうかといって自分でテーマを決めなさいといっても、多くの生徒はなかなか発信するテーマが見つからないようです。ここでは、Webページテーマを自分ひとりで考えて、サイトを作成し、実際に公開、更新をする演習を紹介します。
 DATA
 選択科目「情報基礎」(3学年2単位)〜2003年度からは専門教科「情報と表現」で扱う予定。
40人に4人のティームティーチングによる指導
生徒用パソコン教室PC40台
ソフトウェア Windows98SE、Office2000、IBMホームページビルダー2001
サーバ WindowsNT4.0
第1週 テーマ決め、サイトの設計
第2週〜第5週 コンテンツ作成
第6週 相互評価、改善、自己点検、FTP、更新
 準備  
  • コンピュータ教室内のサーバに生徒一人ひとりのフォルダ(ディレクトリ)を作成し、先生と本人はフルアクセスで、その他の生徒は読み取り専用にします。
  • インターネットでWebページを公開できるサーバを用意します。ホスティングサービスなど利用すれば独自ドメイン+50MBで月5000円程度でサーバを借りることができます。
 Webページ作成の手順 
 Webページ作成は、下図のような手順で進めていきます。いきなり素晴らしいものを作る必要はなく、簡単なWebページからスタートして、少しずつ新しい情報を追加していくことが大切であることを伝えます。Webページには完成がありませんので、この演習後にも自分のペースで楽しみながら更新していけるようになって欲しいところです。
テーマを決める(内容、タイトル、イメージカラー、タイトルロゴ)
素材を集める(本文、写真、イラスト)
Webページ作成 更新
リンクの確認
ファイル転送
 Webページ作成の7つ道具
Webページ作成に必要な道具をあげてみました。
  1. パソコン〜どんなOSのパソコンでもWebページは作成できます。
  2. 通信環境〜インターネットに接続しファイルを転送します。公開してこそWebページです。
  3. エディタ〜「メモ帳」でもWebページは作れますが、ここではホームページビルダーを使って進めます。
  4. 画像編集ソフト〜GIF形式、JPEG形式で保存できるものが必要です。
  5. ブラウザ〜作成したWebページを開いて見え方やリンクを確認します
  6. スキャナまたはデジタルカメラ〜なくてもWebページは作れますが、あれば写真等を掲載できます。
  7. ネタ〜これがなくては作れません。日記やスクラップブックにネタを蓄えておきましょう。
  8. (番外編)情熱〜最も重要な要素かもしれません。また、モラルやマナーも大切です。
 情報モラルとマナー 
 Webページを開設する上で気を付けなくてはならないことがいくつかありますので、以下のことに気を付けましょう。
  1. 著作権〜イラストや音楽などには制作者に著作権があります。一般的には作者に無断でイラストや音楽をWebページに貼りつけてはいけません。
  2. 個人情報の保護〜個人の住所や電話番号をWebページに掲載すると悪用されることがあるので載せないようにしましょう。
  3. 肖像権〜友人などの顔写真を本人に無断でWebページに掲載してはいけません。
  4. 有害情報〜Webページに猥褻、暴力、犯罪、差別といった内容を含んでいないか注意します。
  5. アクセシビリティ〜見てくれる人のことを考え、どんな受信環境でも見やすいページ作りをめざしましょう。
 ファイルとフォルダの基礎知識
 Webページに使っているファイルはFTPツールを使ってWWWサーバに転送します。WWWサーバではWindows環境とはファイル名の付け方など違うルールがありますので気を付けましょう。
Webページを保存している
フォルダの中身
  1. フォルダオプションの設定で拡張子を表示させておく
    Webページはファイル名に「.htm」「.gif」「.jpeg」といった拡張子がついたファイルからできています。それらのファイルを保存するフォルダを新規作成し、そのフォルダの「フォルダオプション」〜「表示」〜「登録されている拡張子を表示しない」のチェックを外し、拡張子が表示されるようにします。(右図)
  2. ファイル名は半角英数字のみ
    ファイル名には全角文字は使えません。また、ローマ数字や丸数字、半角カタカナなどもファイル名に使えませんので気を付けましょう。
    (例)×自己紹介.htm  ×PROFILE.HTM  ○profile.htm
  3. ファイル名は小文字に統一
    Windowsではファイル名が大文字と小文字で区別されませんが、UNIXでは区別されますので、どちらかに統一するようにしましょう。ここでは小文字に統一していきます。
    (例)index.htm と INDEX.HTM とINDEX.htm はそれぞれ違うファイルになる。
  4. TOPページのファイル名はindex.htm
    index.htm(またはindex.html)というファイル名は特別な意味を持ちます。ブラウザでURLのファイル名を省略したばあいindex.htmが表示されます。
 テーマを考えよう
 テーマを決めないでWebページ作成を始めた場合、ほとんどの人は1、2ページ作ったあたりで作業が行き詰まってしまいます。そうならないように、作業に入る前からどんなテーマのWebページにするのかをしっかり決めておく必要があります。「私にはWebページにするようなネタがないよ!」という声をよく聞きますが、そんなことはありません。一人ひとりの経験や考えは価値があり、十分にWebページのネタになるのです。では、どうやってテーマを決めるのか、順を追って進めて行きましょう。
 (1) 自分の身の回りのことを見つめてみよう
 あなたの趣味や経験、所属など思いつくままメモ用紙に落書きしてみましょう。

【趣味・特技】〜音楽、ファッション、スポーツ、映画、小説、料理
【体験・経験】〜旅行、怖い体験、面白い体験、腹の立つ出来事
【地域・出身】〜住んでいる町、田舎、学校の周辺、最寄りの駅、通学経路
【学校・所属】〜高校、部活動、委員会、クラス、体育祭応援団、出身中学
【好きなもの】〜作家、画家、教科、歴史上の人物、
【 学校生活 】〜行事、友達、校舎、先生、校歌
 (2)2つのテーマを選んでみよう
 その落書きの中にはWebページにできるネタがたくさん潜んでいます。自分ひとりで決めるよりも、友人や先生に相談すると良いヒントが得られることがあります。また、2つのネタを組み合わせることで貴重なテーマになることがあります。

例1)「通学経路」+「面白い体験」
例2)「地元の町」+「おいしいラーメン屋」
例3)「最寄り駅」+「ユニバーサルデザイン」

例えば「ユニバーサルデザイン」に関するサイトはいくつでもありますが、あなたの住む町の「ユニバーサルデザイン」を検証するサイトは大変存在価値のあるサイトになります。
 (3)タイトルを考えよう
 テーマが決まったらタイトルを考えましょう。タイトルから内容が想像できるような分かりやすいタイトルが理想です。「○○ちゃんの○○な部屋」といった独りよがりのタイトルは避けましょう。限られた文字数のタイトルで内容がある程度わかって、しかも興味がわくようなものにするといった点でWebページのタイトルとテレビ番組のタイトルには共通点が見られます。ヒントにしてみてください。
 (4)参考になるWebページを閲覧しよう
 テーマが決まったら、同じようなテーマで既に開設しているページを探して見ます。作る立場になってWebページを閲覧すると内容だけでなく、配色やイラスト、ロゴなどのデザインやページの構成、リンクの仕方など、いろいろと参考になることが見つかると思います。参考になったサイトはいずれリンク集を作ることも考えて「お気に入り」に登録しておきましょう。
 (5)ページ構成を考える
 TOPページから始まるページ構成を考えておきます。最初はTOPページの他に自己紹介、リンク集、更新履歴(または日記)など4ページくらいで十分ですが、ページが増えたときのことを考えておきます。
 (6)デザインを考える
 1ページ目は赤、2ページ目は青などと気まぐれでページを作成していくと全体としたまとまりのないサイトができあがってしまいます。テーマと同様に作成作業の前にデザイン(背景色、文字色、レイアウト、イラスト、ロゴ、アイコン、ボタン等)を決めておく必要があります。どのページにも同じロゴが表示されるようにしておくと全体のまとまりが出てきます。
 (7)素材を用意する
 イラスト、壁紙などのデザインに関するもの、文章や写真などの内容に関するものなどを用意をしておきます。参考図書や新聞、地図、メモ、日記なども役に立ちます。
 相互評価&自己点検
 4ページ程度のWebページが完成したら、生徒を5人くらいのグループに分け、グループ内で相互評価をします(評価項目は内容、デザイン、モラル等)。相互評価シートを受け取った後、各自改善する時間を設けます。
 次に、ファイル転送の前に公開して問題がないか、自己点検をします(点検シートはこちら)。問題がなければ教員が生徒のファイルを一括してWWWサーバにファイル転送します。
 まとめ・評価
 テーマが決まりさえすれば、ホームページビルダーの機能やスキャナーやデジタルカメラの使い方などをある程度教えるだけで、生徒はどんどんとWebページを作成していきます。テーマ決めが最も難しい指導だと実感しました。
 Webページの評価ではテーマやデザイン、内容など点数化しにくい評価項目が入るので苦労します。特定の教員の好みに評価が偏らないように、本校の場合は、生徒の自己評価、相互評価を参考にして、情報の授業担当者全員が、全生徒の作品を評価しました。その平均をもとに決めています。作品をインターネットで公開しているので自宅でも作品を評価できるのが便利でした。評価項目は以下の通りです。
  • 情報の内容〜テーマ、本文
  • Webページのデザイン〜配色、レイアウト、リンクボタン、アイコン、ロゴ
  • 情報モラル・マナー〜著作権、肖像権、個人情報、誹謗中傷しない
  • アクセシビリティ〜代替文字、ナビゲーション
 最後に
 情報発信を指導する教員は、自ら情報発信すべきだというのが私の考えで、その実践として高校サッカー通信新教科「情報」授業アイデア集といったサイトを運営してきました。これらのWebページのおかげで、多くの方と出会い、感激することが多くありました。大げさな言い方をすれば私の人生を変えてしまったとも言えます。この喜びを是非、生徒にも経験させたいという思いがあり、この演習ではつい力が入ってしまいます。影の部分ばかりを気にして情報発信に対して臆病になっていることは、交通事故が怖いから教習所内に留まり、せっかくの素晴らしい景色を見ながらドライブすることなく終わることと同じです。現代の技術のおかげでできるようになった、手軽で低コストな情報発信に是非、チャレンジしてみてください。