(10)分業・協業・情報処理(忠臣蔵史料集を例に)
(10)分業・協業データを情報処理でリンク1(ページの相互リンク)

(1)汎用性のあるボタンの作成
汎用性のあるボタンの作成
<P>
<A href="index.htm"><IMG src="02index.gif" alt="back" height="31" width="87"></A>
<A href="00ndx.htm"><IMG src="02home.gif" alt="back" height="31" width="87"></A>
<A href="01.htm"><IMG src="02back.gif" alt="back" height="31" width="87"></A>
<A href="02.htm"><IMG src="02next.gif" alt="back" height="31" width="87"></A>
</P>
(赤四角)で囲んだ部分のソース画面(設計図)

(1)「汎用性のある」とは「ほとんどのページで使用できる」という意味です。
(2)(赤四角)で囲んだ部分は、「汎用性のある」リンクに設定しています。
(3)ソース画面で見た設計図は、タグ言語(又はHTML言語)といいます。
(4)<IMG src="02index.gif"・・>は、赤色のボタンを使うタグ言語です。
(5)ここでは「home」(26home)シリーズを使うので、ダウンロードします。
ソース画面を見る方法←クリック
タグ言語の見方←クリック
写真やボタン・アイコンのダウンロード←クリック

(2)小目次をブラウザ化して「33 堀部弥兵衛から大石内蔵助へ」をクリック
小目次をブラウザ化して「33 堀部弥兵衛から大石内蔵助へ」をクリック

(3)「33 堀部弥兵衛から大石内蔵助へ」のページにジャンプ
追テ
 如斯相認封ノ上書仕候処、旧臘廿七日ノ御状正月九日出ノ由ニテ寺井方ヨリ相届早々拝見、各様弥御堅固珍重奉存候、併郡兵衛殿御病気御様子ニ相見無御心元ノ段常々御病身ノ御事ニ候間、左様ノ御事ト存候
  正月十七日           源吾判
   郡兵衛様
   安兵衛様
   兵左衛門様
「33 堀部弥兵衛から大石内蔵助へ」のページにジャンプ

(4)「33 堀部弥兵衛から大石内蔵助へ」のメモ帳(ソース画面)
<BODY bgcolor="#ffffff">

<CENTER>
<TD align="left"> 大石内蔵助方へ弥兵衛方ヨリ返書留<BR>
「33 堀部弥兵衛から大石内蔵助へ」のメモ帳(ソース画面)
ソース画面を見る方法←クリック

(5)「33 弥兵衛から・」のメモ帳に「汎用性のある」ボタンのソースを貼り付け
<BODY bgcolor="#ffffff">

@<P>
<A href="index.htm"><IMG src="02index.gif" alt="back" height="31" width="87"></A>
<A href="00ndx.htm"><IMG src="02home.gif" alt="back" height="31" width="87"></A>
<A href="01.htm"><IMG src="02back.gif" alt="back" height="31" width="87"></A>
<A href="02.htm"><IMG src="02next.gif" alt="back" height="31" width="87"></A>
</P>@

<CENTER>
<TD align="left"> 大石内蔵助方へ弥兵衛方ヨリ返書留<BR>
「33 弥兵衛から・」のメモ帳に「汎用性のある」ボタンのソースを貼り付け

(1)(4)のメモ帳に(1)の「汎用性のある」ソース(設計図)を貼り付けます。
(2)@@が張り付けられたソース(タグ言語)です。

(6)ボタンソースを貼り付けた「33 弥兵衛から・」のメモ帳を検証
<BODY bgcolor="#ffffff">

@<P>
@<A href="index.htm"><IMG src="02index.gif" alt="back" height="31" width="87"></A>
A<A href="00ndx.htm"><IMG src="02home.gif" alt="back" height="31" width="87"></A>
B<A href="01.htm"><IMG src="02back.gif" alt="back" height="31" width="87"></A>
C<A href="02.htm"><IMG src="02next.gif" alt="back" height="31" width="87"></A>
</P>@

<CENTER>
<TD align="left"> 大石内蔵助方へ弥兵衛方ヨリ返書留<BR>
ボタンソースを貼り付けた「33 弥兵衛から・」のメモ帳を検証

(1)@以下は「index」へのリンクなので不要です。削除します。
(2)A以下は小目次ページにリンクなので「01ndx」に変更します。
(3)B以下はbackページにリンクです。現在は「33-メモ帳」(33ページ)です。(33ページ)の1つ「back」は「32」です。
(4)C以下はnextページにリンクです。現在は「33-メモ帳」(33ページ)です。(33ページ)の1つnextは「34」です。
(5)「汎用性のある」ボタンのタグ言語は、赤のボタン(02home.gif)です。ここでは青のボタンなので「26」(home.gif)に変更します。

(7)「33 堀部弥兵衛から大石内蔵助へ」のメモ帳(ソース画面)を変更
<BODY bgcolor="#ffffff">

@<P>
A<A href="01ndx.htm"><IMG src="26home.gif" alt="back" height="31" width="87"></A>
B<A href="32.htm"><IMG src="26back.gif" alt="back" height="31" width="87"></A>
C<A href="34.htm"><IMG src="26next.gif" alt="back" height="31" width="87"></A>
</P>@

<CENTER>
<TD align="left"> 大石内蔵助方へ弥兵衛方ヨリ返書留<BR>
「33 堀部弥兵衛から大石内蔵助へ」のメモ帳(ソース画面)を変更

(1)「33-メモ帳」が変更する上でのキーワードです。
ソース画面を閉じる←クリック

(8)ブラウザ画面で確認
大石内蔵助方へ弥兵衛方ヨリ返書留
 旧臘廿五日ノ貴書当月十七日相達拝見仕候、道中無恙御上着弥御健達御超歳可被成ト改年ノ御祝儀努力目出度申納候、然ハ隠居ノ義ニ付品々被仰下候

ニテモ指図ハ不申聞候、恐惶謹言
  正月廿六日         堀部弥兵衛判
   大石内蔵助様
ブラウザ画面で確認
(1)ブラウザ画面で「メモ帳」(タグ言語)で変更した部分を更新する。
(2)「home」「back」「next」をクリックして、リンクが正常化を確認する。