Quantcast
Viewing all articles
Browse latest Browse all 19485

Webサイトのガイドライン6つの事例集+品質チェックマニュアル&チェックシート | Web制作・運用現場のための「課題解決」の教科書 | Web担当者Forum

書籍から、3-1. 「Webサイトの品質管理に使うルールドキュメント」の内容をお届けします。

前半は品質管理に使うルールドキュメントの全体像について、後半は6つのルールドキュメント事例と、品質チェックマニュアル&チェックシートについて解説します。

Webサイトの品質管理に使うルールドキュメントとは、いわゆる「ガイドライン」のことです。適切なガイドラインを持つことにより、Webサイトのコンテンツをユーザーにとって使いやすく、運用しやすく、成果が上がりやすい状態に保つことができます。

あさみ「鈴木先輩、ソーシャルメディア運用ガイドラインの虎の巻、ありがとうございました! あれを見れば、運用に関わるルールや決まりごとが一目瞭然でした。とっても助かりました」

鈴木「役に立ったようで良かったよ。ソーシャルメディアに限らず、運用品質を維持するためのルールを決めておくことは、とても大事だよね」

あさみ「確かにそうですね。普段のWeb制作・運用でも、私が入る前から色々なルールやガイドラインが用意されていました。それが業務のよりどころになっていましたね。でも、どんな種類のガイドラインがあって、何の目的であるのかは、正直あまり理解できていません……」

鈴木「よし、よい機会だ。ガイドラインについて講義しようか」

あさみ「よろしくお願いします!」

3-1-1 品質管理に使うルールドキュメントの全体像

「ガイドライン」とは、Webサイトの品質基準や仕様を定めたドキュメント

Image may be NSFW.
Clik here to view.
様々な企業のガイドライン。ガイドラインにはデザインやコーディングなど、様々なルールが書かれている。必須項目はどの企業でも似通っているが、ルールの細かさや必須以外の項目は企業により異なる(一部画像をぼかしています)。

Webサイトをリニューアルすると、気の利いたWebベンダーであれば「ガイドライン」と呼ばれるドキュメントを一緒に納品してくれます。Webサイトのリニューアルと運用の担当ベンダーが異なるとき、運用ベンダーが欲しがる資料には必ず「ガイドライン」が入っています。ガイドラインとは、Webサイトを更新するときに守ってほしい、Webサイトの品質基準や制作仕様を記述したルールドキュメントで、運用には不可欠な資料になります。

企業のWeb担当者の方は、詳しく中身を見たことがないかもしれませんが、ガイドラインを開いてみると、Webサイトのデザインやコーディングのルールが記述されていることが分かります。企業によっては、文章の用字・用語のルールや、障がい者・高齢者配慮(アクセシビリティ)のルールが記述されていることもあるでしょう。ガイドラインに絶対に欠かせない項目というものはいくつかありますが、どこまで詳細なルールを定めるかは企業ごとに異なっています。

自社のWebサイトの品質は、自分たちで担保する。そのためのガイドライン

HTMLの知識があれば、Webページの更新自体はそれほど難しくありません。何十ページ(場合によっては何百ページ!)にもなるガイドラインは、なぜ必要なのでしょうか? それは、大勢のスタッフ、大勢のステークホルダーがWebサイトの更新に関わる中で、サイトの品質を守っていくためです。

雑誌のインタビューを受けたとき、用字・用語の適切さなど、インタビュー記事の品質は雑誌の編集者が担保してくれます。街角に広告を出稿したとき、法律違反の記載がないかなど、広告のクオリティは広告代理店が担保してくれます。でも、企業のWebサイトでコンテンツを公開したとき、その品質は誰も守ってくれません。自社サイトの品質は、自分達で管理しなくてはならないのです。それには、守りたい品質基準や制作仕様をきちんと決めておく必要があります。

個人のホームページであれば、自分でデザインやコーディングの基準を決めて、自分で守っていけば済みます。品質基準や制作仕様は、その人の頭の中だけにあれば十分です。しかし、企業サイトには大勢のメンバーが関与します。企画のスタッフも制作のスタッフも複数人が関わります。各事業部や広報部、人事部など、依頼側のステークホルダーも多種多様です。全員がルールを守って運用していくためには、ルールはドキュメントとして明示されなくてはならないのです。これが、ガイドラインと呼ばれるドキュメントが必要な理由です。

