ここで解説するのは、本サイトのように定型ファイルが多くあるサイトを対象にしています。例えば、リンク集やレビューなどの作品紹介のサイトです。
最初が肝心です。 最初にどれだけサイトの全体像を思い浮かべられるかです。 とはいえ、右も左も分からない頃のこと、ＨＴＭＬの使い方からデザイン、内容に至るまで 再考の余地がでてくることでしょう。 そんな時にCSVファイルに内容を書きとめ、bpTranのようなツールでＨＴＭＬファイルに出力する。 という作業をすれば、内容の変更もデザインの変更も簡単に出来ます。 気をつけることは検索できるよう表記の統一をすることだけです。
２００３年１月現在、フリーソフトにはうまくHTLMからデータを抽出するツールはありません。ある程度のプログラミングが出来るのなら抽出は可能でしょうが、それが出来ないか面倒な方向けに、あらゆるツールを使いうまくデータを抽出する方法を解説します。本サイトの抽出方法を元に説明していきます。
まず、テーブルを使用していて、ROWSPAN、COLSPANを使用している場合は、Table to CSVを使用して下さい。 その後、ＦｉｌｅＧｒｅｐで矢印などをうまく置換してテーブル内の情報を集める（例：「↑」を「,」）。 これがうまくいかない場合、元ファイルの複数タグなどを元に置換するとうまく行くでしょう。 うまく行けば、読まれたくないよ のようなツールで改行ををなくします。 そのファイルをJoin Man Miniなどの結合ツールで結合します。 その他、テーブル外の要素の近くに定型文（例：公開日）がある場合、最終手段としてＦｉｌｅＧｒｅｐで検索して、 結果を保存して置換して欲しいデータを取り出します。 それでもだめな場合は一つ一つ自分で取り出すしかないようです。 気をつけるのは各行の項目が正しく取り出せているかどうかです。 取り出せたら、Cassava Editorで編集することをお勧めします。
この頃、Webサイトの規模が大きくなったこともありWebサイトの更新作業が非常に時間のかかるものになりました。 そこで他のサイトではどのようにしているのか調べてみたのですが、どこにも書いてありません。 というわけで、自分が欲しいページなのだから誰かの役にたつかもしれないので自分の更新手順を 書いてみました。
256色以下のゲームはPNG、それ以外はJPEG。「Capture STAFF - Light -」では拡張子が大文字に なるので小文字に変更。「ＦｉｌｅＧｒｅｐ」で収集しておいたデータから発売日、スタッフ欄を検索。 「Cassava Editor」でCSVファイルを編集。「bpTran」でCSVファイルとテンプレートから各感想ページ、変更箇所、（たまに）各種リンク集 を出力。「縦横幅」を使い属性を書き込む。取り上げたゲーム本数を増やし、変更箇所を出力しておいたデータからコピー、貼り付けを行う。 「ＦＦＦＴＰ」を使って更新。
（ミラーサイト用として、全ファイルをコピーし、「index.html」と「sort3.html」と「zenbu.html」を除きアドレス情報をミラーサイトのものに置換。後にこれらのファイルを書き換え、更新する。）
[公開日]：「<A href="[リンク]">[題名][副題][種別]</A>:[コーナー]」<BR> <A href="[リンク]" target="_blank">[題名][種別]</A>：[コーナー],[評価]<BR> <A href="[リンク]" target="MAIN">[題名][種別]</A>：[コーナー],[評価]<BR> <TR><TD><A href="[リンク]">[題名][副題][種別]</A></TD><TD>[評価]</TD><TD> [一言]</TD><TD>[長所]</TD><TD>[短所]</TD><TD>[Ｗｉｎ版]</TD></TR> <TR><TD><A href="[リンク]">[題名][副題][種別]</A></TD><TD>[評価]</TD><TD> [一言]</TD><TD>[長所]</TD><TD>[短所]</TD></TR>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML lang="ja">
<head>
<META http-equiv="Content-Type" content="text/html;charset=EUC-JP">
<META http-equiv="Content-Style-Type" content="text/css">
<title>[題名][副題]</title>
<style type="text/css">
<!--
BODY{ color: #ffffff; background:#330000;}
.line{line-height: 150%; }
A{text-decoration:none;font-weight:bold;}
A:Link{color:#99FFFF;}
A:Visited{color:#33FFFF;}
A:Active{color:#99FFFF;}
A:Hover{color:#ff0000;text-decoration:underline;}
.1{border:2px solid #666666;}
.2{border-style:solid;border-width:0px 2px 2px 2px;border-color:#666666;}
.center{text-align:center;}
.3{border:dotted 2px #330000;background-color:#660000;text-align:center;
line-height:150%;margin:5px 0px 5px 0px;padding:2px 0px 2px 0px;}
-->
</style>
</head>
<body>公開日：[公開日] 種類：[コーナー] 公開場所：<A href="http://kiisu.egono.com/">廃虚碑文 ～無名作品の発掘？～</A><BR>
<div class="bo3"><B>[題名]</B> [副題][種別] </div>
<table summary="layout"><tr><td width="40%" valign="top" class="line">
<div class="1">製作：<B>[製作]</B></div>
<div class="2">[発売日]</div>
<div class="2">[スタッフ]</div>
<div class="2">シナリオ:[シナリオ] グラフィック:[グラフィック] システム:[システム] 総合:<B>[総合]</B></div>
<div class="2">長所:[長所] 短所:[短所]</div></TD>
<TD class="line"><div class="1">[感想]</div><div class="2">[関連]</div></TD></tr></table>
<div class="center"><IMG src="[画像]" alt="©[製作]（持ち出し厳禁）"></div>
</body></html>