インターネットの発展や新型コロナウイルス感染症の世界的流行によって、自宅にいながら買い物ができるECサイトのニーズが高まりました。企業規模の大小問わず、EC サイトを開設する企業が増えています。

「投資した費用よりも得られる効果が少ない、もしくは得られない」
このようなECサイト構築の失敗例が少なくありません。本記事は弊社が蓄積したノウハウをまとめたものです。すべてのECサイトに、すべての項目が完全に当てはまるというものではありませんが、多くの企業でECサイトの構築・運営にお役に立てれば幸いです。

文章・テキスト(20項目)

Webサイト制作に必要なものと言えば、実際にページに掲載する「写真画像」と「原稿素材」があります。活字離れの加速化が話題になってきたように、ダイレクトでイメージを伝える写真画像の重要性を認識している方は多いでしょう。正確かつ明確な文章は、読み手にとって理解しやすく、サイトの信頼性を高めることができます。見落とされがちな文章をチェックすべき基本20項目を紹介します。

1-1  一文一意(一文に入れる要点はひとつだけに絞る)で文章を書いているかどうか
1-2  結論をタイトルで端的に伝えているかどうか
1-3  商品の表記(言い方)を統一しているかどうか
1-4  半角・全角の使い分け、記号を統一しているかどうか
1-5  日付・日時の表記などを統一しているかどうか
1-6  文末の表現を統一しているかどうか
1-7  誤字・脱字・衍字、機種依存文字・表記揺れがないかどうか
1-8  口語表現がないかどうか(口語表現しない)
1-9  大見出しや小見出しの文字数は適切かどうか
1-10  もっと見たい、読みたい見出しを効果的に使用しているかどうか
1-11  一行あたりの長さは適切かかどうか(冗長表現しない)
1-12  誤った情報がないかどうか
1-13  不明瞭な表現がないかどうか
1-14  差別や不快な表現がないかどうか
1-15  引用データや参考資料などを明記しているかどうか
1-16  著作権法や薬機法などの法律に抵触する表現がないかどうか
1-17  重複している内容がないかどうか
1-18  専門用語・業界用語をわかりやすく説明しているかどうか
1-19  知識がゼロの人が読んでも理解できているかどうか
1-20  想定読み手のリアクションを具体的に提案しているかどうか

ナビゲーション(15項目)

ユーザーの行動を意識した上で、最適なナビゲーションを適切な場所に設置することが必要です。ナビゲーションのチェックリストを紹介します。
「Webサイトナビゲーションってなに?」と思った方は、まずは、「ユーザーを迷わせない!Webサイトナビゲーションの10種類と特徴」をご覧ください。

2-1  グローバルナビゲーションは適切な場所に配置しているかどうか
2-2  グローバルナビゲーションはユーザーの関心に沿ったメニューにしているかどうか
2-3  グローバルナビゲーションのメニューは 7つ以内におさめているかどうか
2-4  パンすぐリスト(ブレッドクラムナビゲーション)を設置しているかどうか
2-5  【SP*】ハンバーガーメニュー「≡」を使う場合は「Menu」を併記しているかどうか
2-6  【SP】ハンバーガーメニューには下層ページがある場合は「+」「∨」を目立つようにしているかどうか
2-7  【SP】ページ数が多い場合は、ハンバーガーメニューを展開したあとでも、「虫眼鏡アイコン」の検索欄を設置しているかどうか
2-8  【SP】ハンバーガーメニューを展開したあとでも、重要な CTA ボタンを設置しているかどうか
2-9  【SP】ハンバーガーメニューを展開した行数を 10行以内におさめているかどうか
2-10  必要に応じて、ローカルナビゲーションを設置しているかどうか
2-11  必要に応じて、関連ナビゲーションを設置しているかどうか
2-12  必要に応じて、ページネーションを設置しているかどうか
2-13  必要に応じて、コンテンツナビゲーションを設置しているかどうか
2-14  必要に応じて、検索ナビゲーション(ダイナミックナビゲーション)を設置しているかどうか
2-15  フッターには適切なナビゲーション、コンテンツを設置しているかどうか

