ウェブサイト制作の民間資格や検定はたくさんありますが、いずれをとっても独占資格の類ではないので有形無実といたっところ。
先日、『ホームページ作成検定の１級持ってます』と仰る方がおりまして、諸般事情にてスキルチェックをすることになったのですが、結果は「なにそれ？」な程度。
主催協会（？）のサイトに問題例と解答例が公開されているので、それを元にこの「１級」がどんなものをを書いてみます。
ソース：日本情報処理検定協会 ホームページ作成検定試験１級
ウェブ制作に従事する者ならコレがどういった性質のものか理解できると思います。
実際、この「回答例」は間違いだらけでして、これをもって答案を採点するなんてとんでもない話だと思います。もちろん求人募集の際のスキル評価の目安にもなりません。
これが「このHTMLソースの間違いを訂正せよ」というなら１級の名に恥じないかもしれませんが・・
多分この記事は検索で引っかかるので、「１級」という名に相応する目線で間違いの指摘をしてみます。
（解答例を上から順に端的に・・）
- DTD宣言が抜けています。FRAMESETを使わなければなりません。
- 特に指定があるものを除き、HTMLタグは小文字で記述すべきです。
- ＜HTML＞に言語属性が抜けています。
- ＜HEAD＞がありません。文字コード指定等、全て抜けています。
- ＜BODY＞の「BACKGROUNDはNGです。CSSで。
- 「受験番号～」は文章ではないのでPタグは不適切です。
- ＜P align="center"＞はNGです。CSSで。
- ＜IMG＞のBORDERはNGです。CSSで。
- ＜IMG＞に代替属性であるALTが含まれていません。
- ＜CENTER＞はNGです。CSSで。
- ＜TABLE＞のBORDERとBACKGROUNはNGです。CSSで。
- ＜TABLE＞に表の概要を記すSUMMARY属性が含まれていません。
- ＜TBODY＞は表をレイアウト目的に用いるときは使用する意味がありません。
- ＜A＞の「TARGET＝BLANK」はNGです。
- ALT属性の値に感嘆符（！）が含まれています。
- リンクタグにメールアドレスを記述すると迷惑メールが増える原因になります。
- ＜SCRIPT＞タグのLANGUAGE属性はNGです。
- （JAVAスクリプトをHTMLソースに直書きするのは好ましくありません）
- ＜FONT＞タグは使うべきではないタグです。CSSで。
- ＜U＞タグは使うべきではないタグです。CSSで。
- ＜INPUT＞にアクセスキーやタブインデックスが指定されていません。
- ＜INPUT＞のテキスト入力項目に初期値が含まれていません。
- ＜SERECT＞のOPTIONに初期値が設定されていません。
- ＜INPUT＞のRADIOに続く文字列がLABEL指定されていません。
- フレーム未対応ブラウザ用の代替ソースが存在しません。
- このHTMLは論理構造化されていません。
というか出題自体が間違ったことをせよ、、と指定してるし・・
模範？解答（サイト掲載解答例の補正のみ）
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" Content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>回答例</title>
</head>
<frameset title="フレーム対応ブラウザ用">
<frame src="menu.htm" name="up" title="フレームの上">
<frame src="menu.htm" name="down" title="フレームの下">
<noframes title="フレーム未対応ブラウザ用">
<body>
<!--▼▼フレーム上部分▼▼-->
<div style="background:url(back1.gif)">
<div>受験番号 名前</div>
<div style="text-align:center"><img src="title.gif" width="536" height="88" alt="徳川種苗園"></div>
<div style="text-align:center">
<p>家庭菜園をはじめてみませんか？<br>自分で作った野菜で作る料理は格別です！<br>ほかにもハーブやガーデニング用の苗も扱っています。</p>
</div>
<div style="text-align:center; margin:0 auto">
<table style="border:5px; background:url(pic1.gif)" summary="この表はナビゲーションメニューらしい">
<!--この表はレイアウトに用いられているため見出しに相当するセルがありません-->
<tr>
<td style="text-align:center" rowspan="2"><img style="border:none" src="pic2.gif" width="150" height="96" alt="新鮮"></td>
<td style="text-align:center"><a href="page1.htm" target="down">家庭菜園</a></td>
<td style="text-align:center"><a href="page2.htm" target="_blank">ハーブ</a></td><!--TARGET=BLANKはNG-->
<td style="text-align:center"><a href="page3.htm" target="_blank">ガーデニング</a></td><!--TARGET=BLANKはNG-->
<td rowspan="2"><img style="border:none" src="pic3.gif" width="150" height="96" alt="安全"></td>
</tr>
<tr>
<td colspan="2"><a href="form.htm" target="down">苗のプレゼントを実施中！！</a></td>
<td style="text-align:center"><a href="mailto:*****">MAIL</a></td>
</tr>
</table>
</div>
</div>
<!--▲▲フレーム上部分▲▲-->
<!--▼▼フレーム下部分▼▼-->
<script src="script.jp" type="text/javascript"></script>
<div style="background:url(back1.gif)">
<p style="text-align:center; text-decoration:underline; font-size:xx-large; color:#0000ff">プレゼント申し込み</p>
<p style="text-align:center">応募されたかたの中から抽選で２０名様に苗をプレゼント！<br>３種類の苗の中から。お好きなものを選んでください</p><div style="text-align:center; margin:0 auto">
<!--form-->
<table style="background:#00ff00; border:1px" summary="問い合わせフォーム">
<tr>
<th scope="row">名前</th>
<td><input type="text" name="name" size="20" accesskey="1" tabindex="1" value=""></td>
</tr>
<tr>
<th scope="row" abbr="メアド">メールアドレス</th>
<td><input type="text" name="mail" size="40" accesskey="2" tabindex="2" value=""></td>
</tr>
<tr>
<th scope="row">苗の種類</th>
<td>
<select name="plant" tabindex="3">
<option value="p1" selected>ピーマン</option>
<option value="p2">なす</option>
<option value="p3">トマト</option>
</select>
</td>
</tr>
<tr>
<th scope="row">株数</th>
<td>
<input type="radio" name="su" id="su1" value="3" tabindex="4"><label for="su1">３株</label>
<input type="radio" name="su" id="su2" value="5" tabindex="5"><label for="su2">５株</label>
<input type="radio" name="su" id="su3" value="7" tabindex="6"><label for="su3">７株</label>
</td>
</tr>
</table>
<div style="text-align:center">
<input type="submit" value="申し込む" accesskey="s" tabindex="7">
<input type="reset" value="リセットする" accesskey="c" tabindex="8">
</div>
<!--/form-->
</div>
<script src="plant.js" type="text/javascript"></script>
</div>
<!--▲▲フレーム下部分▲▲-->
</body>
</noframes>
</frameset>
</html>
これなら１級の名に恥じないかな？
0 コメント:
コメントを投稿