Webサイトのリリース前に
チェックしておきたい10のポイント

パソコン画像

Webサイト完成度高めるために

Webサイトのデザインやコーディングも完了し、いざリリースという前にいくつかチェックしておきたい項目があります。
ここではWebサイト(PCサイト)を正式にリリースする前にチェックしておきたい重要な項目を簡単な説明とともに紹介しています。
忘れがちな項目を見直して修正することは、ユーザーエクスペリエンスの向上につながり
いらないコストの削減にもつながります。
Webサイトをリリースする前にぜひ10のポイントをチェックしてみてください。

1.タイトルとメタデータ

タイトルやメタデータはSEO上最も重要なポイントの1つであり、ユーザーがページの内容を知るのにも重要な項目です。
タイトルはページごとに適切なキーワードを含め、わかりやすい言葉で表現することでアクセス数の向上にもつながります。

<title>Webサイトのリリース前にチェックしておきたい10のポイント</title>

メタデータもSEOでは重要です。ページごとに説明文をかえることで、Google検索結果に表示される説明が変わり、ユーザーにどういった内容のページであるかをより伝えることができるので、サイトへのアクセスにつなげることができます。

<meta name="classification" content="World, Japanese, コンピュータ, インターネット, ウェブデザイン・開発" />
<meta name="Description" content="Webサイト制作者必見!Webサイトの完成度を高めるために、リリース前にチェックしておきたい10のポイントをご紹介" />
<meta name="Keywords" content="Webサイトのリリース, ブラウザチェック, リリース前チェック, 脆弱性診断, バリデーション, エラーページ" />

チェックポイント

  • ・タイトルは他ページと重複していないか
  • ・タイトルは全角35文字以内で簡潔に
  • ・メタディスクリプションは全角120文字以内で簡潔に
  • ・メタキーワードは10個以内

ページトップ

2.クロスブラウザチェック

デザインやピクセル調整も細かく設定し、いざ他のブラウザで見ると文字が切れていたり、レイアウトが崩れていたりと正しく表示されていないことがあります。主要な複数のブラウザに対応しているか、正しく表示されるかを確認することはとても重要です。
リリース前にブラウザチェックは欠かせませんが、ローカル環境に各種ブラウザの各種バージョンを揃えてインストールすることは困難です。そんな中各種ブラウザ、各種バージョンでチェックできる無料のブラウザチェックツールがあります。これを使用することにより、容易にクロスブラウザのチェックができるようになります。各ツールによって対応ブラウザや表示の仕方などが違うので、用途や好みに合わせて使い分けてください。

ブラウザ各種

チェックポイント

  • ・主要ブラウザで正しく表示されるか(文字切れ、文字化け、画像のずれ、レイアウト崩れなど)

ツールリンク

(WindowsやMacなどで動作する60以上のブラウザに対応/WebからPNGファイルをダウンロード)

(IE、Safari、Chrome、Firefoxに対応/Webからツールをダウンロード)

(IE5.5~10〜対応/Webからツールをダウンロード)

(IE、Opera、Safari、Chrome、Firefoxに対応/Web上でチェック)

ページトップ

3.リンク切れをチェック

リンク切れやリンク間違いを全てチェックしていても、1つや2つリンク切れやリンク間違いを起こすことがあります。
リンク切れが起きていると、ユーザーの利便性が低下するだけでなく、ユーザーの印象そのものが悪くなり、離脱率の上昇にもつながります。ですので、必ず全てのリンクをチェックしていきましょう。
またリンク切れをチェックする無料ツールがあるので、必要に応じて使用してみてください。ただし、リンク間違いについてはチェックできないのでご注意ください。

チェックポイント

  • ・ページリンクや画像のリンク先が間違っていないか(想定のリンク先が存在するか)
  • ・リンクのURLに“http://"を付け忘れていないか
  • ・SSLページでは、リンク先を“http://"ではなく“https://"に設定しているか
  • ・ユーザーにとってリンクであることがすぐ分かるか
  • ・リンクではないものに下線をつけていないか

ツールリンク

(W3C公式のリンク切れチェッカーツール)

ページトップ

4.JavaScriptとFlash

ユーザーはセキュリティ対策としてJavaScriptをオフにしていたり、Flash Playerがインストールされていなかったりする環境でアクセスすることもあります。ユーザビリティを考えたとき、JavaScriptがオフの状態でも動作するようにしたり、Flashが見ることのできない環境に考慮したサイトを構築したりすることで、離脱率の上昇を抑え、ユーザーフレンドリーなサイトになります。
また、フォームもAjaxもJavaScriptが使えない時のためにサーバーサイドでも対応できるようにしておくことをおすすめします。

チェックポイント

  • ・JavaScriptがオフになっている環境への対策ができているか
  •  例①:<noscript>タグでユーザーにJavaScriptが有効でないと利用できないと表示させる
  •  例②:JavaScriptが無効の場合、プルダウンメニューをCSSで動作させる
  • ・Flashが見ることができない環境への対策ができているか
  •  例①:最新のFlash Playerをダウンロードできるサイトへのリンクをはる
  •  例②:Flashを表示できないブラウザには代替画像を用意する