ガイドラインのルール項目はWebに対する企業姿勢を映す鏡

様々な企業のガイドラインを見ていると、気がつくことがあります。それは、ガイドラインのルール項目が、その企業がWebサイトをビジネス上どう位置づけているか、誰にどんな風にWebサイトを使って欲しいのかという姿勢を反映していることです。

例えば、ECサイトのガイドラインはコピーライティングの品質やSEOに関するルールが手厚くなっています。激しい獲得競争に勝ち抜きたい、自社サイトを買い物場所に選んでもらいたいという思いが伝わってきます。銀行や電力・ガスなど社会インフラとなる企業のサイトでは、アクセシビリティに関するルールが手厚くなっています。自社のサイトを使えない人がいてはならないという、使命感を表しているのでしょう。グループガバナンスを重視する企業のサイトでは、デザイン・コーディング仕様を厳しく統制し、さらに違反ができないようにCMSで実装を縛っています。逆に、最低限のこと以外は各事業部に委ね、成果を競わせているような企業もあります。

ガイドラインでルール化するということは、自社にとって「良いWebサイトとは何か」を定義していることでもあります。ガイドラインを作るというと、ルールを統一することや項目を網羅することに意識が向きがちですが、メンバー全員が「守る意義がある」と感じられるルールを作る方が大切です。それを突き詰めていくと、ガイドラインがWebに対する企業姿勢を示すようになっていくのでしょう。ガイドラインを作るときは、ベンダー任せにせず、自社に必要な品質基準・制作仕様を自分達で考えるようにしたいものです。

品質管理のルールは、品質基準・制作仕様・チェック方法の3タイプ

品質管理に使うルールドキュメントは、図3-1-1のような体系で整理できます。

Image may be NSFW.
Clik here to view.
図3-1-1 品質管理のルールは品質基準、制作仕様、チェック方法の3層構造で整理できる。PC向け、スマートデバイス向け、携帯電話向けで、別々にルールを作ることが多い。

(1)品質基準に関するルール

Webサイトが本当に満たしたい品質を定義します。例えば、特定商取引法や景品表示法を遵守していること、自社のCI(コーポレート・アイデンティティ)やVI(ビジュアル・アイデンティティ)のルールを守っていること、個人情報の漏洩やウイルス感染のリスクがないこと、ユーザーにとって使いやすいこと、障がい者や高齢者に配慮していること、検索エンジンから正しく検索できることなどが、代表的な品質基準です。ちなみに、Webの世界では使いやすさを「ユーザビリティ」、障がい者・高齢者対応を「アクセシビリティ」、検索エンジン対応を「SEO」と呼ぶことがあります。

品質基準に関するルールは、Webサイト用に新しく作るよりも、「Webサイトも既存のルールに準拠する」という形で定義することが多いようです。法律はもちろんですが、ブランドルールも既存のCI・VIガイドラインに準拠するべきですし、Webアクセシビリティに関してはWCAG2.0(日本ではJIS X 8341-3という公的標準に採用)という国際標準ルールがあります。WebユーザビリティやSEOについては、一般に出回っている知見を参考にしつつ、注力するルールを独自で定める必要があるでしょう。

なお、品質基準はWebサイトに関する上位ルールであると同時に、その他のルールを守る理由付けとしても使われます。例えば、「サイトのナビゲーションのデザインをこのように統一する」という制作仕様のルールを守る理由として、「使いやすさのために一貫したナビゲーションを使う」というユーザビリティのルールを挙げることができます。

(2)制作仕様に関するルール

Webサイトの制作時に守るべき仕様を定義します。Webサイトを更新するには、更新するコンテンツの情報整理のフォーマット(コンテンツモデル)、Webページの視覚表現(デザイン)、実装手法(コーディング)を決める必要があります。もちろん、毎回好き勝手な仕様を決めてもいいのですが、(1)の品質基準に関するルールを守ることや、チームでの運用を効率化することを考えると、統一の仕様を決めておくことが合理的です。

