右側のリストにあるスケルトン（骨格）のファイルを、ご自分のパソコンに保存してから、Composer，ビルダー，フロントページ・エクスプレスなど問題文を書き込み、テキストエディタで解答を書き込めば出来上がりです。問題数を増減するとき、採点関数をテキストエディタで調整します。（一つのファイルを、Composerとテキストエディタで同時に編集すると、様々なトラブルを生じます。Composerを閉じてからテキストエディタで編集するとうまくできます。（NavigatorやInternet Explorerとは両立できます.）その後、さらにComposerで形を整えることも可能です。）

下記の左側は考え方を書いた記事です。

「簡単な応答ページの作り方」

(1)クリカブルマップの利用」

(2)イベントｘｙ座標の取得，スタイルシートの利用」

　key = Math.floor(6 * Math.random());　で発生させた０から５の乱数で系列０〜５を決めます．これにより，toi[0] 〜toi[5]までのどれかの配列が選択されます．toi[0] 〜toi[5]までのどれについても，前半を０から９，後半を10から19までとして，無秩序に数字を並べておきます．０から９の要素に問題を割り当てると左側に表示されます．10から19までの要素に解答を割り当てると右側に表示されます．プログラム上は問題と解答の対応は見えませんが，問題：kakko201.gif(=kakko201.jpg）の解答がkakko301.gif(=kakko301.jpg)です．以下同様です．

　まず，Windows付属の「ペイント」により，のような画像を作成しておき（ＢＭＰファイル：問題１０個，解答１０個），そのままＪＰＧにバッチ変換したもの(ＪＰＧファイル２０個)と，紺色を透過色に指定した透過ＧＩＦ（ＧＩＦファイル２０個）の２種類合計40個のファイルを作ります．一つのＢＭＰファイルを２通りに保存する所が秘訣です．あとは，プログラム上でflagの値により，１つ選択して反転表示とするか，照合して判定するかを決めています．
　なお，正解となって画面から消えたカードが生き返らないようにsumi[]という配列に，「選択済み」のマークを入れています．
　プログラム上，解答から先に選択してもかまわないようになっていますが，ほとんどの生徒は問題から選択する思います．

　4)　ほとんどすべてのファイルで，テーブルを組むときに横幅750に設定しています．これは，少し前のノート型パソコンなどで800×600のものが多いためです．このような制限は２，３年もすれば不要になると思いますが，しばらくこうしておきます．（もし，640×480などのデスクトップがあるとしても，考慮していません．クライアント側のディスプレイの解像度や文字サイズによって，見かけが変わるのを防ぐには，スタイルシートを設定する方が確実だと思われますが，ＩＥとＮＮに応じた場合分けが大変なので一部しか使用していません．)

　5)　誰でもできる問題作成《国語教材：「百人一首」上の句，下の句カード合わせを作る場合》

ア　Netscape　Ｎavigatorで「かっこをはずす」を読み込みます．
イ　ファイル　→　ページを編集　→　ファイル　→　名前を付けて保存（自分のパソコンの特定ドライブ，特定ディレクトリを指定します．）
　　※　これで実際上のプログラムは完成しています．

留意点：
　サーバー側と同一のディレクトリ構造を作っておく
　以上の手順は，他の誰のホームページに対しても行うことができます．正確に言えば，画像データなどの参照ファイルがサーバ上の別ディレクトリに置かれているときは，参照ファイルは自動的にはついてきません．同一ディレクトリにあるファイルは一緒に連れてきます．もし，別ディレクトリ，例えばＩＭＧというディレクトリに画像ファイルが整理されているとき（ソースを表示すれば分かります）は，あらかじめ自分のディレクトリの中に同一構造のサブディレクトリを作成しておけば，参照されている画像ファイルもそのディレクトリに連れて来ることができます．
　私のホームページではこのような手間も省くため，画像ファイルなども全部同じディクトリに保存していますので，単純に　ファイル　→　ページを編集　→　ファイル　→　名前を付けて保存　としていただければ，ｂｏｄｙ部分に記述された画像ファイルは，全部ついてきます．
　なお，画像ファイルのうち，元のサイズとブラウザ上のサイズが異なる場合(width=... height=... の記述による)，マウスでドラッグするか画像をダブルクリックして縦横サイズを数値で入力するかして直さないと，元のホームページと見かけが異なる場合があります．
　私のホームページではこのような手間も省くため，原則として元のサイズを変更していません．

　コピーと著作権
　まず，ブラウザで閲覧するということは，閲覧者の意図とは無関係に，他人のホームページのコピーを自分のパソコン内に作成して，それを見るということですので，同一性が保持されている限り，著作権を侵害するということは考えにくいことです．ホームページとして公開してから，この段階での「コピー」が著作権侵害であるかどうかを議論することは，公開が間違いであるというのとほとんど同じです．
　これに対して，上記イのように，ファイル　→　ページを編集　→　ファイル　→　名前を付けて保存　とし，ホームページを改変していくと，著作権を侵害する可能性はあります．少なくとも同一性保持権を侵害しています．（自分のパソコン内で私的利用として研究するだけなら，問題ないでしょう．しかし，改変したものを，自分のホームページにアップするのは，全くの著作権侵害です．だから，ほとんどすべてのホームページについて，上記イの操作は，私的研究以外には使えません．）

ウ　百人一首のホームページを作成するために，Windowsのペイントなどを使って，上の句と下の句のカードを作成します．
実際に作成するＢＭＰファイルは　のようなものです．
これを，そのままＪＰＧ形式にBatch Conversionしたものと，背景色（紺色：color index=6）をtransparentに指定して
透過ＧＩＦにBatch Conversionしたもの　を作ります．
各々のファイル名をogura001,jpg, ogura101.jpg, ogura001.gif, orura101.gif などとします．
これで，初め透過GIFで見えていたものをクリックすると反転色に見えるようになります．また，○△◇001.GIFに対応するものは○△◇101.GIFとなります．

エ　Netscape Composer上で，問題文を書き換えます．また，タイトルは，書式　→　ページの配色とプロパティ　で直します．
オ　画像に文字が書いてある場合は，特に縦横の比率を変更して表示すると文字がつぶれて読みづらくなりますので，ブラウザ上の表示サイズをペイントで作成した元ファイルのサイズに合せます．秀丸（シェアウェア）などで，height=.. width=.. を一括置換します．
カ　上の句，下の句ファイル名を一括置換します：置換：kakko2 ->ogura0, kakko3->ogura1とします．
キ　HTMLファイルのヘッダ部分に書かれたファイルは，自動的にはついてきませんので，新たに正解のお知らせ（ＫＲメッセージ用)ファイルを作成して，kr[1].src=..として記入します．見本では，o63.gifとしています．）
キ　保存してでき上がりです．

※　Internet　Explorerで名前を付けて保存すると,画像は専用のディレクトリに保存されます.

→　試作品