ベストECショップ大賞2006/グッドデザインショップ認定 特設サイト

全国イーコマース協議会(EC協議会)が運営する「ベストECショップ大賞」と「グッドデザインショップ認定」の解説を行う特設サイトです。

【E-01】機種依存文字を使っていない

丸囲み数字やローマ数字などの、OSによって文字化けする文字(機種依存文字)を使用していないかどうかをチェックします。

丸囲み数字やローマ数字に代表される機種依存文字は、OSによって意図しない文字に化けてしまうため、制作者と違うOSを使用しているユーザーに意味が通らなくなってしまいます。

この項目に関するご質問、Q&Aはこちら

【E-02】予告なしに音声や動画などが再生しない

音声ファイルや動画ファイルなどが使用されている場合、利用者が事前に把握できるよう配慮されているかどうかです。

アクセスしたページにて音声ファイルや動画ファイルが自動的に再生されると、利用者が対処しきれないことがあります。また、これらのファイルはデータ量が大きく、読み込みに時間がかかり、音声が出ることで利用者だけでなく、周囲の人にまで不快感を与えることもあります。これらのファイルを利用する場合は事前にユーザーに知らせ、またユーザーが再生、停止などの制御ができるようにしなければなりません。

この項目に関するご質問、Q&Aはこちら

【E-03】HTML以外のファイルに対する説明がある

PDFファイルやWord、Excelファイルなど、HTML以外のデータファイルを使用している場合、そのファイルに関して十分な説明がされているかどうかです。

PDFファイルやWord、ExcelファイルなどのHTMLファイル以外を配布、使用する場合、ブラウザ以外のソフトを使用することになります。配布するファイルに関連するソフトをあらかじめ案内し、ユーザーがファイルを使用できる環境にあるかどうか確認してもらうよう配慮する必要ああります。

必要なソフトがあるかどうか、ソフトを持っていない場合の対応はどのようにすれば良いかなどの詳細な情報を提供します。

PDFファイルの閲覧に関しては、Adobe Systems社から Adobe Reader というソフトが無償で配布されております。PDFファイルを使用している場合はPDF閲覧ソフトを持っていないユーザーのために、このソフトのダウンロードページへのリンクを用意しておきます。

Adobe Reader - ダウンロードAdobe Reader - ダウンロード
http://www.adobe.co.jp/products/acrobat/readstep2.html

この項目に関するご質問、Q&Aはこちら

【E-04】img要素のalt属性が適切に設定されている

画像を配置するimg要素のalt属性が設定されているかどうか。加えて、alt属性が代替テキストとしての役割を果たしているかどうかです。

alt属性に設定したテキストは、なんらかの理由で画像が表示されなかった際のフォローになるため、適切に設定するべきです。またHTMLの仕様上も必要であり、SEO対策としても必要となります。

この項目に関するご質問、Q&Aはこちら

【E-05】ブラウザの互換性への配慮がされている

それぞれのページが、幅広いOS、ブラウザ環境で、同じような機能、効果が実現されているかどうかをテストします。

店鋪は、できるだけ多くのユーザーが正常に閲覧できる努力をすべきですが、OS、ブラウザとも選択肢が多様・多岐に渡る現状では、全てを網羅するのは現実的に不可能なので、現時点でのシェア90%を目標にすることとします。


現状のブラウザのシェア率は、約7割の人が Windows の Internet Explorer を利用しており、残りの3割が Netscape や Opera、Mac の IEやNetscape、Safari、Opera、最近登場したFirefoxというブラウザやスクリーンリーダーを利用する人もおります。

ホームページが全てのブラウザで同じように見えるかと言うと、実はそうではありません。WindowsのIEで見た時には問題なくきれいに見られたのに、Netscape や Mac ではレイアウトが崩れて見えるということもよく起こります。

Internet Explorer において、以下の機能がありますが、IE以外のブラウザでは使用することができません。

<hr color="〜">
水平線に色を設定する属性。IEの独自拡張属性。Netscapeでは無視され、通常の水平線が設定される。

<marquee>〜</marquee>
テキストをスクロールさせる。IEの独自拡張機能。Netscape、Safariでは無視される。または正常に表示されない。


これらの機能タグの利用は避ける必要があります。特にmarqueeタグは限られたスペース内により多くの情報を入れられる機能なので、よく利用されますが、IE以外のユーザーには適切に情報が伝わらなくなります。