ページトップ

5.サイトマップの作成

各ページがGoogleやYahoo!などの検索エンジンにインデックスされるには、各ページを検索エンジンのクローラーにクロールしてもらわなければなりません。サイトマップを作成することで、検索エンジンのクローラーがページを効率よくクロールできるようになります。
またリンク先のページをクローラーが認識できないAjaxなどを用いたリンクや、どこからもリンクのはられていない単独ページについても、サイトマップを作成することで検索エンジンのクローラーにクロールを行なってもらうことができます。
サイトマップを作成するための便利な無料ツールがあるので、必要に応じて使用してみてください。

チェックポイント

  • ・ルートディレクトリに sitemap.xml を置いているか
  • ・Google Webmaster Toolsにサイトマップを登録

ツールリンク

ページトップ

6.バリデーション

バリデーションとは制作したサイトのhtmlやcssについて、W3Cが求める正しい記述や構築ができているかを検証する作業です。バリデーションを行うことは、きれいな構文を記述できるだけでなく、検索エンジンのクローラーが円滑にクロールすることができるようになり、SEOにとても有効です。
無料のチェックツールを使用して、より正確できれいな記述を心がけましょう。

チェックポイント

  • ・&を&ampで記述できているか
  • ・タグはきちんと閉じているか
  • ・id属性が重複していないか

ツールリンク

(W3C公式のhtmlやxhtmlの構文チェックツール)
(W3C公式のcssの構文チェックツール)

ページトップ

7.エラーページ(404エラー)も重要

エラーページ(404エラー)はユーザーがサイト上で存在しないページにアクセスしようとした時に表示されるページのことです。
通常、ユーザーはエラーページが表示されると、他のページへのリンクやリダイレクトなどの策を講じていない場合は、ほぼ他サイトへ離脱していきます。ですので、離脱率を下げるために、トップページへのリダイレクトや各コンテンツへのリンクをはることで、独自のエラーページを作成していきましょう。

エラーページ

チェックポイント

  • ・他ページへのリンクがあるか
  • ・リダイレクトで他ページへ戻ることができる仕組みになっているか

ページトップ

8.最適化

Webサイトがよいパフォーマンスを出すためには、最適化作業は欠かせません。URLや画像、そして階層を含めた構造などがユーザーにとって、また検索エンジンにとっても最適化されたサイトになっているかを見直すことで、表示速度やアクセシビリティ、ユーザビリティの向上、SEO対策につながります。最適化作業はリリース後もやっていく作業ですが、リリース前にも必ずチェックしてください。
各種特徴のある無料ツールがあるので、適宜利用してみてください。

チェックポイント

  • ・HTTPリクエストを減らす
  • ・画像イメージを最適化
  • ・cssとJavaScriptは外部から読み込む
  • ・階層は浅く
  • ・印刷用cssの作成

ツールリンク

(Google DevelopersのWebサイト解析ツール)
(Webサイトの表示速度計測ツール)
(Webサイトのパフォーマンス解析ツール)

ページトップ

9.本番サーバーで最終確認

テストサーバーでのサイトのチェックが一通り終わったら、本番サーバーへアップロードしていよいよリリースです。ただし、テストサーバーで確実に動いていたものが、本番サーバーで動かないこともあります。本番サーバーへ移動後、レイアウトの崩れがないか、リンクが正しいか、画像が正しく表示されているかなど細かくチェックしましょう。

チェックポイント

  • ・正しい表示になっているか
  • ・リンク先が正しいか(ディレクトリの指定ミス、リンク先がテストサーバーになっている など)
  • ・プログラムが正しく動くか

ページトップ

10.脆弱性診断(セキュリティテスト)

攻撃者が脆弱性につけ込み、ホームページの改ざんやなりすまし、マルウェアの埋め込み、また最悪の場合は情報漏洩などのセキュリティ事件・事故が増えてきています。元々、大手企業や官公庁のWebサイトを狙うケースが多かったのですが、最近では中小企業のWebサイトやショッピングサイト、キャンペーンサイトなどを狙うケースも報告されています。
年々増加するセキュリティリスクの対策のためにも、脆弱性診断を実施されることをおすすめします。

ページトップ

VALTES

ソフトウェアテスト・品質のトータルソリューション

VALTES

バルテス株式会社は、品質向上のトータルサポート企業として、ソフトウェアテストをはじめ、Webサイトテスト、スマフォアプリテスト、ソーシャルゲームテスト、脆弱性診断など、ソフトウェアの品質に関するサービスを数多く提供しております。
バルテスのWebサイトテストは、約300サイトのテスト実績を基に、大規模システムから小規模サイトまで幅広く対応します。

〈テスト実績〉

  • ・ショッピングサイト
  • ・Web広告システム
  • ・オークションサイト
  • ・宿泊予約サイト
  • ・アンケートシステム
  • ・会員登録システム
  • ・ゴルフ予約システム
  • ・ポータルサイト
  • ・クーポンサイト  など

脆弱性診断Webサイトテスト