※SPはとスマートフォンを略した表記です。

CTA(12項目)

CTA ボタンとは、「Call To Action(コールトゥーアクション)」の略称で、Webサイトにおいて訪問者を目的のページへ導き、何かしらの行動(例えば、カート追加や商品購入)を促すボタンです。CTA ボタンを適切に配置することでユーザーのアクションを促し、コンバージョン率を高めることができます。

3-1  本文や他の要素よりも目立っているかどうか
3-2  写真・イラストを活用することで注意を集めているかどうか
3-3  メインとなるカラー・大きさ・フォントをサイト内で統一しているかどうか
3-4  パソコン、モバイルともにクリックしやすいCTA ボタンサイズ(縦幅 0.5㎝ 以上が理想)になっているかどうか
3-5  ターゲットや商材のイメージを意識した上で形状を工夫しているかどうか
3-6  必要最小限の情報にとどめているかどうか
3-7  ページ最上部・最下部・フッター・コンテンツ内や直下に CTA を適切に配置しているかどうか
3-8  コンテンツを読んだ自然な文脈の流れで CTA を設置しているかどうか
3-9  CTA に誘導するためのリード文が用意しているかどうか
3-10  オンラインに限らず電話番号など、重要なアクションと情報(受付時間など)を記載しているかどうか
3-11  時間やキャンペーン情報など、クリック率を高める情報を含めているかどうか
3-12  ボタンテキストには「具体的な行動」と「メリット」を書いてあるかどうか

トップページ(17項目)

トップページは「Webサイトの入口」にあたる重要なページです。訪れたユーザーにどのようなサイトか(自己紹介)、誰のためのサイトなのか、サイト内で得られる情報(誘導・案内係)は何かを伝える役割を持っています。トップページを確認すべき基本の17項目は以下です。

4-1  ファーストビューは記憶に残りやすいものにしているかどうか(ありがちなものにしない)
4-2  ファーストビューに商材一覧を設置し、目的の商材がすぐ発見できるようにしているかどうか
4-3  ニュースや更新情報のような多くのユーザーが必要としない内容を上部に設置しているかどうか(設置しないこと)
4-4  ユーザーが分かりやすいページ構造になっているかどうか
4-5  情報の流れは論理的な順番で掲載しているかどうか
4-6  情報の優先順位を明確にしているかどうか
4-7  コンテンツを適切にグルーピングしているかどうか(まとめること)
4-8  ユーザーの行動を基準にしたページやコンテンツを設計しているかどうか
4-9  一画面あたりに表示される情報量は少なすぎたり、多すぎたりしているかどうか
4-10  サイト・ページの目的に合わせたメリハリのあるデザインにしているかどうか
4-11  メインカラー・ベースカラー・アクセントカラーの割合を25:70:5の比率にしているかどうか
4-12  フォントの種類やサイズ、太さ、行間、行幅に考慮して可読性を確保しているかどうか
4-13  テキストリンクは、クリックできる所だと分かるデザインになっているかどうか
4-14  特徴ページがない場合、企業や商品の特徴をトップページに掲載しているかどうか
4-15  【SP】のファーストビューのレイアウトを正方形に近くにしているかどうか
4-16  【SP】の場合は情報を2列までにおさめているかどうか
4-17  【SP】でもバナーなどの画像化している文字は読みやすいかどうか

カテゴリーページ・商品ページ(22項目)

カテゴリページとは、ECサイト(ネットショップ)内の商品を、カテゴリ分類しているページのことです。 カテゴリページ内には、そのカテゴリに当てはまる複数商品が並んでいます。ユーザーが欲しいものを見つけるため、カテゴリの分類基準とカテゴリページデザインが重要です。

