Webサイトを公開前に必ずチェックすべき19項目

WEBサイトを公開前に必ずチェックすべき17項目 Web関連

WEBサイト・ホームページ・ブログを制作したら、公開前に必ず確認するチェック項目です。WEBに関わる人なら当たり前の作業や意外と結構見逃しがちな作業までをご紹介します。

SEO対策にも大きく関わってくる項目があるので、自信のWEBサイト・ホームページ・ブログと照らし合わせながら確認してみてはいかがでしょうか。

クラスブラウザチェック

確認対象はIE、Chrome、Firefox、Safariが無難でしょう。日本で認知の低いOperaは無視しても問題ないかと思います。

また、WEB制作者ならだれもが頭を悩ますIE対策。まだまだIE8以前の利用率が多いのも現状です。制作前にIEのサポートバージョンを明確にすることも、こういった確認作業の削減には有効的です。

ちなみに私が個人制作する場合は、IEのサポートバージョンをIE9以降と決めています。理由はCSS3を気にすることなく使用できるからです。ですが念の為CSSハックなどの対策は行います。

レスポンシブウェブデザインなどスマートフォンに対応する場合はシミュレーターではなく必ず実機で確認するようにしましょう

IEバージョンチェック

クロスブラウザチェックでIEのバージョンチェックはIETesterを使って確認します。IETesterはIE5.5~最新バージョンまでを仮想環境で確認できるフリーソフトです。ちなみにWindowsのみ対応。

My DebugBar | IETester / Browser Compatibility Check for Internet Explorer Versions from 5.5 to 11
ietester is an application that allows to test on multiple ie versions at the same time in the same application

Googleアナリティクス(アクセス解析)設定

アクセス解析ツールは一番メジャーなGoogleアナリティクスを使います。管理画面からWEBサイトの登録をしてトラッキングコードを発行します。発行されたコードを全ページの<head>内に埋め込みます。

title・description・keywordsの見直し

タイトル(title)、ディスクリプション(description)、キーワード(keywords)のメタ情報の確認と再調整を行います。

制作完了後に全体のコンテンツを客観的に見直して、ユーザー視点で考えることがポイント。制作中では気づかなかった点が見えてきたりします。

画像にalt・width・height・title

制作者側がよく忘れてしまいがちの<img>タグに対する宣言です。とくにIEの場合は「width=””」や「height=””」となっていると縦横0pxと判断されて画像自体が表示されないので要注意

altは画像に関するSEO評価にも関わってくるので必ず設定する事。titleもその画像が何の画像なのかを検索エンジンに認識させる大切な宣言なので忘れずに設定する。

リンクにtitle

画像のtitle同様にそのリンクがどこへ飛ぶのかを明記する為の宣言です。あまり長すぎてもよくないので簡潔な文章を設定します。

お問い合わせフォームなどにnoindex・follow

meta robots の noindex または follow は検索エンジンにクローリングされたくない、検索結果一覧に表示されたくないページに設定します。

お問い合わせフォームのようなユーザーにとって有意義なページだが、検索エンジンにとっては内容が薄くあまり高評価が期待できないページなどは設置するといいでしょう。

なお、noindex follow を設定したからと言って検索エンジンが完全に無視するという訳ではなく、あくまでSEO評価の対象にせず検索一覧に表示させないだけで、検索エンジンロボットはページを認識します。

お問い合わせフォームなどに<label>タグを設定

フォームのラジオボタンやチェックボタンなどはスマートフォンだと押し辛いですよね。文字自体もクリック・タップに反応させる為に<label>タグが再注目されています。

スマートフォンだけでなくPCでのUXも向上しますので、設定することをおすすすめします。

ドメインの「www」の有り無し統一

検索エンジンに対してドメインを正規化します。アクセス解析にも関わってくるので「www」の有り無しどちらが正規のドメインなのかを決めてhtaccessで301リダイレクト設定をしましょう。

URL「www」有り無しと「index.html」のリダイレクトをhtaccessで設定する
WEBサイトが完成していざ公開!って時に気付く、ドメインの「www」の有り無し。あとは「index.html」のリダイレクト。大抵のWEB制作担当者は、「別にどっちでもいいでしょ」「どっちでも見れるから特別何かするって訳でもない」って感じで

TOPページの「index.html」の有り無し統一

「www」の有り無し同様にTOPページのURLを「/」のみと「/index.html」をどちらかにhtaccessの301リダイレクトで統一します。ちなみにWordPress(ワードプレス)で構築されたサイトは設定不要です。

index.html「あり・なし」のURL正規化 - 301リダイレクト応用編 | 海外SEO情報ブログ
“www.example.com/“と”www.example.com/index.html“、人間のユーザーにとっては同じページでも、サーチエンジンにとっては、まったく別0

XMLサイトマップ

