Comments
Description
Transcript
作業課題: ウェブサイト構築
平成 23 年度第 4 回 1 級 実技試験 作業課題: ウェブサイト構築 <課題制作要件をみたし、<A.ウェブサイト提案依頼要件>および課題 1. <仕様1 技術要件>、 <課題 2.<仕様 2 ウェブグラフィック>、課題 3. <仕様 3 マルチメディアデータ>、課題 4. <仕様 4 DB(データベース)によるコンテンツマネージメント機能仕様>に従い、制限時間 180 分以内 に計 3 ページ(以上)のウェブサイトを制作すること。 課題 1.ウェブサイト設計・構築およびウェブデザイン作業 仕様に基づいたトップページを含む全 3 ページのウェブサイト作成 (X)HTML および CSS のコーディング作業 ウェブ標準・アクセシビリティに配慮したサイト制作 課題 2.ウェブサイトデザイン作業 各種グラフィック素材の加工および利用 課題 3.ウェブサイトデザイン作業 Flash を使用したアニメーション作成 課題 4.サーバサイドデザイン作業 -サーバサイドアプリケーションの作成 データベースおよびサーバサイドアプリケーションを利用した、ダイナミックなページ作成 (なお作成にあたっては XSS(クロスサイトスクリプティング)、SQL インジェクションなどのセキュリ ティ対策に留意すること) 1 平成 23 年度第 4 回 1 級 実技試験 <課題制作要件> 1. 企業ウェブサイトをサイト提供側およびサイト利用者に配慮して、デザインし構築しなさい。サイト構築に関わる 必要な情報は A.ウェブサイト提案依頼要件(RFP)に基づき設定しなさい。ただし、仕様 1.2.3.4 にあげられる機 能以外については、実際に実装し稼動させる必要はない。ウェブサイトを制作するためのウェブサイト提案依頼 要件およびトップページに利用するドキュメント素材が、プレーンなテキストの状態でデスクトップの material フ ォルダの data フォルダに収納してある。サイトに利用するテキストなどはダミーテキストを利用しても構わない。そ の資料を基にウェブサイトのナビゲーション、ページ構成を検討し作成すること。必要なグラフィックパーツなどは material フォルダの img フォルダの画像素材を加工して利用したり、自由に作成しても構わない。 2. 1.の内容をふまえ、課題1 <仕様1 技術要件>および課題 2 <仕様 2 ウェブグラフィック>、課題3 <仕様 3 マルチメディアデータ>、課題4 <仕様 4 DB(データベース)によるコンテンツマネージメント機能仕様>に従 い、トップページを含む全 3 ページ以上のウェブサイトを 180 分以内に作成し、指定の保存場所に保存し、指定 ウェブブラウザで閲覧できる状態にすること。 3. 必須のページは「トップページ」と「フロントエンド(セミナー検索ページ, セミナー紹介ページ)」、の 3 ページで ある。制作するウェブサイトは必ずウェブサイト提案依頼用件に含まれる内容が含まれることとする。「トップペー ジ」は各受検者がウェブサイトの目的などから仕様に従い、ページタイトル、構成、内容について設定し作成する。 すなわち、すべてを作成するのではなく、テキスト、画像などを含み、完成した状態にするのは「トップページ」と 「フロントエンド(セミナー検索ページ, セミナー紹介ページ)」の 3 ページ以上とする。「ダミーページ」が必要な場 合は適切にリンクおよびページタイトルを設定し作成すること。規定の 3 ページに対してはリンク等を設定し、す べてのリンクが稼動した状態とすること。 下記の図は各ページを示すが、メニュー、ナビゲーション、各種リンク、階層については、仕様にしたがい自由 に構成してかまわない(下記の図に従う必要はない)。ダミーページのページタイトルについては設定する必要 があるが、各自設定し作成してかまわない。 トップページ セミナー紹介ページ フロントエンド ダミーページ セミナー検索ページ ※「フロントエンド」は、セミナー検索処理後にセミナー紹介ページに遷移する場合は、2 ページとなる。 4. ウェブサイト作成の際に使用する画像ファイルは提供されるのでふさわしいものを選択し、適切な状態に加工 して使用することができる。【画像データ】はデスクトップの material フォルダの img_data フォルダに収納してあ る。 5. 必ず使用しなければならないロゴマーク(グラフィックデータ)として、logo.ai,logo.eps のいずれかを必ず加工 して使用しなければならない。配布されたグラフィックデータは適切なファイル形式かどうか判断し、必要があれ ば変換してもかまわない。【グラフィックデータ】はデスクトップの material フォルダの graphic_data フォルダに 収納してある。 2 平成 23 年度第 4 回 1 級 実技試験 6. ウェブサイトは PHP、データベースを利用した動的なサイトとして構築すること。特に課題、仕様に基づいてウ ェブサイトを設計・デザインする必要がある。PHP および PHP My Admin 、MySQL を受検者は利用すること ができる。コンテンツマネージメントシステムは、仕様 4 に従い、1.セミナーの並び替え、2.セミナーの検索、3. セミナー別情報ページ表示の機能が実装されていること。また各種機能の詳細については、仕様 4 に従うこと。 7. セミナー検索ページに使用するデータは material フォルダの db フォルダに収納してある。sample.db ファイ ルである。これは MySQL からダンプされたものなのでリストアして使用することができる。また、オリジナルデー タとして同じフォルダに sample.csv というファイルがある。 セミナーの画像は db フォルダ内の images フォルダにあり、ファイルの名前はテーブル seminar のカラム lecture_photo で指定してある。なお、sample.db は UTF-8 で記述されている。 8. 課題の完成については、各自のウェブサーバの DocumentRoot にデータを適切に保存し、保存先のディレ クトリ直下に index.html または index.php を配置することとする。なお、PHP 等で DocumentRoot の外にモ ジュール等のファイルを配置する時は Script 側からは相対パスでアクセス可能にしておき、これらのパスはチェ ックシートの記入欄に記述しておくこと。また、課題作成過程の各種ソースファイルなどは、各受検者の検定用 PC に source という名称でフォルダを作成して、保存しておくこと。 3 平成 23 年度第 4 回 1 級 実技試験 <A.ウェブサイト提案依頼要件(RFP)> 特定非営利活動法人インターネットスキル認定普及協会 ウェブサイト 特定非営利活動法人インターネットスキル認定普及協会について 特定非営利活動法人インターネットスキル認定普及協会は、インターネット利用者へのインターネット利用技術の向上に向 けた啓蒙、普及活動を行っている非営利団体である。また、ウェブデザイン技能検定試験、競技大会の実施、国際的なウェブ デザイン技能の普及、技能者育成への支援活動、人材育成を行っている。特にウェブデザインにかかわる人材育成、訓練の ためのセミナー等を 2012 年 3 月より開催する予定である。キャッチフレーズ(コーポレートステートメント)は、「ウェブにかかわ るすべての人へ」である。 ターゲットユーザ 対象利用者は当該協会に興味を持つ方、また当該協会が実施するセミナー等を受講する見込みのある方々。ターゲットと する年齢層はインターネット、ウェブデザインに興味のある 18 歳以上の男女、閲覧者は 30 代から 40 代の女性が最も多い。 対象利用者にはパソコン操作に習熟していない高齢者も一定数おり、アクセシビリティやユーザビリティにも配慮した構成、ナ ビゲーションが必要である。 企業情報 商号:特定非営利活動法人インターネットスキル認定普及協会 英字表記:Association for Net Skill Certification and Promotion コーポレートカラー:#000066 住所:〒160-0023 東京都新宿区西新宿 6-2-3 新宿アイランドアネックス 407 電話(代表):03-XYZX-LMNO FAX:03-XYZX-LMNO Email: [email protected] コピーライト表記:Copyright 2007 NSPC All rights reserved. サイトに要求される機能・情報について ※注意:要求は順不同であり、1 つの項目が 1 つのWebページをあらわしているわけではない。 ・与えられた組織のロゴタイプを必ず使用し、コーポレートカラーを必ずウェブサイトに用いること。 ・トップページにビジュアルイメージとしてFlashによるアニメーションを使用すること。 ・新着情報のエリアをトップページに設定すること。 ・サイト内検索機能を設置すること。 ・セミナーコースの並び替え、検索、選択機能を実装すること。 ・セミナー講師情報も表示できるようにすること。 ・プライバシーポリシーを示し、組織情報を提供すること。 必須グローバルナビゲーション項目 ホーム 新着情報 協会概要 セミナー検索 ※フロントエンドおよびセミナー紹介ページ 企業情報 サイトマップ 4 平成 23 年度第 4 回 1 級 実技試験 課題 1. <仕様1 ウェブサイト技術要件> ・(X)HTMLおよびCSSについては、JIS X 4156:2000 (ISO/IEC15445:2000) および W3C(ワールドワイドウェブコ ンソーシアム)HTML4.01 を推奨し、拡張可能なハイパテキストマーク付け言語(XHTML)はW3C XHTML 1.0 以降 を推奨する。段階スタイルシート(CSS)については JIS X4168:2004 および W3C CSS level1 以降を推奨する。 作成するHTMLファイルの文字コードはUTF-8 にすること。 ・適切な構造化(structured markup/semantic markup)を行い、ウェブ標準に基づいた設計、実装に留意する こと。 ・ターゲットブラウザは、Windows Internet Explorer 8 以降および Mozila Firefox3.x 以降とし、それぞれのブラ ウザで正しくブラウジングされ、操作可能とすること。 ・ディスプレイ解像度 1024 x 768 で閲覧、操作可能とすること。 ・JIS X8341-3 または W3C WIA WCAG1.0 に基づき、アクセシビリティに配慮し制作を行うこと。 ・トップページは、index.htmlまたはindex.phpとすること。 ・画像を利用する場合は画質、階調、圧縮技術等、ウェブ用画像ファイルの最適化をおこなうこと。 ・PHPおよびMySQLを利用したダイナミックなサイトを構築すること。 ・サーバにアップロードされ、ウェブブラウザで閲覧できる状態とすること。 課題 2. <仕様 2 ウェブグラフィック> ウェブサイト作成の際に使用可能な画像ファイルは提供されるので受検者はふさわしいものを選択し、適切な 状態に加工して使用することができる。【画像データ】はデスクトップの material フォルダの img_data フォルダ に収納してある。 必ず使用しなければならないロゴマーク(グラフィックデータ)logo.ai および logo.eps を受検者は必ず加工し て使用しなければならない。配布されたグラフィックデータは適切なファイル形式かどうか判断し、必要があれば 変換してもかまわない。【グラフィックデータ】はデスクトップの material フォルダの graphic_data フォルダに収 納してある。 5 平成 23 年度第 4 回 1 級 実技試験 課題 3. <仕様3 マルチメディア> アニメーションはトップページのビジュアルイメージ用として作成すること。 内容については、規定しないが、アニメーションは 15 秒以上で制作し、素材 logo.ai または logo.eps のロゴデ ータ(イメージ)が含まれていること。 アニメーションファイルの容量は 500k バイト以内とすること。 課題 4. <仕様 4 DB(データベース)によるコンテンツマネージメント機能仕様> 以下の機能を備えたコンテンツマネージメントシステムが備えられていること。また CMS は GUI で操作でき ること。 作成にあたっては XSS(クロスサイトスクリプティング)、SQL インジェクションなどに留意すること。 DB によるコンテンツマネージメントシステムの機能 機 能 名 並び替え 検索 選択 詳 細 条件によりセミナーの並び替え、ソートが可能なこと テキスト入力によるセミナーの検索が可能なこと 選択したセミナーの情報ページの表示が可能なこと 1) 上記の機能が DB との連携機能を使って、実装されていること。 1)各セミナーは以下の情報とそれぞれのセミナーに対応する画像が必ず表示されること。 セミナーコース名 セミナー実施年月日 時 間 内 容 6 講師情報 セミナー番号 平成 23 年度第 4 回 1 級 実技試験 <留意事項> 実技試験は、検定用PCまたは受検者が持参したPCを利用して実施される。 受検者は 180 分間で作業を完了させること。 本検定試験では Windows Internet Explorer 8 および、Mozilla Firefox3.x 以降の安定版を指定ブラウザとする。 課題で利用する素材は、デスクトップのフォルダ(ディレクトリ)material フォルダに配布している。それぞれの課題に従 い、課題データは適切なフォルダ(ディレクトリ)に保存を行うこと。保存するデータは課題分のみとし、不適切なデータの保 存や不要なファイルがある場合は減点の対象となる。 また、受検者は作成中の課題が指定のブラウザで正しく閲覧できる状態であるか、適宜、受検中に確認することを推奨 する。 作成するデータやページファイルには 2 バイト文字は使用せず、半角英字のみとして、スペースなどをいれずに作成す ること。またファイルのデータ形式、拡張子等にも留意すること。保存先は問題で作成を指示されたフォルダを作成し必ず 保存すること。問題で規定された以外のデータは一切、採点の対象とならない。 本検定試験では、ハイパテキストタグ付け言語(HTML)については JIS X 4156:2000 (ISO/IEC15445:2000) および W3C(ワールドワイドウェブコンソーシアム)HTML4.01 を推奨し、拡張可能なハイパテキストマーク付け言語(XHTML)は W3C XHTML 1.0 以降を推奨する。段階スタイルシート(CSS)については JIS X4168:2004 および W3C CSS level1 以降を推奨する。設問中、(X)HTMLファイルとある場合はHTMLとXHTMLどちらを選んでもよい。また、作成する HTMLファイルの文字コードはUTF-8 にすること。 7