商品ページとは、ECサイトにおいて個々の商品の値段や画像、詳細情報などを掲載するページのことです。商品情報が魅力的に、漏れなく分かりやすく紹介する商品ページであれば、商品の購入率を上げることができます。

実店舗で買い物した経験を思い出してみてください。まずは、興味がある商品コーナーに行きます。購入したい商品を手で触って成分表などを確認した上で、買うかどうかを決めますよね。ECサイトでは商品を体験することができないため、画像や動画などを通じて、商品の特徴をを最大限に伝えることが必要です。「カテゴリページ=商品コーナー」「商品ページ=商品」を意識した上で、カテゴリーページ・商品ページをチェックすべき22項目を紹介します。

5-1  各商品ページのレイアウトは一貫したデザインになっているかどうか
5-2  ユーザーが知りたい情報を一見して分かるようにしているかどうか
5-3  アピールポイントが伝わる商品画像になっているかどうか
5-4  良質な写真を使っているかどうか(荒い画像NG、画質が問題ないかどうかを確認する)
5-5  商品画像のサイズが適切かどうか
5-6  画像のサイズ(高さと幅)を揃えているかどうか
5-7  トリミングを行い、統一感のある仕上がりにしているかどうか
5-8  商品を使用している雰囲気を伝えるサブ写真を用意しているかどうか
5-9  実際の様子(理想像)をイメージしながら、画像の並び順が自然に配置しているかどうか
5-10  ユーザー検索したキーワードを参考にした商品タイトルになっているかどうか
5-11  箇条書きで1つ1つの商品の特徴を読みやすく表示しているかどうか
5-12  全ての商品は税込みの価格にしているかどうか
5-13  配送や納品日、賞味期限なと顧客が関心がある内容を記載しているかどうか
5-14  商品説明を読んだ後に疑問点があるかどうか(疑問点を残さない)
5-15  ランキングNo1や受賞などの自慢話があるかどうか
5-16  「関連商品」、または「最近閲覧した商品」を設置しているかどうか
5-17  商品ページの下部には、お問い合わせ(電話やLINE)などのCTAを設置しているかどうか
5-18  商品が20件以上の場合、絞り込み機能を入れているかどうか
5-19  カテゴリページでは、商品名、値段、サイズなどユーザーが知りたい情報があるかどうか
5-20  カテゴリを長過ぎる名称になっているかどうか
5-21  専門性の高い業界の(用語が難しい)場合、文章やイラストなどのコンテンツで補足しているかどうか
5-22  各商品ページ内にトップページへのリンクしているかどうか

注意:Amazonの場合はメイン画像にテキスト表記を入れてはいけませんが、楽天市場の場合20%以下まではテキスト表記画像の使用は可能です。出店先のガイドラインは異なりますので、ぜひ確認しておきましょう。

ショッピングカート・フォーム(17項目)

イー・エージェンシー調査(対象:850サイト 調査期間:2021年4月~2022年9月)によると、EC「カゴ落ち率」は平均して約64.7%のことが分かりました。ECサイトでカートに商品を入れたものの、購入まで至らず離脱してしまう「カゴ落ち」は重要な改善ポイントだと言われています。カートのチェックリストが17項目あります。一緒に見ていきましょう!

6-1  項目の数を必要最小限にしているかどうか
6-2  項目の並び順が適切・自然に配置しているかどうか
6-3  必須項目が明示しているかどうか
6-4  入力例が表示しているかどうか
6-5  入力欄の幅を想定文字数に見合うサイズにしているかどうか
6-6  押しやすく、入力しやすくするため、入力欄やボタンの高さを 48px 以上にしているかどうか
6-7  全角と半角を自動で変換するようにしているかどうか
6-8  住所は郵便番号を入力すると、自動的に入るようにしているかどうか
6-9  エラー文が該当項目付近に表示しているかどうか
6-10  ボタンが目立つ色にしているかどうか
6-11  購入完了までのステップを明示しているかどうか
6-12  必須項目を正確に入力し終えていない場合には送信(購入)ボタンを押せなくしているかどうか
6-13  急いでいたり、困ったりしているユーザー向けにフォーム内に電話番号を表示しているかどうか
6-14  フォーム入力後の「購入完了」メールは、重要な情報をまとめた文面にしているかどうか
6-15  完了画面では、ECサイトをさらに回遊する動線を設けているかどうか
6-16  不要なリンクを置いていない、離脱させないようにしているかどうか
6-17  補足がある場合は(ツールチップではなく)常に表示しているかどうか