いわゆるデザインガイドラインやコーディングガイドライン、原稿開発ガイドラインなどが、ここに含まれています。

(3)チェック方法に関するルール

コンテンツの品質基準や制作仕様のルールが守られていることを担保するための、品質チェック方法を定義します。(1)の品質基準、(2)の制作仕様は、Webサイト・Webページという「モノ・成果物」に関するルールでしたが、ここだけは品質チェックという「タスク・業務」のルールになります。

チェックシート(チェック項目)、チェックツール、チェックプロセス(いつ、誰が、どのチェックを行うか)の3つを定義しておくことが大切です。

まとめ

  • 品質管理に使うルールドキュメントとは、いわゆるガイドラインのこと。Webサイトの品質基準や制作仕様を記述した、運用に不可欠なドキュメントである。
  • ガイドラインに必須のルール項目はあるが、必須以外の項目や各項目のルール記述の細かさは企業ごとに異なる。
  • 自社のWebサイトの品質を、自分達で担保するために、ガイドラインがある。
  • Webサイトで守りたい品質基準・制作仕様は、自分達できちんと考えて決める。
  • 統一性や網羅性より、スタッフ全員が守りたいと思えるメリハリのあるルールにする。
  • 品質管理のルールには、品質基準・制作仕様・チェック方法の3タイプがある。

3-1-2 品質ルールドキュメントの事例紹介

それでは、実際に品質管理に使われているルールドキュメントを見てみましょう。ここではサンプルとなるルールドキュメントの事例を紹介します。自社でガイドラインの過不足を考える場合などに活用してください。

ユーザビリティ・アクセシビリティガイドライン

目的

Webサイトが満たすべきユーザビリティ・アクセシビリティ品質の明確化

対象者

主に企画スタッフ、設計スタッフ、テンプレート開発スタッフなどが利用

内容

Webサイト運用の経験から得られた、サイトのユーザビリティを高める(ユーザーが、より確実に、速やかに、快適に、目的を達成できる)ためのルールを記述します。また、アクセシビリティに関する国際標準WCAG2.0の、どの項目にどんな方法で準拠するかを記述します。

ユーザビリティ・アクセシビリティガイドラインを作るのであれば、単にWCAG2.0の引き写しではなく、使いやすいように項立てを工夫してください。できれば制作仕様のガイドラインと対照しやすいように項立てして、制作仕様を守れば品質基準も自動的に守られる関係にしておくとよいでしょう。

目次(例)
  1. 本書について
    • (a)本書の目的と位置づけ
    • (b)ユーザビリティ対応原則
    • (c)アクセシビリティ対応原則
  2. 環境・技術に関する基準
    • (a)想定するユーザー環境
    • (b)マークアップ言語と文書構造
    • (c)宣言およびメタ情報
    • (d)プラグイン・その他の技術
  3. 視覚表現に関する基準
    • (a)ページのレイアウト
    • (b)画像
    • (c)テキスト
    • (d)その他の表現
  4. 操作要素に関する基準
    • (a)ナビゲーションシステム
    • (b)リンク
    • (c)フォーム
    • (d)音声・動画

アクセシビリティ対応原則

Image may be NSFW.
Clik here to view.

マークアップ言語と文書構造

Image may be NSFW.
Clik here to view.

テキスト

Image may be NSFW.
Clik here to view.

ナビゲーションシステム

Image may be NSFW.
Clik here to view.

SEOガイドライン

目的

Webサイトが満たすべきSEO(検索エンジン最適化)品質の明確化

対象者

主に企画スタッフ、設計スタッフ、テンプレート開発スタッフなどが利用

内容

Webサイト運用の経験から得られた、サイトのSEO効果を高めるためのルールを記述します。基本的にキーワードに依存しないSEO内部施策(サイト内の施策)のルールが中心で、特定キーワードのための施策や、SEO外部施策(外部からリンクを得るための施策)は除外しています。これは、ガイドラインによる統一的対応が有効か否かで分けています。

