全国ロケ地ガイド

　下記の日本地図は、1つのtableタグによって作成されています。 各都道府県を長方形で表現していますが、隣接する都道府県の位置関係と全体のバランスを考えて作成した日本地図です。
　tableタグを使うことで、ブラウザで文字の大きさの変更も可能ですし、ブラウザの横幅を変更すると、日本地図の大きさも変わるようになっています。
　この日本地図は、全国ロケ地ガイドの[地域IDX]で利用しています。著作権表示として、全国ロケ地ガイドへリンクして頂ければ、自由に利用して頂いて構いません。

　このテーブルタグ日本地図は、Webページの横幅に依存しないデザインとなっています。 横幅を狭くしても広くしても、実際の日本地図のイメージに近い形式で表示されます。
　横幅が可変となっているため、ブラウザの文字の大きさを変更しても、同じように見えるユニバーサルデザインになっています。 この点がテーブルタグを利用する一番のメリットだと思います。

　縦長のHTMLページは、縦スクロールが発生してしまい操作性が悪くなるため、できるだけ横長となるデザインとして設計してあります。
　北海道や東北地方の高さは、他の都道府県よりも高くすることで、全体のバランスが取れるようにしてありますが、あまり高くすると、縦スクロールが発生しやすくなるため、控えめにしてあります。

　tableタグのボーダーを設定することで、都道府県をL字型など複雑な形で表現することもできます。ただ、スタイルシートがない場合など、閲覧環境が制限されてしまうため、都道府県は長方形としてデザインしています。

　このテーブルタグ日本地図では、能登半島、富山湾、島原半島、有明海、瀬戸内海、紀伊半島、伊勢湾、東京湾、房総半島などが、分かるようなデザインとしてあります。

　このテーブルタグ日本地図では、内陸県（海なし県）である、栃木県、群馬県、埼玉県、山梨県、長野県、岐阜県、滋賀県、奈良県は、海に接しないように配置したデザインとしてあります。

　このテーブルタグ日本地図は、隣接する都道府県は、線か点で接するように配置し、隣接しない都道府県が線で接することがないように配置してあります。
　JR東北本線（国道4号）、 JR常磐線（国道6号）、 JR羽越本線（国道7号）、 JR奥羽本線（国道13号、国道7号）、 JR田沢湖線（国道46号）、 JR仙山線（国道48号）、 JR磐越西線（国道49号）、 JR東海道本線（国道1号、国道22号、国道21号、国道8号、国道2号）、 JR総武本線（国道14号）、 JR信越本線（国道18号、国道8号）、 JR高崎線（国道17号）、 JR上越線（国道17号）、 JR両毛線（国道50号）、 JR水戸線（国道50号）、 JR中央本線（国道20号、国道19号）、 JR北陸本線（国道8号）、 JR高山本線（国道41号）、 JR小浜線（国道27号）、 JR身延線（国道52号）、 JR山陽本線（国道2号）、 JR山陰本線（国道9号、国道191号）、 JR関西本線（国道25号）、 JR奈良線（国道24号）、 JR和歌山線（国道24号）、 JR阪和線（国道26号）、 JR紀勢本線（国道42号、国道23号）、 JR高徳線（国道11号）、 JR予讃線（国道11号）、 JR土讃線（国道32号）、 JR鹿児島本線（国道3号）、 JR日豊本線（国道10号）、 JR長崎本線（国道34号）、 JR豊肥本線（国道57号）など、 主要な鉄道や道路で結ばれている都道府県は、線で接するように考慮してあります。
　ただ、JR関西本線が通っている三重県と京都府は点で接しています。隣接する都道府県はすべて線で接するように作成したテーブルタグ日本地図は、テーブルタグ日本地図の変遷で紹介しています。

　このテーブルタグ日本地図は、実際の日本地図の各地域の比率を考慮してデザインしてあるため、実際の日本地図のイメージに近いデザインとなっています。
　ただし、北海道と沖縄県を含めると範囲が広すぎるため、実用性を考慮して本州、四国、九州を含む範囲を基準にしてあります。
　具体的には、下記の場所の位置を考慮して作成してあります。
　ドット比率は、tdタグの横幅の表示ドット数単位の比率で、横幅が広い場合に有効となります。また、文字比率は、横幅の文字単位の比率で、横幅が狭い場合に有効になります。この2つの比率が実際の地図に近い値に設定されていると、バランスの良い地図に見えるだけでなく、各都道府県の面積も表現されます。

