WordPressを使ってWeb制作をする為の手順リスト・【改正版】+α

以前書いたWordPressでWeb制作する際
 の手順リストが少し古い情報込みだったり
 するので改正版を書きます。先日、WPも
 3.2のリリースを迎えましたので、手順リスト
 もアップデートすることにしました。多少考え
 が変わっているので内容も少し変更有ります。

以前のリストの改正版です。加えて他の情報も一緒に載せておく事にしました。

︻2011・07・11︼

WordPressインストール

(一)サーバーを用意︵PHP5.2.4 以上 / MySQL5.0 以上︶
(二)DBを作成
(三)WordPressをダウンロードし、解凍
(四)wp-config-sampleをwp-configにリネームし、内容をDBに合わせて変更
(五)プリフィクス︵接頭語︶を変更する︵wp_→foodblog_︶
(六)FTPソフト等でサーバーにアップロード
(七)サイト名やパスワード、IDを決める︵adminは避ける︶
(八)作成したユーザー名でログイン
(九)ダッシュボードの不要なコンテンツを非表示にする
(十)パーマリンクの設定(%category%、%post_id%、%postname%等)
(11)ブログが閲覧可能かプライバシー設定を確認
(12)記事カテゴリの作成とスラッグ名設定
(13)使用テーマをアップロードし、変更、表示確認
(14)robot.txtの作成※後述
(15)必要なカスタマイズを施工※後述
(16)使用プラグインをアップロード→有効化※入れるプラグインは後述
(17)各プラグイン設定
(18)サイト名とサイト概要を確認、設定
(19)必要に応じてping送信先を追加
(20)デザインに合わせて1ページ内の記事数設定
(21)メディア設定でアップロードした画像の大きさを調整
(22)アップロードするファイルの保存フォルダを追加
(23)出来る環境なら、wp-config.phpをドキュメントルート真上に避難させる※出来なきゃ無視で
(24)ログアウトして表示をチェック
(25)問題なければファイルのバックアップを取る

robot.txt

User-Agent: *
 Disallow: /wp-login.php
 Disallow: /wp-admin/
 Disallow: /wp-includes/
 Disallow: /wp-content/
 Allow: /
 Sitemap: http://example.com/sitemap.xml

これで十分だと思いますけど、よりこだわるなら以下を参照して下さい。

Perishable Press ver.

※これは例です。サイトに合わせて変更してください。

