隠しページ講座【タグ編】

タグ編

TAG（タグ）とはデータに属性を加える意図で用いられます。ソース中に<>で囲まれた部分、ブラウザには文字として表示されない部分です。【ソース編】と少し内容が被りますが、タグを全く知らない人にとっては存在自体が隠しになってるかと思い章として加えています。下のものはよく使われるタグ要素の一覧表です。

タグ要素の一覧表
Name	Description
TITLE	document title:タイトル
H1~H6	heading:見出し
P	paragraph:段落
A	anchor:アンカー
PRE	preformatted text:整形済テキスト
EM	emphasis:強調
STRONG	strong emphasis:より強い強調
HR	horizontal rule:罫線
BR	forced line break:強制改行
IMG	Embedded image:画像の包括

タグとは言わない箇所も、便宜上タグとして説明しています。また、タグ編でいうタグは「画面には映らない構成要素全般」として広く捉えて下さい。

FONT

FONTを変更して隠す手法は意外と多いです。例えば下のものがそうです。

タグの特性を利用した隠し方はブラウザが対応してないと当然反映されません。

これはFONTのサイズを小さくしたものです。紛れていたら記述があるとは気付きませんよね。小さく見えてもコピーしてテキストに貼り付ければ簡単に確認が取れます（個人的な方法ですが私はアドレスバーを利用します）。

上の例では、FONTのsize属性からだととれる値が限られるのでスタイルシートで変更をしています。

COLOR

他にもFONTタグを使って色を変更する事も出来ます。この「色」を利用して隠す手法は割と多く見かけます。この記述方法は大きく別けて二種類。カラーネームを記述する方法と16進法のカラーコードで記述する方法です。カラーコードに限らずコンピュータでは16進法がよく利用されます。カラー対応のブラウザであれば次の文字は赤く記述されているはずです。

普段使っているのは0~9の数字で表す10進法、そこにA~Fを加えて合計16種で表すのが16進法です。10進法では9の次は10ですが、16進法では9の次はAで、10はFの次です。即ち、16進法のAは10進法の10、16進法の10は10進法の16という事になります。

色も色々

ソースにはこのように記述されています。


<font color="red">色も</font>
<font color="#ff0000">色々</font>

上記のものはFONTのcolor属性を用いてブラウザの表示上同じ赤色を指しています。他にもどんな色があるかもう少し詳しく知りたい方は【カラーチャート】のページでも参考にして下さい。そこで仮に下記のような問題があったとします。

人間は考える葦である

ソースでの記述は下記の通りです。


<font color="#999999">人</font>
<font color="#aaaaaa">間は</font>
<font color="#bbbbbb">考</font>
<font color="#cccccc">える</font>
<font color="#dddddd">葦</font>
<font color="#eeeeee">で</font>
<font color="#ffffff">ある</font>

この場合私なら、実際にカラーネームの存在する"#ffffff"、「white」を解答にします。タグの意味を知らなければその時点で盲点になっているのかも知れません。

ちなみにFONTタグは非推奨タグの一つです。文書構造はHTML、整形にはスタイルシートを使用するように勧められています。

ではここで一問。わからない場合は調べて下さい。

[ もっとも短い問題 ]

MARQUEE

遊び要素として「MARQUEE（マーキー）」は隠しページでもよく使用されています。実際の動作は下記の通り。

左スクロール右スクロール左右折り返し移動上スクロール下へスクロール速く左スクロール

MARQUEEはその動作から使い方次第で面白い問題も出来るかと思います。下記のようなマーキー顔文字といったものを集めて展示しているサイトもあるので、自分で色々作ってみるのも面白いかも知れません。しかしさすがに、下のものはIEじゃないと少し挙動不審な動作をしますね。

(´ｰ`)y-~ ~ ~

このMARQUEEタグは非推奨タグの一つです。色んな機種に対応すれどこれはIEの独自タグでありHTMLの正式な仕様にはありません。

不明タグ

閲覧した人がタグを知らない事を当てにした隠し方です。例えば下のものがそうです。


<flat>腹減った</flat>

今度はカラーとは逆に実際にはタグとして存在しない「flat」がここでは答えになります。しかし、知らない人にとっては全く疑問視するものではないでしょう。これは語るほどのものじゃないですが、タグに拘わらず相手が知らない事を前提に組まれた問題はたくさんあります。この辺りの事は以降の章でその都度述べていきます。

様々なタグ

タグの使用傾向は制作者によって違います。実際にはここには記述されていない様々なタグがあります。そこで発見のポイントは【ソース編】で書いた事と同じです、まずはソースの比較。それと並行してタグについてはウェブサイト作成支援などのサイトを活用するのが良いと思います。より多くのタグを知る事が解法の秘訣です。

なぜ、制作者でもないのに知っている方が良いかというと、知っていれば問題の意図に気付きやすいからです。知らないと闇雲に試さないと答えが出ないという状況が起こります。これではいつも解けるとは限りませんし、同じような問題の時にまた同じ事をする嵌めになります。それに、問題を解くのに制作者の心理を読み取る事は大切な事です。その力を養う為には、経験も大切ですが、知識も疎かには出来ません。とはいえ、制作者も完璧ではないので疑心暗鬼もほどほどに。

例題

それでは例題です。読解力の問題なのかな？

例題【 Can You Read? 】

次の【アドレス編】へ進む