セキュリティ対策(14項目)

ECサイトからの個人情報及びクレジットカード情報の流出事件が多数発生しており、被害の大半を中小企業の自社構築サイトが占めています。そのような被害から、顧客に不利益を与えます。企業の社会的な信頼が低下し、顧客に使ってもらえなくなる可能性も高いです。
ぜひ、IPA 独立行政法人 情報処理推進機構が発表した下記の『ECサイト構築・運用セキュリティガイドライン』を参考にしてください。

7-1  「「安全なウェブサイトの作り方」及びセキュリティ実装チェックリスト」に準拠して、ECサイトを構築しているかどうか
7-2  サーバ及び管理端末等で利用しているソフトウェアをセキュリティパッチ等により最新の状態にしているかどうか
7-3  ECサイトの公開前に脆弱性診断を行い、見つかった脆弱性を対策しているかどうか
7-4  管理者画面や管理用ソフトウェアへ接続する端末を制限しているかどうか
7-5  管理者画面や管理用ソフトウェアへ接続する端末のセキュリティ対策を実施しているかどうか
7-6  「クレジットカード・セキュリティガイドライン」を遵守しているかどうか
7-7  利用者情報の登録時及びパスワード入力時における、不正ログイン対策を実施しているかどうか
7-8  サイト利用者の個人情報に対して安全管理措置を講じているかどうか
7-9  ドメイン名の正当性証明とTLSの利用を行っているかどうか
7-10  サイト利用者のログイン時における二要素認証を導入しているかどうか
7-11  サイト利用者のパスワードの初期化及び変更といった重要な処理を行う際、利用者へ通知する機能を導入しているかどうか
7-12  Webサーバログや、取引データ等のバックアップデータを保管しているかどうか
7-13  保管するログやバックアップデータを保護しているかどうか(推奨)
7-14  サーバ及び管理端末において、セキュリティ対策を実施しているかどうか(推奨)

 
上記はECサイト構築時のセキュリティ対策要件となります。運営中のECサイトにおけるセキュリティ対策のチェックリストはすこし違いますので、詳しくはIPA 独立行政法人 情報処理推進機構の「ECサイト構築・運用セキュリティガイドライン」までご覧ください。

注意:ASPのECサイトの場合、ASP会社のシステムや対応に依存するので、「ショッピングカート・フォーム」と「セキュリティ対策」チェック内容に対してできない内容もあります。

コーディング(8項目)

コーディングとは、具体的なコンピュータ言語を使ってWebサイトの仕組みを構築することです。コーディングの質は「サイトの使いやすさ」と「ユーザーの満足度」に影響する大きな要素だと言えます。なお、検索エンジンに理解しやすいコーディングにすることは、検索結果の上位に表示する可能性が高くなります。

8-1  HTML、CSS、JavaScriptの記述ミスがないかどうか
8-2  モバイルフレンドリー・レスポンシブ対応しているかどうか
8-3  各種ブラウザや端末の環境によって表示できない、読みにくいかどうか
8-4  ECサイト(Webサイト)の独自ドメインを取得・設定しているかどうか
8-5  ECサイト全体をHTTPS化(常時SSL化)しているかどうか
8-6  パフォーマンスを高める不要なリソースなどを読み込まないようにしているかどうか
8-7  リンク先を正しく設定しているかどうか
8-8  意図したリンクが別タブで開かれているかどうか

SEO関連(13項目)

