Harukiya Archives

2005/07/14

category / Blog

なるべく見ないようにしよう。ガラスの心臓だから。三杉淳かーい ￣□￣)つ彡

容量が1KB以下というシンプルさと、リアルタイムカウント機能（アクセスがあるとカウント数がリアルに変わる。まんまな説明やん！）が特徴のカウンタ。

登録すると以下のようなHTMLが生成される。テンプレの表示したい部分に貼り付けるだけのお手軽さ･･･なのだけど、生成HTMLはより多くのブラウザに対応させたもので、DTDによってはHTML-lint様に怒られてしまう。ということで、XHTMLにFlash（オブジェクト）を貼り付けるときに役にたつかもしれないんでメモ。

配布される基本HTML

  1. <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="60" height="14" id="counter" align="middle">
  2. <param name="allowScriptAccess" value="sameDomain" />
  3. <param name="movie" value="http://2php.jp/counter/counter.swf?acount=登録したID" />
  4. <param name="quality" value="high" />
  5. <param name="wmode" value="transparent" />
  6. <param name="bgcolor" value="#ffffff" />
  7. <embed src="http://2php.jp/counter/counter.swf?acount=登録したID" quality="high" wmode="transparent" bgcolor="#ffffff" width="60" height="14" name="counter" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
  8. </object>
  9. <script type="text/javascript" src="http://2php.jp/counter/count.js"></script>
  10. <noscript><a href="http://2php.jp/cashing/"><strong>キャッシング</strong></a><a href="http://2bee.jp">アクセス解析</a></noscript><!-- 以下のタグは削除可能です--><a href="http://2php.jp/cashing/"><strong>キャッシング</strong></a><a href="http://2bee.jp">アクセス解析</a>

<embed>要素は独自拡張なので<object>要素に置き換える。強調部分は以下と同じ意味。

  1. <object data="http://2php.jp/counter/counter.swf?acount=登録したID" type="application/x-shockwave-flash" name="counter" align="middle" width="60" height="14">
  2. <param name="allowScriptAccess" value="sameDomain" />
  3. <param name="movie" value="http://2php.jp/counter/counter.swf?acount=登録したID" />
  4. <param name="pluginspage" value="http://www.macromedia.com/go/getflashplayer" />
  5. <param name="quality" value="high" />
  6. <param name="wmode" value="transparent" />
  7. <param name="bgcolor" value="#ffffff" />
  8. </object>

ポイントはclassid属性は使わずにdata属性に直接ファイルのアドレスを入れること。type属性も必須。Flashの場合は"application/x-shockwave-flash"と丸暗記しておいてOK。さらにname・align属性は必要なければ削除して、代わりにidを振っておくと便利かも。

<param>要素で今回必要なのは<param name="movie" value="ファイルアドレス" /> だけ。data属性とダブるが、これがないとIE6で表示されなくなる（なぜかは不明）

もっとも悩んだ警告が

<object> には等価な内容を書くようにしましょう。

というもの。alt属性はないし、どうすんのか？と思ったらオブジェクトに置き換えられなかった場合は<object>要素の中身そのものが表示されるんだね（！）ということで、最終的にはこんな感じになりました。

  1. <p><!-- 任意ブロック要素 -->
  2. <object data="http://2php.jp/counter/counter.swf?acount="登録したID type="application/x-shockwave-flash" width="60" height="14" title="2php counter">
  3. <param name="movie" value="http://2php.jp/counter/counter.swf?acount=登録したID" />
  4. <a href="http://2php.jp/counter/">2php counter</a><!-- 代替文字列 -->
  5. </object>
  6. <script type="text/javascript" src="http://2php.jp/counter/count.js"></script>
  7. </p>
  8. <noscript class="center"><a href="http://2php.jp/cashing/"><strong>キャッシング</strong></a> | <a href="http://2bee.jp">アクセス解析</a></noscript>

かなりシンプルなHTMLになるでしょ？HTML-lintの解説は必読ですよ、奥さん。

参考にしたページ

writeback

  1. マス ： PVだからスゴイことになってる。うち50ビューくらいはσ(ﾟ∀ﾟ だけどさ。-15日19時
  2. syugooh ： <object> には等価な内容を書くようにしましょう。
    なのですが、うまくいきません。どうしても注意されてしまいます。
    どこがいけないのでしょうか？

    <object data="simo_topbana.swf" type="application/x-shockwave-flash" width="480" height="280" title="しもしも">
    <param name="movie" value="simo_topbana.swf" />
    </object>-16日04時
  3. マス ： syugoohさん、こんばんは（深夜）

    <object data="simo_topbana.swf" type="application/x-shockwave-flash" width="480" height="280" title="しもしも">
    <param name="movie" value="simo_topbana.swf" />
    </object>

    例えば、このタグの属性を全部はずすと

    <object>
    <param />
    </object>

    となり中身のない（param も空要素）マークアップになってしまいますよね？
    その部分に data="simo_topbana.swf" の代替になることを書く、あるいは挿入すれば OK です。
    （<param> がある場合にはそれ（ら）よりも後に入れなければいけない、とどこかで読んだような気が･･･）

    <object data="simo_topbana.swf" type="application/x-shockwave-flash" width="480" height="280" title="しもしも">
    <param name="movie" value="simo_topbana.swf" />
    <span>simo_topbana.swf の内容の説明</span>
    </object>

    であるとか、simo_topbana.swf がバナーのようなものならば

    <object data="simo_topbana.swf" type="application/x-shockwave-flash" width="480" height="280" title="しもしも">
    <param name="movie" value="simo_topbana.swf" />
    <img src="バナー画像のURI" alt="バナー" />
    </object>

    みたいな感じでもよいと思います。alt の中身は代替の代替ってことになりますね^^

    追記：興味深い記事がありました。

    object 要素と W3C 勧告の陥穽
    → http://deztec.jp/design/06/01/30_object.html

    自分なりの解釈としては、インライン要素で済むのならそれでよしと思うとります。
    うちで object を使うのをやめたのはHTMLぽくないから（先にマークアップするものが無い）のと、そもそもカウンターが必要ないから。-17日01時
  4. 　

< ショート・ショート | 封切り > | 表紙へ戻る | 探す | 案内

ホームページ アフィリエイト レンタルサーバー FC2ブログ キャッシング