【ブログの楽しみ方】他の記事の任意の箇所にリンクするには?【ココログ】
この記事の目的
HTMLタグの知識がない方でも『HTMLの編集』モードでタグを編集するテクニックをご紹介するものですが、HTMLタグを体系的に説明するものではありません。
アンカーの設置
アンカーとはanchor、つまり「錨」とか「固定するもの」の意味で、ここではリンクの目標(ターゲット)となるようなアドレス=名前を意味します。
編集モードを「HTMLの編集」に切り替え、アンカーを記述するには、ジャンプ先の直前に、
<a name="~"></a>
という形式で、「~」の部分に任意の名前を半角文字で記述するだけです。
例えば、下のように「<a name="cocolog"></a>」と記述します。
ココログでは自動的に必要なタグを付加してくれるので、「<a name="cocolog"></a>」の前後の「<p>~</p>」(段落タグ)は書いても書かなくても構いません。(ない場合は自動的に付加されます。)
リンク先の指定方法
下のように、リンク先記事のURLの後ろに「#」(半角シャープ)、それに続けて「アンカー名」を記述するだけです。
<a target="_blank" href="http://daishi100.cocolog-nifty.com/blog/web-page-contents-.html#cocolog">お役立ちノウハウ集</a>
ココログのwebページとは/どんな使い方をすればいいの?
以上で、「任意の箇所にリンクする」方法の説明は終了ですが、ここでココログのwebページに少し触れておきます。
webページの特徴は「時系列に表示されるブログ記事からは独立していること」、つまり、公開の状態で保存しても、それだけではブログ記事の一覧には表示されないことです。
ここで紹介した例では、目次ページのような使い方をしていますが、通常のwebサイトで言うと、下図で印を付けた(トップページに対する)サブページのような使い方に適しています。
「プロフィールページ」や「リンク集」、サイトの「ヘルプ」、「用語集」など、アイディアによってwebページは様々な使い方をすることができ、ココログにはマイフォトというアルバムのようなページもブログから独立した形で作成する機能があるので、工夫すればブログでもホームページのような構造にできます。
また、ブログ記事は記事として完成していないと公開しにくいのですが、webページだと書きかけでも気にならない or 追記や大幅な改訂をしても目立たないので、覚書などに気楽に使えるのが利点です。
webページをブログ上に表示するには?
前述のように、webページは公開しても、それだけではブログ上に表示されません。webページの目的(ヘルプや用語集)によってはブログ記事から直接リンクを貼る方法もあるし、サイドバーにリンクを貼るという方法があります。
webページやマイフォトへのリンクをサイドバーに表示するには、簡易的には公式FAQにあるように、
-
自分のブログのサイドバーからウェブページへリンクを張るには ?
サイドバーのリスト項目としてリンク表示させる方法
- マイフォトをブログのサイドバーに表示する方法を教えてください
ブログのデザイン設定変更画面からサイドバーに追加する方法
で可能ですが、「マイリスト」のなかの「メモ」というリストタイプで作成すれば、好みの見出しをつけたり、バナーを使用することもできます。
バナーは必ずしも必要ではありませんが、デザイン性の問題だけでなく、見てもらいたいページへのリンクを目立たせたり、面積が広いのでクリックしやすいという利点があります。
この記事を書いている時点では、右上(右サイドカラム)に下のような画像を表示していますが、これもバナーで、(デザインの善し悪しはともかく )目立ち、また、画像のどこをクリックしてもリンク先が開くので、操作性がよくなります。
バナーを作成するには、様々な素材、特にイラストが欲しくなりますが、例えばMicrosoftのクリップアートのように無料の画像集(但し商用利用は不可→著作権等、詳しくは『クリップ アートの使用条件に関してよくある質問 (FAQ) 』)のような素材集を利用すればよいかと思います。
画像編集ソフトがなくても、バナー程度ならExcelでも比較的簡単にオリジナルバナーが作成できるので、以下に参考記事をご紹介します。(下記の記事もwebページで作成しています。)
【関連記事一覧】
- 【Excel2003】Excelでバナーを作る 〔前編〕【ココログ】
- 【Excel2003】Excelでバナーを作る 〔中編〕【ココログ】
- 【Excel2003】Excelでバナーを作る 〔後編〕【ココログ】
次回はバナーの貼り付け方について、もう少し補足説明をする予定です。
(拍手はブログ主のモチベーション維持程度の目的です。面白かった、役に立った、等々、宜しければクリックしてください。)
« 【ブログの楽しみ方】段落(領域)を枠線で囲む/背景色をつける【ココログ】 | トップページ | 【ドールハウス工作】 No.49 100円ショップのコレクションボックスで“球春到来!” »
コメント
« 【ブログの楽しみ方】段落(領域)を枠線で囲む/背景色をつける【ココログ】 | トップページ | 【ドールハウス工作】 No.49 100円ショップのコレクションボックスで“球春到来!” »
>ユウぱぱさん
ご訪問ありがとうございます。
新たに「cocologの楽しみ方」というカテゴリを追加しました。webページの目次を見なくても、カテゴリで一連の記事を読むことができるようになっています。
>yamayamadesuさん
こんにちは。
ブログはHTMLの知識がなくても書けるのが魅力ですが、ほんの少しのHTMLタグの知識を追加すると、見た目だけでなく、分かりやすい記事にすることができますね。
独学で学んだので、大した知識ではありませんが、ココログユーザの目に留まるような記事を時々書いてみたいと思っています。
「ゆうゆう散歩」って、「ちい散歩」の後番組でしたっけ。普段見ていないので見逃してしまいました。土地の人は今でも多いのですが、商店街は大規模店舗が進出したせいもあって、シャッター街になりつつある部分もあり、昔ののんびりしたムードはだいぶ薄れてきてしまいました。
それでも、「川崎大師」というコンテンツがあるので門前町の雰囲気は維持できるかとは思っているのですが...
投稿: 大師小ブログ主 | 2013/02/28 13:07
おはようございます。 ブログの楽しみ方の情報ありがとうございます。
困った時には 大師小ブログ主さんのブログを訪問しています。
話は変わりますが、今朝、テレビをつけたまま新聞を読んでいたら
若大将のゆうゆう散歩(テレ朝)で、川崎大師を案内していました。
数十年十年ぶりに、先日、大師小ブログ主さんの「大師の歩き方」を見て
今日テレビで見て、いい所に住んでおられるなとうらやましく思いました。
投稿: yamayamadesu | 2013/02/28 11:31
こんばんわ
詳しい解説ページありがとう
説明されているの、いつかやってみたいと思ってました
これでまた宿題が増えました(笑)
投稿: ユウぱぱ | 2013/02/27 21:53