目次(例)
  1. 1. 本書について
    • (a)本書の目的と位置づけ
    • (b) SEO対応原則
  2. 2. SEOの基礎知識
    • (a)検索エンジンの仕組み
    • (b)SEO施策の前提と基本的なSEO施策
    • (c)キーワード選定指針
    • (d)SEOスパムとペナルティ
  3. 3. サイト構造に関する基準
    • (a)ドメイン、ディレクトリ、ファイル構造
    • (b)ナビゲーション、ブレッドクラム、サイトマップ
    • (c)URL変更時の対応
  4. 4. HTMLに関する基準
    • (a)マークアップ言語と文書構造
    • (b)宣言とメタ情報、Open Graph Protocol
    • (c)キーワード・ライティング
    • (d)リンクの記述
  5. 5. SEO改善に関する基準
    • (a)ウェブマスターツールの設定
    • (b)Google Analyticsの設定

検索エンジンの仕組み

Image may be NSFW.
Clik here to view.

URL変更時の対応

Image may be NSFW.
Clik here to view.

宣言とメタ情報、Open Graph Protocol

Image may be NSFW.
Clik here to view.

ウェブマスターツールの設定

Image may be NSFW.
Clik here to view.

コンテンツモデル・ガイドライン

目的

コンテンツの目的、掲載情報の分類・構造・導線、画面フォーマットなどの統一

対象者

主に企画スタッフ、設計スタッフ、制作スタッフなどが利用

内容

Webサイトには、製品・サービス情報、サポート情報、セミナー情報、ニュースリリースなど、定型で多数のページがある「カタログのような」コンテンツがあります。そういった定型コンテンツのフォーマットを定義するのがコンテンツモデルのガイドラインです。

そのコンテンツの目的・ターゲットユーザー・サイトマップ上の位置づけ、コンテンツ内に掲載される情報の分類とラベル(分類につける名前)、分類した情報をどういう構造でサイトに掲載するか、どのような導線でコンテンツに出入りさせるか、画面のフォーマットはどのように統一するかなどが記載されます。

これにより、似たようなコンテンツなのに、ページによって情報の分類も見た目もバラバラで使いにくいという問題を防止します。また、新製品が出る、新しいセミナーを告知するといったときに必要な情報の種類が決まるので、毎回パンフレットなどの情報ソースを見て、載せる情報を探す手間が不要になります。地味ですが、更新頻度が高いときはコストや情報の正確さを大きく改善でき、効果的です。

目次(例)
  1. 本書について
    • (a)本書の目的と位置づけ
    • (b)基本情報と付加価値情報の考え方
  2. コンテンツ分類
    • (a)●●カテゴリーのコンテンツ
      • ①●●カテゴリーの目的とターゲットユーザー
      • ②●●カテゴリーの基本構造・導線
      • ③●●カテゴリーの掲載コンテンツ区分
    • (b)●●カテゴリーのコンテンツ
    • (c)●●カテゴリーのコンテンツ
  3. ●●コンテンツの設計ルール
    • (a)掲載情報と構成、必須情報・任意情報とラベル、情報ソース
    • (b)固有のメタ情報
    • (c)固有の画面パターン、ナビゲーション項目
    • (d)固有の運用ルール、システム連動、その他
  4. ●●コンテンツの設計ルール
    • (a)掲載情報と構成、必須情報・任意情報とラベル、情報ソース
    • (b)固有のメタ情報
    • (c)固有の画面パターン、ナビゲーション項目
    • (d)固有の運用ルール、システム連動、その他

●●カテゴリーの基本構造・導線

Image may be NSFW.
Clik here to view.

掲載情報と構成、必須情報・禁止情報とラベル、情報ソース

Image may be NSFW.
Clik here to view.

固有の画面パターン、ナビゲーション項目

Image may be NSFW.
Clik here to view.

固有の運用ルール、システム連動、その他

Image may be NSFW.
Clik here to view.

デザインガイドライン

目的

Webページの視覚表現、デザイン、レイアウトなどの統一

対象者

主に設計スタッフ、制作スタッフなどが利用

内容

