「全日本中学高校 Web コンテスト」の参加を通した Web ページ制作

高等学校情報科
授業実践例
「全日本中学高校 Web コンテスト」の参加を通した Web ページ制作
岩田学園
岩田中・高等学校
八木
真也
（１）「はじめに」
平成２０年度から「情報」の授業でWebページの制作を実習として取り入れています。２０年
度はグループや個人で自由なテーマでの制作をしたのですが，２１年度以降は学校インターネ
ット教育推進協会(JAPIAS)が主催している「全日本中学高校WebコンテストThinkQuest JAPAN」
（http://www.thinkquest.jp/）に参加し，大会のルールに則って制作をしています。毎年少し
ずつ改良を加えていっていますが，ここでは昨年度の実践をもとにまとめたものをご紹介した
いと思います。少しでも参考になれば幸いです。
（２）Web ページ制作のねらい
最近はブログや SNS など手軽で簡単にインターネット上に情報を発信できるツールも増え，
スマートフォンの普及でインターネットでの情報収集もさらに身近なものになってきています。
そうした中で，Web ページがどのような仕組みでできているのかということを，生徒たちが作
り手の立場から知ることで， Web ページを利用した情報の送り手，受け手両方の立場から理解
を深められると考えました。また，画像ファイルの扱い方や FTP をつかったファイル転送，フ
ラッシュアニメーション，カラーコードなども扱うことができるため，情報のディジタル化や
ネットワークの仕組みなどもあわせて学習することができると考えました。
（３）環境
Web ページを制作する上で欠かせないのがハードウェアやソフトウェアの環境です。特にソ
フトウェアは市販のものは機能はすばらしいですが高価でなかなか購入できないので，本校の
授業では原則としてフリーソフトウェアを活用しています。以下利用環境です。
生徒が制作したページの一部
「ハードウェア」
・PC（４５台）
・スキャナ（２台）
「ソフトウェア」
・TeraPad（テキストエディタ：フリーソフト）
・ペイント（画像編集ソフト：ウィンドウズ標準）
・フォトエディター（画像編集ソフト：ウィンドウズ標準）
・ParaFla（フラッシュアニメーション作成ソフト：フリーソフト）
その他生徒が自分たちで見つけてきたフリーソフト等もこちらで一度チェックした後しよう
できるようにしています。
（４）実践内容
期間は Web コンテストの大会とあわせておおよそ４月から∼１０月くらいまで制作していま
す。長いように感じますが，実際にはすべてを実習に当てているわけではなく，関連している
内容の教科書も進めながら作業を行っています。昨年度を例にとって見ると大まかに以下のよ
うな時間配分になります。
HTML の基礎（４時間）
オリジナルワークシートを利用，Web ページ作成の基本事項を学習する
フラッシュアニメーションの作り方（４時間）
フリーソフトを使って簡単なアニメーションを作り Web ページに表示させる
チーム編成・テーマ決定（２時間）
３∼６人のチームを編成させ，大会要項に沿ったテーマを考えさせる
制作（１６時間）
（５）成果と課題
Web ページ制作で特に成果が出たのは知的財産権の理解ではないかと思います。Web コンテス
トの要項でも他者の著作物の利用に関してかなり細かい決まりがあり，それをクリアしながら
制作するのはかなり根気の要る作業でしたが，今までは，Web の情報はコピー＆ペーストが当
たり前だった生徒たちの意識がかなり変化したように感じました。また画像のディジタル化や
ネットワークの仕組みといった教科書の内容も実際に制作しながら学習することで理解度が高
まったように感じます。制作ではできる限り生徒たちの自由な部分を多くしたので，意欲的な
作品も多く，中にはコンテストで入賞する作品も出てきたことは本人たちの自信になったよう
です。
課題としては，どうしても制作時間を要するため，途中で飽きてしまった生徒たちの意欲を
どうやって戻していくか，あまりにも自由だと何をしてよいかわからなくなってしまう生徒も
多いため，ある程度はこちらで資料やワークシート等を用意しておく必要がありますが，その
内容をどうしていくかといったことが考えられます。
最後に，大会で入賞を果たした生徒たちの作品の URL を掲載いたします。まったくの初心者
が半年間でここまでできるということを見ていただければ幸いです。
Let's
Go Fishing（http://thinkquest.jp/library/12win/team120319.html）
ComicMade ∼マンガができるまで∼（http://thinkquest.jp/library/12win/team120320.html）
The 平安（http://thinkquest.jp/library/12win/team120201.html）
sympathy (http://contest.thinkquest.jp/tqj2010/120197)
タイムトラベル（http://contest.thinkquest.jp/tqj14/140042/）