検索エンジンにサイトのクロールを促すために必要です。ウェブマスターツールでサイトを登録する際にも必要なので必ずサーバーにアップロードします。

また、ページを新規追加したらXMLサイトマップも更新しましょう。XMLサイトマップは「XML-Sitemaps.com」から簡単に発行する事が出来ます。

Create your Google Sitemap Online - XML Sitemaps Generator
Free Online Google Sitemap Generator. XML-sitemaps.com provides free online sitemap generator service, creating an XML sitemap that can be submitted to Google, …

Googleウェブマスターツール登録

Googleの検索エンジンにWEBサイトを登録します。今やYahoo検索もほとんどGoogleの検索エンジンを使用しています。検索結果にいち早く表示されるように必ずウェブマスターツールには登録しましょう。

この際にXMLサイトマップの確認もされます。またウェブマスターツールのFetch as Googleを使う事でクローラーの巡回を促すことが出来ます。

ブログを毎日更新でアクセスが増加するって本当?その理由のひとつ
「アクセスを増やすなら、毎日ブログを更新する!」そんな言葉は、ブロガーにとって当たり前であって、皆がそれを目標に努力している事でしょう。でも、毎日更新は結構大変です。私も週に2~3記事が限界になってきました。ところで、なぜ「毎日更新」が進め

ファビコン

ファビコンとはブラウザタブでタイトルと一緒に表示されるとても小さいアイコンのことです。

ファビコンはSEO評価にも関係ないので正直なくてもいいのですが、サイトのクオリティを上げるなら是非設置しましょう。逆にクオリティの低いサイトはファビコンが設定されていないという判断もされたりします。

ファビコン画像のサイズは縦16px横16pxで形式はGIFがおすすめです。FirefoxならファビコンにGIFアニメーションを設定することが出来ます。

<head>内に下記を記述してファビコンを読み込みます。

スマートフォン用アイコン

レスポンシブウェブデザインなどのスマートフォンにも対応しているWEBサイトなら、ホーム画面にブックマークした際のアイコンも設定するといいでしょう。

こちらもファビコン同様にあればいい程度のレベルですが、あるとないとでは結構な見栄えの差が出ます。サイズはiPad:Retinaを考慮して縦150px横150pxのPNGで作成しておけば大体のデバイスで綺麗に表示されます。

<head>内に下記を記述してファビコンを読み込みます。

iOS, Mac, win, Androidのアプリアイコンサイズまとめ | Goodpatch Blog
iOS, Mac, win, Androidのアプリを作る時に必要なアイコンサイズをまとめました。調べた限り複数のOSの情報がまとまっている記事がなかったので記事にしました!
少しのコードで実装可能な15のスマートフォンサイト用小技集
スマートフォンが普及してきて、Webサイトを作る時、スマートフォンサイトも一緒に制作している方も多くなってきていると思います。私もスマホサイトを制作する機会が増え、だんだんEvernoteに保存していたスマートフォンサイ

リンク切れチェック

Website Explorerやサイトツールでリンク切れの確認をします。SEO評価でリンク切れは大きなマイナス要素になります。新規構築以外にも定期的にチェックするなど気にかけるようにしましょう。

Website Explorer 公式サイト
ウェブサイトの構造を探査・解析し、情報を階層表示するソフトウェア(Windows 用)

404ページ

ドメイン配下で無効なディレクトリやリンク切れなどがあった場合に備えて設定しておくといいのが404ページ、通称「404 Not Found」です。こちらはhtaccessで設定できます。WordPressの場合は「404.php」ファイルを作成するなどで設定できます。

パンダアップデート対策のために質の高いカスタム404ページを作成しよう | 海外SEO情報ブログ
流出したGoogleの品質評価ガイドラインではエラーページの品質も評価項目になっている。ひょっとしたらパンダアップデートは404エラーページの内容もコンテンツの質が高いか低いかを判断する材料にしているかもしれない。

OGP(SNS用サイト情報)

FacebookやGoogle+やmixiなどのSNSにおいて、そのページを共有する際に表示させる文言を設定する為の共通仕様です。SNSでの拡散も大切なマーケティングなので、こちらも設定しておきましょう。

マークアップ最適化

HTMLの構文チェックツールを使って、正しいHTMLソースかどうかを確認することが出来ます。サイトエラーを未然に防ぐだけではなく、マークアップを最適化することでクローラーも巡回しやすいソースコードなりSEO評価の向上も見込めます。

Another HTML Lint - Gateway

Yahoo!ロコ・Googleプレイス登録

制作サイトが店舗の場合は、Yahoo!ロコとGoogleプレイスに登録しましょう。Yahoo・Googleそれぞれが提供している地図などのサービスと関連付けることが出来ます。YahooやGoogleどちらも無料で登録出来ます。

スポンサーリンク
スポンサーリンク
Web関連
こんな記事も読まれています
10-PLATE

コメント