Webサイトには、製品の外観写真やプロモーション用の画像など、ページ固有のデザイン要素と、ヘッダ、フッタ、ナビゲーション、見出し、ボタンなどサイト共通のデザイン要素があります。デザインガイドラインでは、サイト共通のデザイン要素、レイアウト、視覚効果など、画面に表示される視覚表現のルールについて定義します。ページ固有の要素でも、トップページのキービジュアルや各ページにあるバナーなど仕様を統一したい場合は、デザインガイドラインに記載します。

テキスト原稿開発のルールについては、デザインガイドラインに掲載する場合と、別に原稿開発ガイドラインを作る場合があります。別冊とするか否かは、事業部の担当者などWeb専門でない人がWeb用のライティングを行うか否かと、原稿書き起こしの頻度で決まってきます。

目次(例)
  1. 本書について
    • (a)本書の目的と位置づけ
  2. 共通レイアウトの定義
    • (a)基本レイアウトパターン
    • (b)共通エリアの表示ルール
      • ①ヘッダ
      • ②フッタ
      • ③グローバルナビゲーション
      • ④ローカルナビゲーション
    • (c)個別エリアの表示ルール
      • ①基本ルール(下層ページのルール)
      • ②トップページ固有ルール
      • ③●●ページ固有ルール
  3. 共通デザインの定義
    • (a)カラースキーム、ブランドルール
    • (b)デザインエレメントとデザインの統一度
      • ①見出しデザイン
      • ②ナビゲーションデザイン
      • ③●●デザイン
      • ④その他の画像パーツ(モジュール化されていないもの)
    • (c)個別デザイン作成ルール
      • ①画像作成ルール
      • ②音声・動画作成ルール
      • ③リッチコンテンツ作成ルール
      • ④PDF作成ルール
      • ⑤印刷用ページ作成ルール
    • (d)特殊デザイン要素
  4. 原稿開発ルール
    • (a)機種依存文字、代替表現、実体参照
    • (b)用字・用語
    • (c)現地語表記一覧(翻訳用語集)

基本レイアウトパターン

Image may be NSFW.
Clik here to view.

ローカルナビゲーション

Image may be NSFW.
Clik here to view.

原稿開発ガイドライン

目的

Webページのテキスト原稿・メタ情報などのライティング品質の統一

対象者

主に原稿開発スタッフ(特にWeb専業でない方)が利用

内容

テキスト原稿のライティングルールを定義します。「デザインガイドライン」で述べたとおり、事業部の担当者などWeb専門でない人がWeb用のライティングを行うことが多い場合は、原稿開発ガイドラインを定めた方が便利です。

目次(例)
  1. 本書について
    • (a)本書の目的と位置づけ
  2. 原稿開発の手順
    • (a)原稿開発に必要なドキュメント
    • (b)原稿開発の手順
      • ①サイト上の配置の決定
      • ②コンテンツの構成の決定
      • ③各ページの画面構成の決定
      • ④テキスト開発・画像素材の調達
    • (c)原稿の提出方法
  3. テキスト原稿開発ルール
    • (a)基本方針:ターゲットを意識した表現
    • (b)テキストの内容に関するルール
      • ①コンプライアンス上の適正表現、商標表示
      • ②ブランディングのための適正表現
      • ③分かりやすさに配慮した表現
      • ④文体、送り仮名、用字・用語の統一
      • ⑤現地語表記一覧(翻訳用語集)
    • (c)Web向けライティングのルール
      • ①文字装飾に関するルール
      • ②見出し表現ルール
      • ③箇条書きの表現ルール
      • ④表枠の表現ルール
      • ⑤数式表現のルール
      • ⑥機種依存文字、代替表現、実体参照のルール
      • ⑦英数字・日付・記号のルール
      • ⑧色彩その他の感覚に依存した表現のルール
  4. メタ情報開発ルール
    • (a)title
    • (b)description/keywords
    • (c)Open Graph Protocol
  5. 画像・動画・PDF開発ルール
    • (a)画像素材の注意点、キャプションと代替テキスト
    • (b)音声・動画素材の注意点、代替コンテンツについて
    • (c)PDF使用時の注意点

原稿の提出方法

Image may be NSFW.
Clik here to view.

文体、送り仮名、用字・用語の統一

Image may be NSFW.
Clik here to view.

コーディングガイドライン

目的

