【文字Tips】1つの記事に複数のトピックを書くときに使える技。

正確には文字Tipsでは無いのかも（笑）。長い文章を書く人向けにちょっとしたテクニック。

長～ぃ記事をお書きの方にひょっとしたら使えるテクニックです。

どういうものかというと、通常のリンクだと、リンク先のURLにジャンプしますよね。
私がお伝えしたいのは、記事の途中にジャンプする方法です。

コレを利用すれば、長い記事でも、スクロールバーを使わずに記事中を移動できます。

では、実際に使っているページをご紹介。
下記のリンクをクリックしてみてください。
皆さんにとってのBLUE_SKYを大募集！ #2：目指せ世界制覇?!
次にこちらをクリックしてみてください。
皆さんにとってのBLUE_SKYを大募集！ #2：目指せ世界制覇?! ：応募要項

違いがわかりましたでしょうか？
下のリンクだと「皆さんにとってのBLUE_SKYを大募集！ #2：目指せ世界制覇?!」という記事の下の方にある「応募要項」がいきなり表示されたかと思います。

記事に注釈なんて入れたいときには非常に便利に使えるかと思います。

では早速、使い方をご説明。
以下の手順で記事を作成してみてください。
※注意　gooBLOG上での編集の都合上"＜＞"は全角で記述しておりますが、本来は半角英数字の"<>"です。実は、半角で記事にする方法もあるのですが再編集が難しくなるのでご了承ください。

基本的には他のページへジャンプするリンクタグ＜a href=""＞＜a＞の応用です。
ページ内の移動にはまず、移動したい場所に印をつけてあげなければなりません。

その印に使用するのが「name属性」と呼ばれる物です。では実際に試してみましょう。

下記のように使います。

「一番下」という場所に印をつけたい場合。

＜a name="bottom"＞一番下＜/a＞

と記述します。
こうすると一番下という文字に対し「bottom」という名前が付けられたことになります。
注意：名前は半角英数字がいいみたいです。日本語を使うと問題が出る場合があるようですよ。

次に一番下へ行く為のリンクを作成します。

＜a href="記事のURL#bottom"＞一番下へ行く＜/a＞

記事のURLの後に「#」をつけて、その後ろに先ほどつけたなまえ「bottom」を記述することでその位置にジャンプできるリンクが作成できます。

実際にリンクを作成してみたのでお試しください。
下に言った後は「元の場所へジャ～ンプ」をクリックするとココにもどってこられます。

一番下へ行く

違うページのある場所へ飛ぶ場合も同じです。
飛びたい場所のURLの後ろに「#」をつけてnameで指定した名前を挿入します。

最初に体感いただいたものは下記のように記述してあるわけです。（名前の付け方が安易ですみません）

＜a href="http://blog.goo.ne.jp/blue_sky_blog/e/fd379f35c10f6e02090d7f686741666d#abc" target=_blank＞皆さんにとってのBLUE_SKYを大募集！ #2：目指せ世界制覇?! ：応募要項＜/a＞

URLの後ろにある「target=_blank」というのは、リンクを新しいページで開くときにつけるオプションです。
URLを囲む「"」（ダブルクォーテーション）は「'」（シングルクォーテーション）でもいいですし、省略しても構いません。

どうでしょ、注釈をつけたい場合には使える技だと思いますので活用してくださいね。

---

どうやら、同じ記事内の移動であってもgooBLOGではURL無しで＃のみではダメみたいです。

＜a href="#bottom＞一番下＜/a＞

と記述しても

＜a＞一番下＜/a＞

と変更されてしまいました。

したがって、記事内のジャンプを設定する場合は、一度記事を作成してURLを確定してから、再編集する必要がありますね。

※注意　gooBLOG上での編集の都合上"＜＞"は全角で記述しておりますが、本来は半角英数字の"<>"です。実は、半角で記事にする方法もあるのですが再編集が難しくなるのでご了承ください。

---

HTML初心者なので、間違いがあればフォローを御願いします。

---

トラックバック
★☆★ goo ブログ かわら版 ★☆★：★ 文字 Tips ★ - 文字自由自在編 -

---

一番下です。
元の場所へジャ～ンプ