20
20

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

しぶとく生き残る、いにしえのタグ

Posted at

Web 2.0よりも前の世界

まだNetscape Navigatorがブラウザのシェアを握っていた頃…

「iモード」が時代の先端だった頃…

CSS 1.0すらブラウザ互換が取れなかった頃…

そんな時代には、HTMLであらゆる表現のディテールを書き込むほかありませんでした。ページは<table>でレイアウトして、フォント調整には<b><i><u>1<font>といったタグを使っていました。

もちろんJavaScriptもまともに使えるような状況ではなかったのですが、そんな中で用意された、動きのある要素が<marquee>でした。

懐かしの風景

マーキーでカクカクと流れてくる文字は、独特の風情を持ったものだったと、(そんなものがなくなった今になってみれば)思うかもしれません。ただ、画像なんかをマーキーにされた日には、たまったものではなかったでしょう。

HTML5にももちろん取り込まれることのなかった<marquee>ですが、意外なことに現代のブラウザにおいても、機能自体は残されています。いちおうMDNにも解説ページがあって、実際に<marquee>タグで書かれたものを見ることもできます。

…あれっ?

Google Chromeから実際の挙動を見てみると、なんとものすごくスムーズに流れています。あの「カクカクした」感じは、どこにもありませんでした。なお、FirefoxやIE、Safariといったブラウザではカクカクが健在でした。

CSS3…にならず

このマーキーですが、一度CSS3の機能として提案されたこともあります(W3C)。ただ、「CSSアニメーションがあるのにいらないだろ」という話になって、結局規格化されることなく終了しています。

マーキーとXSS

普段使うはずもないこんなタグをどうして思い出したのかと言えば、別件で調べ物をしている過程で、たまたま「<marquee>でXSSを行った」という記述を見かけたことでした2

Qiitaもそうですが、ユーザー入力としてHTMLを受け入れるような構造にするときには、XSSなど不適切なものを防ぐ必要があります。ただ、ここでブラックリスト方式をとっていると、この<marquee>のような古いタグや、逆に新規制定されたもの、さらには特定のブラウザだけバグなり仕様なりで通してしまうものなど、あらゆるものを防ぎ切るには不十分だということは明らかです。ホワイトリスト方式でないとどうしようもないな、ということは再認識できました。

  1. これら3つについては、(場面は限定されるものの)HTML5において新たな意味が与えられ、正式な要素として復権を果たしています。

  2. いちおう確認してみましたが、Qiitaは<marquee>タグそのものを弾いてしまうので、もちろんXSSにたどり着くことはありませんでした。

20
20
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
20
20

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?