User-agent: *
 Disallow: /mint/
 Disallow: /labs/
 Disallow: /*/wp-*
 Disallow: /*/feed/*
 Disallow: /*/*?s=*
 Disallow: /*/*.js$
 Disallow: /*/*.inc$
 Disallow: /transfer/
 Disallow: /*/cgi-bin/*
 Disallow: /*/blackhole/*
 Disallow: /*/trackback/*
 Disallow: /*/xmlrpc.php
 Allow: /*/20*/wp-*
 Allow: /press/feed/$
 Allow: /press/tag/feed/$
 Allow: /*/wp-content/online/*
 Sitemap: http://perishablepress.com/sitemap.xml
User-agent: ia_archiver
 Disallow: /

via:Better Robots.txt Rules for WordPress

必要なカスタマイズ

よく見かけたカスタマイズは、ノンプログラマー向けカスタマイズプラグイン・WP Total Hacksの登場で、かなり楽が出来ます。出来ることは以下。

(一)favicon.icoを設定
(二)#moreリンクを削除
(三)the_excerpt() の出力結果から、[…] を削除
(四)Google Analytics コードを挿入
(五)ウェブマスターツールの認証用パスを挿入
(六)ページに”抜粋”を追加
(七)管理画面ヘッダーのロゴをオリジナルに変更
(八)管理画面フッターのテキストを自由に設定
(九)ログイン画面のロゴをオリジナルに変更
(十)headに含まれる不要なmetaタグ︵例えばWPのバージョンとか︶を削除
(11)投稿ページ上のメタボックスを個別に選択して削除
(12)ダッシュボードにある様々なウィジェットを個別に選択して削除
(13)リビジョンの保存件数の選択
(14)自動セーブの無効化
(15)セルフピンバックの停止
(16)デフォルトのメールアドレスのカスタマイズ
(17)Admin以外のユーザーに対するアップデート通知の無効化
(18)ユーザーの編集からデフォルトの連絡先情報を削除

[note]詳しくは過去記事をご参照下さい。[/note]

プラグイン

プラグインのまとめです。必要に応じて選ぶ感じで。ただし、WP3.2に対応してるかどうか未確認のものもあります。

◎大抵は必須になる

(一)コメントスパム対策(Akismet※初期導入済。APIキー取得)
(二)マルチバイトパッチ(WP Multibyte Patch※初期導入済)
(三)問い合わせフォーム(Contact Form 7)
(四)パンくず(Prime Strategy Bread Crumb,あるいは自作※後述)
(五)SEO(All in One SEO Pack、HeadSpace2)
(六)xmlサイトマップ(Google XML Sitemaps、Better WP Google XML Sitemaps(via:@wokamoto))
(七)DB管理とバックアップ(WP-DBManager)
(八)タグ管理(Simple Tags)
(九)カスタマイズ(WP Total Hacks)※前述
(十)投稿入力補助(AddQuicktag)

◯あれば尚良し

(一)固定ページのリストをツリー化(CMS Tree Page View)
(二)関連記事表示(YARPP)
(三)ページネーション(WP-pagenavi、WP-AutoPagerize)
(四)リビジョン削除(Delete Revision)
(五)SBM投稿ボタン(WP Social Bookmarking Light)
(六)ログインURL︵/wp-login.php→/yourlogin︶を変える(Stealth Login)
(七)高速化(WP Super Cache、W3 Total Cache)
(八)画像を一括挿入︵Faster Image Insert︶

△ご要望があったときに

(一)スマフォ用のテーマに切り替え(Mobile Theme Switcher、WPtouch、WPtap)
(二)画像アップロード時のサイズを増やす(Additional image sizes)
(三)サイドメニューのテキスト変更(Admin Menu Editor)
(四)固定ページにも.htmlを付ける(.html on PAGES)
(五)画像ギャラリー(NextGEN Gallery)
(六)ダッシュボードにメモ帳(WP Dash Note、Quick Notes)
(七)ショッピングカート(Welcart)
(八)絵文字(emoji)
(九)ガラケー対応(Ktai Style)
(十)多言語化(WPML)

覚えておくと便利なこと

(一)カスタム投稿タイプの導入 / 手順リストを記事にしました
(二)データベース接続エラー時に表示するメッセージを変える / ドロップインを使う
(三)プラグイン不要の簡単な人用サイトマップ / 記事を書きました
(四)IE6に対応しなければならないとき / テーマを切り替える
(五)SEO施工 / カスタマイズ法を記事にまとめました
(六).htaccessで高速化 / こちらが超参考になります
(七)URLを相対パスにする / dogmap.jpに書いてあります
(八)レスポンシブなWebサイトにする / Media Query導入テーマいろいろ

役立つ記事とか

(一)WordPressを使ったWebサイトでfunctions.phpによく書いてるやつ
(二)WordPressをカスタマイズするなら絶対覚えておきたいテンプレートファイルの使い方
(三)WordPress でスニペットを簡単に管理する方法 
(四)WordPress の自動メディアリンクにメディア形式を追加する
(五)WordPressをカスタマイズするなら覚えておきたいアクションフックとフィルターフック
(六)オリジナルテーマの作り方
(七)WordPress と OAuth 認証を使って会員向け Web サービスを作る
(八)Debug BarとDebug-Bar-ExtenderでWordPressのパフォーマンスチェック / これいいすね
(九)使える.htaccessテクニック10個

SEOを考慮する

まぁここはスルーでも全然いいと思います。今までの情報と多少かぶる点がありますけどご了承下さい。基本的には﹁上位表示﹂が目的ではなく、﹁検索エンジンとユーザーへの補助﹂が目的です。

(一)GoogleのSEOスターターガイドを見る
 これを見ないとSEOは語れません。所詮検索エンジンの土俵の上で行うものなので基本的には大人しく指示に従います

(二)パーマリンクを設定
 /%category%/%postname%/や/%category%/%postname%.htmlがいいと言われていますがそうとも言いきれません。postnameを使う場合はローマ字で分かりやすく。日本語のままだと、トラックバック等でエラーが出る場合もあるので何かと不利です

(三)カテゴリ、タグのスラッグもローマ字で分かりやすくする
 短く、分かりやすいように。パーマリンクに%postname%を併用するなら単語のみがいいかもしれません

(四)ping送信先を増やす　
 効果あるか分からないけど1回設定すれば終わりなのでやっておいて損はないです

(五)タイトルハック
条件分岐でtitleをハックする、を参考にしてください。

(六)meta descriptionをコンテンツに合わせる
 meta descriptionはキーワード次第でSERPsのスニペットに適応されます。スニペットはユーザーがそのURLの概要を知ることが出来るので、上手くサイトに誘導するのに適しています。キャッチーな文章を考えてください

(七)各ソーシャルサイトに対応　
 個人的にはAddThisが今のところ楽かなと思っています。プラグインならWP Social Bookmarking LightやWP-OGP︵バグ有るかも︶、Open Graph Pro等を導入

(八)SEOに適したカスタマイズを施す
 条件分岐等を使い、コンテンツに合わせて工夫します。以前まとめましたので必要に応じてピックアップしてください。

(九)sitemap.xmlをGoogleWebマスターツールに登録
 サイトの認証自体はWP Total Hacksで可能です

(十)Googleアナリティクスに対応させる
 WP Total HacksかHeadSpace2でコード挿入可能です

(11)ページ内リンクと被リンク分散を防ぐ為の施工
 コンテンツに誘導する為のページ内リンクがあると、SERPsのスニペットにジャンプ用URLが表示されて目立ちます。しかし、ページ内でそのまま使うと被リンクが分散しやすいので、JavaScriptを使用したページスクロール等(こういうの)でURLに#***がつかないようにすると良さそうです

(12)パンくずを作る
 SERPsのスニペットにパンくずも表示されますが、ページ内リンクと違ってグリーンカラーで目立ちません。誘導は期待出来ませんが、あると親切なので導入を検討してください。

(13)出来る範囲で高速化する
 キャッシュ系プラグイン、jsやcssの圧縮(WP Minify)、外部サービスの乱用を抑える、負荷分散等

(14)rel=”author”とrel=”me”を設定する
 やって損は無い系。SERPsに自分のコンテンツである証拠としてプロフィール画像を出します。︵7/11現在はcomのみ。︶僕はまだやっていませんが、Yoastで方法が書いてあるので参考に

全てを完璧に施工するのではなくバランスを重視したほうが合理的です。

基本的にSEOは人に対する施工が大きく関わるので、ユーザーのための設計をすればそれが自然にSEOとなります。とはいえ、SEOは人それぞれ意見が違いすぎるので、上記はあくまで持論ですし議論する心算もないです。

これは、WordPressのSEO施工の1例に過ぎません。例えばマルチサイト、Webサービス化の場合、施工するSEOには方法の違いが出ますので参考程度で。

あと、余談ですけどjsによるユーザビリティを考慮したUIはSEOと何かと相性が良い気がしますので学んで損は無いと思います。

困ったら

何か困ったら見るサイト

(一)WordPress フォーラム / 英語版も探せば大抵解決します
(二)Codexのインデックス / 一覧ページです。あなたの知らない情報がわんさか
(三)関数リファレンス / とりあえずまずここ見ると探しやすい
(四)PHPXref 0.7: WordPress / 階層はここで検索
(五)WordPress Trac / 公式のtrack︵軌道︶サイトです。過去のバージョンのコード、構造も見れます。
(六)WordPress Snippets / 簡単なスニペットが置いてあるサイト

多分来年あたり、また改正版書くと思います。怪しい情報が含まれていましたらツッコミお願いします。