RSSフィードの存在を示す2つの方法

RSSフィードを公開していることを示す「RSSアイコン」(Feedアイコン)には、大きく分けて次の2種類があります。

1.ページ内に掲載したRSSアイコン画像(例:RSSRSS 2.0Feed(Red)
2.ブラウザのアドレス欄などに表示されるRSSアイコン(例:Feed

ページ内に掲載したRSSアイコン
▲ページ内のRSSアイコン
ブラウザのアドレス欄に掲載されたRSSアイコン
▲アドレス欄のRSSアイコン

前者は、自分でRSSアイコン(画像)を用意してページ内の任意の位置に掲載し、RSSフィードにリンクさせます。 何でも自由な画像を使って構いませんし、テキストだけで掲載しても構いません。主に、ページ閲覧者に対して「RSSを公開している」事実を伝えます。

後者は、RSSの存在をブラウザ側が自動的に認識した場合に、アドレス欄の端やツールバー上などに表示されます。 アイコンは自分で用意する必要はなく、RSSフィードを示す共通のアイコン(Feedなど)が表示されます。 クリックすると、フィードが表示されたり、内蔵のRSSリーダ機能などに登録されたりします。

RSSを公開しているなら、できるだけたくさんの人々に気付いてもらえるよう、両方掲載しておくことをお勧めします。

1.ページ内に掲載したRSSアイコン画像

ページ内にRSSアイコン(画像)を表示するには、RSSを示す適当な画像を用意してリンクを作り、リンク先にRSSフィードのURLを指定するだけです。 通常の画像リンクとして作れば問題ありません。 例えば、以下のように記述します。

<a href="RSSフィードのURL"><img src="アイコンのURL" width="xxx" height="xxx" alt="RSS"></a>

例えば、「RSS」のような画像(横36px×縦14px)を用意し、 RSSフィード「http://allabout.co.jp/gm/gf/1053/library/」へリンクするなら、

<a href="http://allabout.co.jp/gm/gf/1053/library/"><img src="rss.gif" width="36" height="14" alt="RSS" border="0"></a>

……のように記述します。
RSSフィードのURLは、必ずしも「http://」から記述する必要はなく、相対パスなどで記述しても構いません。
上記のソースを表示させると、以下のように見えます。

RSS

上記のアイコンは、RSSフィードにリンクしています。

なお、RSSフィードを示すアイコン画像は、様々なウェブサイトで公開されているフリーの画像を使うと良いでしょう。 もちろん自分で作成しても構いません。また、この記事で使った「RSS」画像をコピーしてお使い頂いても構いません。

標準的なRSSアイコンは「Feed Icons」で配布されています。 また、RSSアイコン画像を簡単に作成できるサービスとして、「RSSアイコン - 無料RSS画像・RSS作成サービス」などのサイトがあります。 このような作成サービスを利用すると、好きなデザインで簡単にオリジナルのアイコン画像を作れます。

2.ブラウザのアドレス欄などに表示されるRSSアイコン

最近のブラウザであれば、RSSの存在を自動的に認識して、アドレス欄の端やツールバー上などにRSSフィードの存在を示すアイコン(Feedなど)を表示します。

このようにブラウザに自動認識させるには、「RSS Auto-Discovery」という記述をHTMLに加えます。 具体的には、HTMLのhead要素内に、以下のように記述します。

<link rel="alternate" type="application/rss+xml" title="(タイトル)" href="(RSSのURL)">

title属性値には、RSSフィードの内容などを簡単に記述しておけば良いでしょう。 例えば、タイトルを「新着記事RSS」とし、RSSフィードが「http://allabout.co.jp/gm/gf/1053/library/」で公開されているなら、

<link rel="alternate" type="application/rss+xml" title="新着記事RSS" href="http://allabout.co.jp/gm/gf/1053/library/">

……のように記述します。

なお、複数のRSSフィードを公開している場合は、必要なだけいくらでも列挙できます。

<link rel="alternate" type="application/rss+xml" title="RSS 1.0" href="(RSS1.0のURL)">
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="(RSS2.0のURL)">
<link rel="alternate" type="application/atom+xml" title="Atom" href="(AtomのURL)">

※RSSフィードではなくAtomフィードの場合は、type属性の値を「application/atom+xml」にします。

各ブラウザで実際に表示させると、以下のような感じになります。

Firefox・Safari・IE7での見え方
(左上)Firefox / (右上)Safari / (下)Internet Explorer 7

※Firefox、Opera、Safariなどでは、アドレスバーの端に表示されます。 Internet Explorer7では、ツールバー上に表示されます。(IE6では表示されません)

おわりに

今回は、RSSフィードの存在を示すための「RSSアイコン」の表示について、2種類の方法をご紹介いたしました。 RSSフィードを公開しているなら、ぜひ掲載してみて下さい。

なお、RSSフィードの作成には、RSSフィードを作成できるソフトウェア・CGI・各種サービスなどをご活用下さい。
→ 「RSS作成ソフトを使ってRSSを自動生成しよう」(関連記事)



※記事内容は執筆時点のものです。最新の内容をご確認ください。
※OSやアプリ、ソフトのバージョンによっては画面表示、操作方法が異なる可能性があります。