Webページの実装手法の定義、HTML・CSS・JavaScriptなどのコーディングの標準化

対象者

主に制作スタッフが利用

内容

マークアップ言語の種類やコーディングに関する規約、HTMLや画像などのファイルの持ち方、その他Webページの実装に必要な技術のルールを定義します。システム開発で言うところの開発標準に該当します。

HTMLは比較的コーディングの自由度の高い言語ですが、それだけに制作スタッフ個々人が勝手にコーディングを行うと、書き方やリソースファイルの持ち方がバラバラになり、メンテナンスしにくくなってしまいます。それを防止するためには、ガイドラインで標準のコーディング手法を決めてしまうことが有効です。

目次(例)
  1. 本書について
    • (a)本書の目的と位置づけ
  2. 環境と技術に関する定義
    • (a)想定閲覧環境
    • (b)マークアップ言語仕様
    • (c)CSS/JavaScript仕様
    • (d)画像、プラグイン、利用可能なWeb技術
    • (e)印刷対応
    • (f)利用しているシステム
    • (g)外部ASPコード及びシステムタグ
  3. 物理設計ルールの定義
    • (a)共通ファイルの定義
    • (b)個別ファイル命名規則
    • (c)個別ファイル格納規則
    • (d)パスの記述ルール
  4. コーディングルールの定義
    • (a)HTML設計ルール/head部の定義
    • (b)HTMLコーディング規則
    • (c)CSS設計/コーディング規則
    • (d)JavaScript設計/コーディング規則
    • (e)RSS、XML、その他のスクリプトについて
  5. 共通テンプレート・モジュール
    • (a)共通HTMLテンプレート一覧
    • (b)共通HTMLモジュール一覧
  6. 特殊モジュールの仕様について
    • (a)ソーシャルプラグインとOGP
    • (b)トップページ・キービジュアル用XML
    • (c)汎用カルーセル用JavaScript
  7. 共通リソース一覧
    • (a)共通CSS一覧
    • (b)共通JavaScript一覧
    • (c)共通画像一覧

マークアップ言語仕様

Image may be NSFW.
Clik here to view.

個別ファイル命名規則

Image may be NSFW.
Clik here to view.

HTML設計ルール/head部の定義

No要素指定タグ
1文書タイプ宣言固定
2htmlタグ固定
3head開始固定
4HTMLの文字コード告知原則固定
5titleページごとページタイトル
6meta descriptionページごと
7meta keywordsページごと
8スマホの電話番号リンク無効化固定
9viewportをデバイス幅に固定固定
10og:title(投稿見出し)ページごと
11og:type(投稿属性) ※パターン
12og:url(投稿本籍)ページごと
13og:image(投稿サムネイル)原則固定
14og:sitename(投稿元サイト名)原則固定
15og:description(投稿リード)任意
17サイトインデックス指定原則固定
18ファビコン指定原則固定
19WebClipアイコン指定原則固定
20共通CSS読込必要分
21個別CSS読込必要分
22共通JS読込必要分
23個別JS読込必要分
24Google Analytics非同期コード原則固定
25head終了固定
※TOPは、

品質チェックマニュアル&チェックシート

目的

Webページの品質チェック項目・方法・ツールの標準化、チェック手順の明確化

対象者

主に制作スタッフ、品質管理スタッフなどが利用

内容

各種ガイドラインが遵守されていることを検証するため、パターンごとの品質チェック項目の一覧と、各項目をチェックする方法、使うツールなどを定義します。また、それぞれ、どんなときにどんな手順でチェックを行うか、どんなフォーマットで報告するかについてもルールを定めます。

制作スタッフと、検品を行う品質管理スタッフの検証基準を合わせることで、確実かつ効率的な品質チェックが可能になります。