　ただ、各都道府県の大きさが同じ大きさの方が使いやすいため、大きさの差を少なくしています。 ですから、この比率は全体のバランスを取る為の指標として使っています。

　このテーブルタグ日本地図は、地方による色分けしてあります。色は、JRのイメージカラーをベースに地方による色分けをしてあります。
　北陸地方は、中部地方にも含まれますので、中部地方に近い黄色としてあります。
　三重県は、中部地方に含まれる場合と、近畿地方に含まれる場合がありますが、JR東海の管理地域で名古屋との結びつきが深いため、中部地方としてあります。

　都道府県名には、北海道、神奈川、和歌山、鹿児島と、3文字となる場合があります。 名前が長いと、横幅を狭くした場合に改行が発生し、地図のバランスを大きく崩してしまいます。 そのため、colspanやwidth指定で横幅を広く取ることにより、改行が発生しにくくなるように考慮してあります。

　このテーブルタグ日本地図の画面のデザインはスタイルシートで行っています。 ですから、地方の色を変えたり、各都道府県の大きさを変えたりする場合は、スタイルシートの変更だけでできます。
　また、地図の複雑さに比べて、HTMLファイルはシンプルなため、利用しやすくなっています。
　さらに、スタイルシートがない場合でも、下記の画像のようにそれなりに表示されるようになっています。

　tableタグは、HTMLの基本要素ですので、あまりブラウザには依存しませんが、IE8, IE7, IE6, Firefox3, Safari4, Opera10, Sleipnir2で動作することを確認しています。
　また、テキストブラウザであるw3mでも動作することを確認しています。 w3mでは、スタイルシートが反映されませんので、下記の画像のように表示されます。

　このページのテーブルタグ日本地図は、下記のHTMLソースとスタイルシートをコピーして、HTML内に貼り付けることで利用できます。
　自由に利用して頂いて構いませんが、著作権は放棄していませんので、著作権表示として全国ロケ地ガイドへリンクをお願いいたします。

　上記ソースを、HTML内に埋め込めば、そのまま日本地図として使えます。
　スタイルは、styleタグ内に記述しても構いませんし、外部CSSファイルとして読み込むことも可能です。
　スタイル指定は、要素名とクラス名で限定していますので、他のスタイルシートの設定に影響することは、ほとんどありません。

　HTMLのclass="head"の部分は、日本海として表示される部分ですが、日本地図の見出しや説明などを記述することができます。
　多少、テキストが長くなっても、北海道と東北地方が縦に伸びるだけで、大きくデザインが崩れることはありません。

　HTMLのclass="foot"の部分は、右下の「(C)テーブルタグ日本地図」の著作権表示ですので、できるだけ残して頂きたいところです。もし、変更する場合は、別のページからのリンクをお願いいたします。

　HTMLの都道府県名をaタグで囲むことにより、各都道府県のページにリンクすることができます。

　HTMLの各都道府県のclass名を変更することで、所属する地方を変更することが出来ます。地方は、2文字の略号となっています。
　所属する地方を変更することで、「北陸地方は中部地方に含める」とか「中国地方と四国地方は1つにする」ということが可能です。
　また、都道府県がどの地方に属するかは、観点によって異なりますので、自由に設定可能です。 例えば、三重県は、交通はJR東海、国土交通省中部地方整備局の管理範囲が広く、電力は中部電力から供給されていますので、中部地方に分類されることもありますが、京に近い近国であったことから近畿地方に分類されることもあります。 新潟県は、道路は国土交通省北陸地方整備局ですし、気候的にも北陸地方に分類されますが、鉄道はJR東日本の管理範囲が広く、電力は東北電力から供給されていますので、北陸地方に分類できない面も多いです。

　各地方の色を変更したい場合は、スタイルシートのbackgroundの値を変更してください。地方名はコメントで記述してあります。

　各都道府県のサイズを変更したい場合は、スタイルシートのheightと、widthの値を変更してください。
　「北海道を大きくする」「秋田県と岩手県を大きくする」などの修正は、簡単にできます。
　幅を変更する場合は、合計で100%となるように振り分ける必要があります。

　全国ロケ地ガイドで利用している、テーブルタグ日本地図を作成するにあたり、いろいろな形式の日本地図を作成しました。テーブルタグ日本地図の変遷では、採用していない「テーブルタグ日本地図」を紹介しています。