| ２種類の相互リンクの特徴 |
相互リンクには大きく分けると画像と文字との２種類になります。
１．の「テキストで貼る」（テキストリンク）とは、画面上の文字だけでリンクが貼ってあるものです。 例） シニアSOHOサーチ この文字の上をクリックするとシニアSOHOサーチに ジャンプ（見ることが）出来ますよね。これがテキストリンクです。 次に、２．の「画像でのバナー表示」とは、画面上に画像でリンクが貼ってあるものです。 シニアSOHOサーチのバナー（画像）リンクは下記になります。 ここでも画像の上にカーソルをもってきてクリックすると、シニアSOHOサーチの トップHPにジャンプ（見ることが）出来ます。これが、バナーリンクです。 この２種類の相互リンクのやり方、テキストでもバナーでも、ご自分の HPに貼り付けていくために、多くのHPには「相互リンクについて」「相互リンク」 というように、相互リンクについての説明のコーナーがあります。 （シニアSOHOサーチの相互リンクの貼り方はここから） そこには、テキストの場合、バナーの場合、というように、それらの「タグ」が 書いてあります。その「タグ」をコピーして、ご自分のHPのソースに貼り付ければ OKです。 そこでまず「タグ」とは何かについてのご説明です。 |
|||||||||||||||||
|
|||||||||||||||||
ここでは初心者の方に１番簡単なやり方のホームページビルダーというHP作成ソフトを 使ったやり方でご説明していきます。(ソフトの基本操作はここから） まずお手元にソフトをご用意下さい。手順としては下記の通りです。 【１】「HPビルダー」のソフトを起動。 【２】ファイルを開く→貼り付けたいファイルを選択、画面に呼び出す。 【３】リンクを貼りたい位置にカーソールを持っていく。 【４】そのままHTML画面に切り替えて、リンクさせたいソースを貼りつければOK。 |
|||||||||||||||||
| １．まず表を作成します。画面の１番上の碁盤の目のようなイラストの上をクリックします。 | |||||||||||||||||
 |
|||||||||||||||||
| もしくは、１番上のメニューから「表の挿入」をクリックします。 | |||||||||||||||||
 |
|||||||||||||||||
２．下記のような画面になります。作成したい行数と列数を指定してOKをクリック。 |
|||||||||||||||||
 |
|||||||||||||||||
３．下記のような画面になります。 |
|||||||||||||||||
 |
|||||||||||||||||
４．リンクを貼りたいマスにカーソールを持っていく。カーソールが点滅している状態で HTMLソースのページを開く。
現在のページは、ページ編集ですので、このカーソルが 点滅している状態で、隣の「HTMLソース」の上をクリックして HTMLソースのページを開きます。
このカーソルの位置にリンクを貼りたいソースを貼り付けます。 ★＜TD＞＜/TD＞が表の一枠を示しています。 |
|||||||||||||||||
| （１）テキストタグの貼り方 | |||||||||||||||||
|
５．下記のタグを＜＞までコピーして <TD>｜</TD> の間にカーソールがあるのを確認して 下記を貼り付けます。 その場合の公式は <A href="ＵＲＬ">表示されるタイトル</A> です。
つまりどのサイトであっても、「リンク先のURL」の部分にリンクさせたいURLを 入れて「画面上に表示させたい文字」の部分に画面に表示させたい文字を 入れると、テキストが貼れるのです。 |
|||||||||||||||||
| 例えば、シニアSOHOサーチ と相互リンクさせたい場合 URL http://senior-soho.net/ タイトル シニアSOHOサーチ 上記のテキストリンクを、ソースで見ると下記のようになります。 <A href="http://senior-soho.net/">シニアSOHOサーチ</A> |
|||||||||||||||||
 |
|||||||||||||||||
ページ編集画面に切り替えると下記のような表示になりリンクされています。 これでテキストリンク完了です。 |
|||||||||||||||||
 |
|||||||||||||||||
| （３）バナータグを貼る方法 | |||||||||||||||||
上記の４番までは同じ作業です。 リンクを貼りたいマスにカーソールを持っていく。 カーソールが点滅している状態でHTMLソースのページを開く。 |
|||||||||||||||||
| 下記のタグを＜＞までコピーして <TD>｜</TD> の間にカーソールがあるのを確認して 貼り付けます。 公式は下記になります。 <A href="リンク先のURL"><IMG src="バナー画像のURL" width="横幅" height="高さ"border="枠線の太さ"alt="語句"></A> |
|||||||||||||||||
| どのサイトであっても「リンク先のURLの部分にリンク先のURLを入れ、 バナー画像のURLにバナー画像のURL（右クリックしてプロパティを見るとわかる）を 入れ、サイズをそれぞれ指定すれば、その指定した大きさでバナー画像の リンクが貼れます。 ★通常は、横幅８８、高さ３１で、枠線の太さはゼロを指定して 枠線を消しています。（枠線とはバナー画像の周囲に引かれる線のこと） 例えば というバナー（画像）と相互リンクさせたい場合 URL http://senior-soho.net/ バナーURL http://senior-soho.net/seniorbana1.gif になります。 これを公式にあてはめてみるとソースは下記のようになります。 <A href="http://senior-soho.net/"> <IMG src="http://senior-soho.net/seniorbana1.gif" width="88" height="31" border="0" alt="中高年こそ自宅でお仕事！シニアSOHOサーチ"></A> ページ編集画面を見ると下記のようになっています。 |
|||||||||||||||||
 |
|||||||||||||||||
| 今は「チューリップに×」の画像が表示されていますが、PCに保存されていない画像を 貼ると、この画像が表示されます。これをプレビュー画面で見ると下記のようになります。 |
|||||||||||||||||
 |
|||||||||||||||||
実際にきちんとリンクが貼られているかどうかは、プレビュー画面で バナーの上にカーソルを持っていけばわかります。 カーソルの先が指のマークになっていればOKです。 （実際にクリックしてもちゃんとリンクさせたいHPを見ることが出来ますよ） 但し、この時インターネットに接続されていないと表示されませんので オフラインでの作業時には注意です。 |
|||||||||||||||||
ここでもう１つ「alt」について勉強しましょう。この「alt」というのは 画像（バナー）にカーソルを合わせたときに、下記のように文章が 出てくるように設定するものです。 alt＝"表示させたい文章"の「表示させたい文章」を入力するだけです。 下記のようになります。 |
|||||||||||||||||
 |
|||||||||||||||||
| このページのシニアSOHOサーチのバナーの上を実際にクリックするとよくわかります。 | |||||||||||||||||
後は同じことの繰り返しです。「ページ編集」画面にカーソルを あわせて、「HTMLソース」でリンクのソースを貼ります。 リンクのソース（タグ）は、必ず<A href=〜</A>となっています。 <Aが小文字で hrefが大文字の場合もありますが「このソースを 貼って下さい。」と書いてある場合が多いですから、とにかく <A href=〜</A>までをコピー＆ペーストすればOKです。 続いて「リンクフリー」と書いてある場合の画像を一旦自分のパソコンに 持ち帰るやり方についてご説明してまいります。  |
|||||||||||||||||
