HTMLファイルにバナー広告を貼り付ける

質問

バナー広告のクリエイティブをHTMLファイルに貼り付ける方法を教えてください。 GIFのバナーとフラッシュのバナーで貼り付ける方法が異なるのであれば、それぞれについて解説してください。

回答

GIFのバナーとフラッシュのバナーでは、HTMLに貼り付ける方法が異なります。 まず、GIFのバナーをHTMLに貼り付ける手順は次のとおりです。

  1. テキストエディタ(ウィンドウズに付属のメモ帳(Notepad.exe)など)を起動して、次のコードを入力します。「file_name.gif」の部分は、貼り付けたいGIFファイルのファイル名にします。
  2. <html>
    <body>
    <img src="file_name.gif" />
    </body>
    </html>
    
  3. 入力したコードを、任意のファイル名でHTMLファイルとして保存します。またはテキストファイルとして保存したうえで、ファイルの拡張子を「.txt」から「.html」に修正します。
  4. 作成したHTMLファイルとそれに貼り付けたいGIFファイルが異なるフォルダに保存されているときは、同一のフォルダに移動します。
  5. 作成したHTMLファイルをダブルクリックしてブラウザで開き、GIFファイルが貼られていることを確認します。

フラッシュのバナー(SWFファイル)をHTMLに貼り付ける手順は次のとおりです。(SWFファイルを作成したFLAファイルがあるときは、そのFLAファイルをFLASHで開いて「パブリッシュ」するだけで下記の手順が完了します。FLASHでパブリッシュする方法の解説は省略します。)

  1. テキストエディタ(ウィンドウズに付属のメモ帳(Notepad.exe)など)を起動して、次のコードを入力します。「file_name.swf」の部分(2箇所)は、貼り付けたいSWFファイルのファイル名にします。「WIDTH(幅)」と「HEIGHT(高さ)」の値(各2箇所)は、SWFファイルの幅と高さをピクセルで指定します。
  2. <!-- saved from url=(0013)about:internet -->
    <html>
    <body>
    <OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
     codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
     WIDTH="468" HEIGHT="60" id="" ALIGN="">
     <PARAM NAME=movie VALUE="file_name.swf">
     <PARAM NAME=quality VALUE=high>
     <PARAM NAME=bgcolor VALUE=#FFFFFF>
     <EMBED src="file_name.swf" quality=high bgcolor=#FFFFFF
     WIDTH="468" HEIGHT="60" NAME="" ALIGN=""
     TYPE="application/x-shockwave-flash"
     PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
     </EMBED>
    </OBJECT>
    </body>
    </html>
    

    (注)コードの右端の一部が表示されずに切れてしまっているのでご注意ください。コピーは問題なくできます。

  3. 入力したコードを、任意のファイル名でHTMLファイルとして保存します。またはテキストファイルとして保存したうえで、ファイルの拡張子を「.txt」から「.html」に修正します。
  4. 作成したHTMLファイルとそれに貼り付けたいSWFファイルが異なるフォルダに保存されているときは、同一のフォルダに移動します。
  5. 作成したHTMLファイルをダブルクリックしてブラウザで開き、SWFファイルが貼られていることを確認します。

注意

HTMLとバナーが異なるフォルダにあっても、バナーのファイル名を指定する部分(「file_name.gif」または「file_name.swf」の部分)を相対パスで記述すれば、バナーをHTMLに貼り付けることができます。 SWFファイルによっては、背景色指定部分(「NAME=bgcolor VALUE=#FFFFFF」および「bgcolor=#FFFFFF」)などを変更する必要があります。 HTMLに任意の文字を記述したり背景色を指定したりする方法についての解説は省略します。

応用

HTMLに貼り付けたバナーをクリックしたとき、任意のウェブページにリンクするようにするには、HTMLを編集する必要があります。 例えば、クリックしたときに「http://***.jp/」にリンクさせたいとします。GIFのバナーの場合、

<img src="file_name.gif" />
の部分を
<a href="http://***.jp/"><img src="file_name.gif" border="0" /></a>
としてください。フラッシュのバナーの場合、
"file_name.swf"
の部分(2箇所)を
"file_name.swf?clickTAG=http://***.jp/"
としてください。

資料作成マニュアルの目次へ

【広告】 楽天市場リアルタイムランキング

Agile Media Network パートナーブログ