この項目に関するご質問、Q&Aはこちら

【E-06】Flash、JavaScriptなどは最低限に留め、代替情報を設定している

FlashやJavaScriptなどが使用されている場合、それはHTMLで実現できないものであるかどうか。またユーザーの立場から考えて、本来の目的に対する効果を本当に向上させるものであるかどうかを審査します。

FlashやJavaScriptなどは、閲覧の際の不具合を誘発しがちであるので、必要最低限に留めるべきです。どうしても必要な場合は、次善策として、それらを使用していない代替ページを用意し、FlashやJavaScriptが使用できない(又は使用したくない)ユーザーも同等程度の情報が得られるよう、配慮する必要があります。

この項目に関するご質問、Q&Aはこちら

【E-07】テキストだけで意味が通じる作りである

なんらかの理由で画像やFlash、JavaScriptなどが表示されなかった場合でも、表示された時と同等程度の情報が提供できるような配慮がされているかどうかです。

画像やFlash、JavaScriptなどが表示されなかった場合も、代替テキストの使用などを通じて、意味が通る作りになっていることが必要です。テキストだけでもそのページの目的や意味が通じるよう配慮すべきです。

この項目に関するご質問、Q&Aはこちら

【E-08】入力欄には内容、入力形式が明確に説明されている

注文フォームなどにおいて、入力する項目に関する説明が適切に行われているかどうかです。

この項目に関するご質問、Q&Aはこちら

【E-09】各ページは適切なデータサイズ内に納まっている

HTML自体のサイズだけでなく、ユーザーが実際に体験するのと同じように、画像等も含めた容量の評価です。

ブロードバンド時代でもモバイル機器を使用した場合や回線の混雑、サーバー環境などにより、転送レートが低くなる可能性はあります。1ページにおける画像を含めた70KB程度が適切とされており、この場合、おおよその環境(56kbps以降、AirHなど)で素早く(10秒程度)表示が可能です。

【買いパラ】ネットショップ検索エンジン - ファイルサイズのチェック(試験運用中)

この項目に関するご質問、Q&Aはこちら

ガイドライン項目一覧

A.トップページ
A-01:サイトの目的
A-02:セールスポイント
A-03:重要なリンク
B.デザイン全般
B-01:サイトの統一感
B-02:商品写真
B-03:基本デザイン要素
B-04:画像情報
B-05:画面解像度
B-06:ブラウザサイズ変更
C.ナビゲーション
C-01:情報構造
C-02:トップページへのリンク
C-03:現在見ているページの内容
C-04:ラベリング
C-05:グローバルナビゲーション
C-06:回遊性を高める
C-07:検索機能
C-08:ナビゲーション
C-09:フレームレス
C-10:新規ウインドウ
D.信頼性
D-01:買い物のヘルプページ
D-02:個人情報保護
D-03:特定商取引法に関する表示
D-04:総額表示
D-05:連絡先の明示
D-06:商品の詳細説明
D-07:セキュリティ
D-08:よくあるご質問
D-09:お客さまの声
E.アクセシビリティ
E-01:機種依存文字
E-02:音声・動画
E-03:HTML以外のデータ
E-04:img要素のalt属性
E-05:ブラウザの互換性
E-06:Flash、JavaScript
E-07:テキストによる構成
E-08:入力欄
E-09:ページのデータサイズ
F.配色
F-01:コントラスト
F-02:色の組み合わせ
F-03:色彩
G.テキスト
G-01:フォント指定
G-02:文字の大きさ
G-03:フォントサイズの可変
G-04:適切な区切り
G-05:専門用語などの使用
G-06:日付けの表記
G-07:見出しの設定
G-08:単語途中の空白
G-09:言語コード
G-10:行間の設定
H.ハイパーリンク
H-01:リンクの動作
H-02:アンカーテキスト
H-03:リンクの装飾
H-04:各種ソフトの起動
H-05:リダイレクト
H-06:訪問済みリンク
I.コンテンツ
I-01:サイト紹介ページ
I-02:情報の更新
I-03:情報量
J.HTML
J-01:title要素
J-02:meta要素
J-03:論理マークアップ
J-04:テーブルレイアウト
J-05:DOCTYPE宣言
J-06:CSSによる装飾

ベストECショップ大賞グッドデザインショップ認定