２級ウェブデザイン技能検定実技試験は次のとおり実施します。

【出題形式】：課題選択方式

【合格基準】：70点以上（100点満点）

1. 作業A

   ウェブサイトデザイン

   HTML・XHTML・CSSによるコーディング、画像の利用

   ウェブサイト運用管理

   更新･管理

   作業の概要

   指示されるディレクトリ構造を示す図に従い、HTML ファイル、CSS ファイル、および画像などのソースファイ ルを適切に配置すること。またその構造に適応するよう、各ファイルの記述内容を修正し、更新すること。

   作業のポイント

   <!-- コメント：修正コード記載 -->
   <link rel="stylesheet" href="css/style.css">
   <img src="img/logo.png" alt="ウェブデザイン技能競技大会">
   

   <!-- コメント：修正コード記載 -->
   background-image: url(../img/bg.png);
   background-image: url(../img/bd.png);
   background: url(../img/main_image.jpg) no-repeat center center;
   background: url(../img/ar.png) no-repeat left center;
   

2. 作業B

   ウェブサイトデザイン

   HTML・XHTML・CSSによるコーディング、画像の利用

   ウェブサイト運用管理

   更新･管理

   作業の概要

   指定されるエリアにあるグローバルナビゲーションの各画像に対して、対応した各ページへのリンクを設定す ること。併せて HTML ファイルの内容を指示のとおりに修正し、更新すること。

   作業のポイント

   <!-- コメント：修正コード記載 -->
   <li><a href="index.html">HOME</a></li>
   <li><a href="info.html">競技概要</a></li>
   <li><a href="app.html">参加申込</a></li>
   <li><a href="faq.html">FAQ</a></li>
   <!-- コメント：修正コード記載 -->
   <h1>競技概要</h1>
   <h1>参加申込</h1>
   <h1>FAQ</h1>
   

3. 作業C

   ウェブサイトデザイン

   HTML・XHTML・CSSによるコーディング、画像の利用

   ウェブサイト運用管理

   更新･管理

   作業の概要

   指定されたコンテンツのブロックレベル要素を指示されたレイアウトになるよう、CSS ファイルを修正し、更新す ること。

   作業のポイント

   /* コメント：修正コード記載 */
   #wrap {
   margin: 20px auto;
   }
   

4. 作業D

   ウェブサイトデザイン

   HTML・XHTML・CSSによるコーディング、画像の利用

   ウェブサイト運用管理

   更新･管理

   作業の概要

   指示される要素に関連する背景色と文字色について、CSS ファイルを修正し、更新すること。

   作業のポイント

   /* コメント：修正コード記載 */
   h1 {
     border: double 3px #333333;
     font-size: 1.2em;
     margin-top: 0;
     padding: 10px 15px;
     background-color: #556699;
     color: #ffffff;
   }
   

5. 作業E

   ウェブサイトデザイン

   HTML・XHTML・CSSによるコーディング、画像の利用

   ウェブサイト運用管理

   更新･管理

   作業の概要

   与えられる画像と同じブラウジング結果となるよう、HTML ファイルの body 要素、div 要素に対応する CSS フ ァイルの記述を修正し、更新すること。

   作業のポイント

   /* コメント：修正コード記載 */
   body {
     color: #333333;
     font-family: "メイリオ", 'MS PGothic', Osaka, sans-serif;
     font-size: 16px;
     margin: 0 0 150px 0;
     min-height: 100%;
     padding: 0;
     background-image: url(img/b3.gif);
   
   #wrap {
     background-color: #ffffff;
     border: solid 1px #000;
     line-height: 200%;
     margin: 20px auto 50px;
     min-height: 100%;
     padding-bottom: 40px;
     width: 918px;
     background-image: url(img/c3.png);
   }
   

6. 作業F

   ウェブサイトデザイン

   HTML・XHTML・CSSによるコーディング、画像の利用

   ウェブサイト運用管理

   更新･管理

   作業の概要

   HTML HTML ファイルのコンテンツエリア内の記述を削除し、与えられる文章に対し h1 要素、h2 要素、p 要素、ol 要素、ul 要素のすべてをもれなく使用し構造化を行い、更新すること。

   作業のポイント

   <!-- コメント：修正コード記載 -->
   <h1>ウェブデザイン技能競技大会</h1>
   <h2>競技概要について</h2>
   <p>競技概要を公開しました。詳しくは下記よりご参照ください。</p>
   <ul>
   <li>一般部門概要</li>
   <li>若年部門概要</li>
   </ul>
   <h2>競技日程について</h2>
   <p>競技日程を公開しました。詳しくは下記よりご参照ください。</p>
   <ol>
   <li>若年部門　 5月25日</li>
   <li>一般部門　 6月 7日</li>
   <li>本選大会　 8月30日</li>
   <li>国際大会　10月22日</li>
   </ol>