携帯電話向けウェブサイトで多用される<marquee>要素について、効果的な使い方と、実際の記述についての解説をします。
<marquee>要素とは、マイクロソフトがインターネットエクスプローラに実装した私的な要素で、内容のテキストが自動的にスクロールするブロックです。
HTMLに於いては、<marquee>要素は同様にネットスケープ社がネットスケープ・ナヴィゲータに実装した<blink>要素(点滅テキストと言うインライン要素)とともに、絶対に好ましくない要素と非難されております。
その理由として、
と、アクセシビリティ上重大な問題を孕んでいると言うのが挙げられます。
しかし、日本の携帯電話向けサイトに於いては、<marquee>要素はしばしば多用されております。
その理由は以下のようなものでしょう。
携帯端末でスクロール操作をするのは結構骨が折れるものです。
<marquee>要素なら自動的に文字がスクロールしてくれるので、閲覧者は面倒な操作をしないで済みます。
「テキストが入り切らなければスクロールさせればいいじゃない」などと言う発想は携帯端末の閲覧者の事を却って配慮していないとさえ言えるでしょう。
限られた領域で最大限に情報を詰め込むためには効果的な方策とも言えます。
加えて、日本の携帯電話は殆どがパケット通信を採用しており、時間単位で課金されるサーヴィスは今では存在しません。
そのような事からも、携帯電話向けのサイトでは<marquee>要素は便利な要素として用いられる事になるのです。
<marquee>要素は、HTMLでは使ってはいけない要素とされているにも拘らず、携帯電話向けサイトでは有効な記述方法として使われております。
ですが、使い方を誤るとやはり逆効果になり兼ねません。
そこで、制作者が気付いた範囲で、拙い使い方を考えてみました。
<marquee>要素を何箇所にも用いていると、閲覧者の視点が混乱する事があります。
特に<marquee>要素が連続していると、それらの行が全て並んでスクロールしていくため、視点がぶれて閲覧者を混乱させてしまう恐れがあります。
<marquee>要素は一画面に見える範囲(十五行前後)に一箇所くらいに留めておくと良いでしょう。
幾らスクロールなしで流れて行くとは言え、ダラダラと表示されていると閲覧者にストレスを与え、ひいては途中で逃げられてしまう恐れがあります。
どの程度の長さが良いかは具体的にはちょっと言えませんが、せいぜい二、三行くらいの長さに留めておいた方が良いでしょう。
また、<marquee>要素内に於いて、特に見てもらいたい重要なテキストは一行分の字数(十字前後)目くらいから始まるようにすると良いでしょう。
そうする事で、重要なテキストが右から現われると言うタイミングとなり、目を引き易くなるでしょう。
目を引かせたいために文章の途中で<marquee>要素を用いる事もあるかも知れませんが、これも閲覧者の目を混乱させる恐れがあります。
或いは、スクロールして閲覧するような長めの本文の途中に<marquee>要素が入ると、そこでスクロールを止めさせられる事にストレスを感じる閲覧者も現われるかも知れません。或いはそこがスクロールしている事に気付かずにスクロールを続けてしまい、特に見てもらいたい箇所が読み落とされてしまう恐れもあります(特に流し読みをしている場合)。
<marquee>要素は見出しの前後などに用いると効果的でしょう。
アンカーが勝手に動くと、選択したくても選択出来なくなる恐れがあります。
また、アンカーが途中から現われるようにした場合には、アンカーが現われるまで待ってもらえない場合もあります。
特に商品の申し込みページなど、制作者側にとっての最終目標となるページへのリンクは、クリックの可能性を大きく落とすリスクがあるので、絶対に<marquee>要素内に入れないようにしましょう。
エヌ・ティ・ティ・ドコモのｉモードブラウザ 1.0端末で利用出来るｉモード向けXHTMLでは、<marquee>要素を使う事が出来ません。
代わりに、style="display: -wap-marquee; " 属性を与えた<div>要素としなければなりません。
このプロパティは、KDDI/沖縄セルラーの端末に実装されている旧オープンウェーヴ社のモバイルブラウザでもサポートされております。
一方、ソフトバンクではこのプロパティは公式にはサポートされておりませんが、実際には問題なくスクロールしてくれます。
display: -wap-marquee; をサポートしております)。具体的には、以下のようになります。
<div style="display: -wap-marquee; ">携帯端末やオペラではこの文字がスクロールします。</div>