検索エンジンではより上位に表示されるほうがユーザーにクリックされやすいので、EC サイトのSEO 対策も必ずチェックしていきましょう。

9-1 <h1>の見出しテキストはページごとでユニークにしているかどうか
9-2 hタグの並び順、要素の誤った使い方、無駄なタグがないかどうか
9-3 <title>31文字以内に収めてページの内容を端的に記述しているかどうか
9-4 <meta description>キーワードを含めて100文字以内に収めているかどうか
9-5 画像のalt属性:画像内容を説明したアンカーテキストを記述しているかどうか
9-6 XMLサイトマップを送信しているかどうか
9-7 内部リンクを整備しているかどうか
9-8 パンくずリストを設定しているかどうか
9-9 robots.txtを利用しているかどうか
9-10  URLの正規化を行っているかどうか
9-11  OGP画像・apple-touch-icon・ファビコンを設定しているかどうか
9-12  低品質ページ・流入に寄与しないページの削除、noindex付与しているかどうか
9-13  PageSpeed Insightsで「サイトの表示速度」をチェックしているかどうか

そのほか(7項目)

ユーザーに対して、個人情報がどのように利用されているかを伝えるという法律上の義務に対応しないといけません。サイトポリシーやサイト公開後の改善につながるチェックすべきポイントは以下です。

10-1  安心して利用していただけるように個人情報の取り扱いについてページを設置しているかどうか
10-2  特定商取引法に関する表示ページを全ページの下部に明記しているかどうか
10-3  適切な場所に新規会員登録やログインページを用意しているかどうか
10-4  必要に応じてSNSシェアボタンを配置しているかどうか
10-5  社名、電話番号、FAX、代表者のお名前は正確になっているかどうか(誤記しない)
10-6  Googleアナリティクスなどの計測用のタグは正しく挿入しているかどうか
10-7  Google Search Consoleを設定しているかどうか

まとめ

ECサイトを成功させるため、小さな一つ一つの積み重ねが大事です。以上のチェックリストは具体的な内容となります。
実際に、ワイヤーフレームやデザインなどを確認する際に、具体的なチェックリストだけではなく、論理と直感をつなげた抽象的な評価基準も不可欠です。大きく分けて「ユーザー視点」と「企業担当者視点」二つあります。

ユーザー視点
・ エンドユーザーが求める情報が直感的に見つけられる?
・ 興味を引くデザインとなっているか?デザインに新鮮さを感じるか?

企業担当者視点
・ 依頼・発注側側(企業)のゴールが実現できるか?
・ 商品・サービスのアピールポイントが分かりやすく表現されているか?

最後に「制作会社としての存在意義:なぜ企業が外部の制作会社に依頼しますか?」を改めて考えていただきたいと思います。依頼・発注側(企業)は自社のサービス・商品について誰にもまけない知識がありますが、WEB・IT知識やデザイン力には限界があることは否定できませんよね。
そのため、外部の制作会社のスキル(強み)を活用することで、自社の魅力や商品を的確に顧客に伝えたいでしょう。しかし、外部の制作会社には「依頼・発注側(企業)の業界や商品知識が少ない」という弱みもあります。それを解消する手段は情報を収集したり、密にコミュニケーションしたりすることです。

制作側(外部制作会社)の担当者がまるで依頼・発注側(企業)の中の人のように、第三者(全然関係ない人)にサービス・商品を説明することができるなら、その制作物(ECサイト)はきっとユーザーに伝わると思います。制作会社に丸投げする場合、高確率で期待していたような成果物があがってきません。

関連記事:EC担当者必見!使いやすい売れるECサイトを構築する8つのコツ

機能が複雑になりセキュリティ性も高まるECサイトの場合は100〜500万円程度の投資が必要です。中小企業にとっては、大きな投資と言えます。弊社は成功を目指して、企業様と一緒に成果が出るECサイトを構築していきたいと思います。集客力のある本格的なECサイトを開設したい企業様は、お気軽にご相談ください!

メルマガ登録