目次(例)
  1. 本書について
    • (a)本書の目的と位置づけ
  2. 検証環境の準備
    • (a)検証端末にインストールすべきツール
    • (b)検証端末の環境設定方法
    • (c)テスト環境へのアクセス
  3. 品質チェックの種類
    • (a)更新ごとに行うテスト
      • ①設計・原稿開発時のテスト
      • ②HTML制作時のテスト(文法的妥当性テスト)
      • ③HTML制作時のテスト(ブラウザテスト)
      • ④公開前テスト
      • ⑤公開後テスト
    • (b)定期的に行うテスト
      • ①クローリングツールによるテスト(外部リンク切れなどの抽出)
      • ②コンテンツ・ライフサイクル管理(古い情報の棚卸し)
    • (c)必要に応じて行うテスト
      • ①テンプレート・モジュール開発時のテスト
      • ②ウェブコンテンツJISの試験
      • ③その他のテスト手法
  4. 品質チェック手順解説
    • (a)設計・原稿開発時のテスト手順
    • (b)HTML制作時のテスト/テンプレート・モジュール開発時のテスト手順
    • (c)公開前テスト/公開後テスト手順
    • (d)クローリングツールによるテスト手順
    • (e)コンテンツ・ライフサイクル管理の手順
  5. 品質チェックシート
    • (a)設計・原稿チェックシート
    • (b)HTMLチェックシート
    • (c)ブラウザチェックシート
    • (d)●●チェックシート
    • (e)ウェブコンテンツJISのチェックリスト

HTML制作時のテスト/テンプレート・モジュール開発時のテスト手順

Image may be NSFW.
Clik here to view.

HTMLチェックシート

Image may be NSFW.
Clik here to view.

まとめ

一般的なWebコンテンツのガイドラインには以下のようなものがある。

  • ユーザビリティ・アクセシビリティガイドライン
  • SEOガイドライン
  • コンテンツモデル・ガイドライン
  • デザインガイドライン(原稿開発ガイドラインを分冊する場合もある)
  • コーディングガイドライン
  • 品質チェックマニュアル&品質チェックシート

ガイドラインをどのように分冊するかは、ルールを定める目的と、ルールの対象者(ガイドラインを使う人)を勘案して決める。

※このコンテンツはWebサイト「Web担当者Forum - 企業ホームページとネットマーケティングの実践情報サイト - SEO/SEM アクセス解析 CMS ユーザビリティなど」で公開されている記事のフィードに含まれているものです。
オリジナル記事:Webサイトのガイドライン6つの事例集+品質チェックマニュアル&チェックシート | Web制作・運用現場のための「課題解決」の教科書 | Web担当者Forum
Copyright (C) IMPRESS CORPORATION, an Impress Group company. All rights reserved.

この記事の筆者

神保 直樹(じんぼ なおき) Chapter3 担当
株式会社メンバーズ Webプランナー/中小企業診断士

2006年にメンバーズに入社。サイトの調査・分析、ガイドライン策定、ウェブコンテンツJIS対応など企業サイトの基盤整備にかかる案件を数多く手がける。2010年、新規事業であるFacebook関連サービスの立ち上げに参画。2012年よりWebマネジメントセンター推進室にて、全社の品質・生産性向上と、革新的なWeb運用サービスの実現を推進している。

雨宮 秀仁(あめみや ひでひと) Chapter2 担当
株式会社メンバーズ

和田 直美(わだ なおみ)Chapter2 担当
株式会社メンバーズ マーケティングプランナー/上級ウェブ解析士

神尾 武志(かみお たけし) Chapter1 担当
株式会社メンバーズ セールス&マーケティングディビジョン ディビジョン長

増井 達巳(ますい たつみ) Chapter4 担当
合同会社フォース 代表社員

株式会社メンバーズ

1995年創業。経営理念に「“MEMBERSHIP”でマーケティングを変え、心豊かな社会を創る」を掲げ、国内大手企業を中心とした顧客企業に対し、デジタルマーケティング分野における戦略立案から企業Webサイトの構築・運用、ソーシャルメディア活用等の支援サービスを総合的に提供しています。

また、メンバーズでは「社会への貢献」「社員の幸せ」「会社の発展」を同時に実現する経営指針「超会社」に基づき、東北復興支援として現地での雇用創出・地域経済活性化を目的とした仙台オフィスの開設やワークライフバランスへの取り組み、健康に働ける職場づくりなど、様々な取り組みを行っています。
http://www.members.co.jp/

Image may be NSFW.
Clik here to view.

Viewing all articles
Browse latest Browse all 19485

Trending Articles