builtlast
2012-11-13 10:33:25
[HTML]
だって header だもの？！
投稿者からのアピールポイント
最近話題になったとある Web サービス。。 ソースコードを覗いたら、ツッコミどころ満載。 5つすべての間違いに気づきましたか？
<!doctype html>
<html lang="ja">
<head>
<!-- ... -->
</head>
<!-- ヘッダー -->
<header id="header_bar">
<div id="header_bar_inner">
<div class="logo">
<a href="/"><img src="images/logo.png" alt="ロゴ"></a>
<span class="header_title"><h1>ここにサービスの名前</h1><span>
</div>
<ul class="menu">
<!-- グローバルナビ -->
</ul>
</div><!-- header_bar_inner -->
</header><!-- #header_bar -->
<!-- ヘッダーここまで -->
<body>
<!-- コンテンツ -->
使い方ヒント: 「これは臭う」という行を見付けたら、各行の
をクリックしてマーキングしておきましょう(要Twitter OAuth認証)
コメント(4)
これHTML5じゃないの？HTML5だったら<header>～</header>及び<footer>～</footer>のタグがありますよー
うーん、自分が見つけられたのはこのくらい。。
| 7&20行目 | <header> は<body> の下位要素にする必要あり。 |
| 10行目 | <img> にwidth属性とheight属性が欲しい。(必須じゃないけど) |
| 11行目 | </span> を <span>と書き間違えている。 |
| 11行目 | <span>の下位要素に <h1> は書けない。 |
| 21行目以降 | 省略したのか元々こうだったのか判断できないが、 </body> と </html> がない。 |
| (アピール文の中) | 解釈が人により分かれるけど、一般に「Webサービス」って、「Web上で展開されるHTMLベースのサービス」のことを指す用語じゃないから。。 |
コメント投稿には、twitter認証が必要です。
Twitter認証
規格が未完成とはいえ...なんらかのチェック方法はないんかね...