バカネコ日記

フリーページ

保存ﾌｧｲﾙ見方

< 新しい記事

新着記事一覧(全963件)

過去の記事 >

全て | カテゴリ未分類バカネコＰＣ講座 | バカネコのお話

2004年06月30日

手抜きで覚えるHTML　リンク編

(39)

カテゴリ：カテゴリ未分類

自分のウチでは事情により飼えないけれど、せめて何かしたいと仰って下さる方が
たくさんいらっしゃいます。

ご友人に尋ねて下さったり、ご自分の日記で紹介して下さったり、記事をリンクしてくださったりと実に様々な形で応援をいただいています。

そんなみなさまに少しだけでもご恩返しのつもりでHTMLの一部を解説する事にいたします。
本編はリンクの作り方です。

キンコンカ～ン

アシスタントのコロンにゃ。

さあて、始まるにゃん。　寝てる人、起きてぇ～。
暑いにょで、氷の入った麦茶でも飲みにゃがら、のんびりやるにゃん。

誰にゃ、氷の入ったチューハイ持ってる人は？
まあ、いっか。　暑いもんにゃ。

んじゃ、ネコバカ村長、じゃにゃかった、今日は教授だっけ。お願いにゃん。

ウェッヘン、オッホン。（←ネコにおだてられて、すっかりその気になってる）
では、講義を始める。

あーあー、HTMLとは何かなどと大上段に構えると、分厚い本が書けてしまう
ほどの量になる。
ものすごく大変な勉強をするのはイヤだろうから、超おおざっぱに解説する。

HTMLとは「はいぱー・てきすと・まーくあっぷ・らんげーじ」の
頭文字を寄せ集めたものである。

直訳すると、もの凄い文字用目印付き言語、となるが、これじゃかえって
何のことか分からん。こんなのは重要でないので覚えなくてよろしい。

HTMLとは「絵と文字が両方使えて、リンクのできる、ホームページ用の言語」
くらいに解釈してかまわない。
例外はあろうが、一般人がこれを使うのはホームページ作成くらいのものである。

でたらめなHTMLでも良いとまでは言わないが、あまり神経質にならなくてもいい。
これは最も普及しているインターネットエクスプローラの許容範囲が広いためである。
少々、間違ったHTMLでもエラーを起こさず表示できてしまう。

さて、HTMLはどう書くのか。ここから始めよう。

里親募集、と書きたければ、最低限でも次のように書く必要がある。

　　　<html>
　　　　　<head>
　　　　　</head>
　　　　　<body>
　　　　　　里親募集
　　　　　</body>
　　　</html>

こんなのをいきなり見せられたって分かるわけがない。
おまけに楽天では上に書いたタグ(後述)は使えないから無意味だ。

楽天で使う場合に限って実務的に割り切ろう。

まず、自分で必要な文章を書く。
次に、特定の語句に色を付けたり、サイズを変えたり、リンクを仕込んだりするわけだ。
この作業を指定するのにタグというものを使う。

タグとは荷札か、宅急便の配送伝票のようなものと思えばよろしい。
目的の文章または語句を挟んで動作を指示する命令語である。
他の文字と区別するために半角カッコで括られている。

HTMLは、あそこからここまで、ああせい、こうせい、と目印を付けるようになっている。
だから、マークアップ言語と呼ばれるのだ。

リンクの場合はアンカータグというのを使う。
ここで里親募集しています、と言う文章の「里親募集」という語句に
リンクを張る場合、次のように指定する。

ここで<a>里親募集</a>しています。

<a> がリンクの始まりを表し、</a>がその終わりを示しているタグである。
もちろん、このままではジャンプしない。
行き先の書かれていない配送伝票だから。

行き先を書かねばなるまい。

長くなった。チューハイも切れた。続きはまた明日にしよう。

あたたっ、だから空き缶を投げるでないっちゅーに！
ちゃんとやるから。

*******************************************************

【追記】

．．．と、ここまで書いて更新したら、やっぱり石が飛んできた。
空き缶くらいでは済まなかったようである。　コメントがキビシイ。

ネタ不足だからといって、明日に引っ張ろうという貧乏根性がわざわいした。
しかたがない。
今すぐ、書くしかあるまい。　では、続きをば泣きながら書くことにする。

行き先は当然、自分が表示したいページである。これはURLを使って指定する。
URLはご存じの通り、ＨＰの住所である。

たとえば、当サイトであれば　 http://plaza.rakuten.co.jp/nyancolon/
という文字列そのものを書くわけだ。
これを飛び先指定を示す　href="" を使って、アンカータグの中に以下のように指定する。

ここで<a href="http://plaza.rakuten.co.jp/nyancolon/">里親募集</a>しています。

これで、リンクの基本形が完成する。
ごちゃごちゃしていて、見てくれが非常に悪いが、これはしかたがない。
ＨＰ上に表示するとちゃんと以下のように表示される。
ジャンプもまともに出来る。

ここで里親募集しています。

今、お使いのインターネットエクスプローラの設定を特にいじっていない限り
里親募集の所にはリンクであることを示す下線が引かれているはずである。

これを、即、自分のＨＰに応用するには「里親募集」とURL を好きな言葉に
置き換えればよい。
「ここで」とか「しています」も変更しなくちゃ、などというツッコミは
入れないように！
そんな低レベルなツッコミ入れたら、コロン特製のウンコ爆弾をお見舞いしよう。

ポイントは　<a href="目的地のURL">リンクしたい語句</a>

というカタチ、を覚えることである。前後はタダの文章であるので好きに書けばよろしい。
これが基本なので、アタマに叩き込んでおくこと。
リンクの使えないHTMLはつるっぱげのペルシャ猫と同じくらい値打ちが下がる。
実際、このカタチは頻繁に出現し、またよく使うのである。

文字だけをリンク対象にしているので、これをテキストリンクという。
もちろん画像も対象に出来るが、さすがにこれは明日にさせていただく。
この時間になれば石も飛んでくることはあるまい。

どちらさまも戸締まりと火の元にお気をつけて、お休みなんしょ。

この記事がおもしろかったと思う人は１票！　クリック　→　