WordPressのテーマ開発におけるテストツールまとめ【2020年度/随時更新】

WordPressのテーマ開発のテストツールを紹介します。

テストツールは、「自動でWordPressのテーマのテストをしてくれるツール」のことです。

例えばこんなことをしてくれます。

  • HTMLやCSSの整合性は取れているか
  • パンくずリストや記事の構造化マークアップはエラーなく実装できているか
  • 正しくOGP設定がされているか
  • AMPは正しく実装できているか
  • サイトパフォーマンスやSEOの対策は効果的にできているか

テストツールで検証したテスト結果を公開することで、品質が最低限担保していることをユーザに伝えることができます。

ほかにもおすすめのツールがあれば、コメントなどで教えてください!

標準機能:デバッグモードについて

WordPressをインストールしたら、直下にあるwp-config.phpを開き、WP_DEBUGをtrueにすると、WordPressにエラーが発生したときに画面にエラーログが表示されるようになります。

define(‘WP_DEBUG’, true);

テストプラグインについて

テスト中のテーマにTheme Checkを導入してください。

導入後、プラグインの説明に従い、wp-config.phpに下記のコードを追加してください。

define( ‘TC_POST’, ‘Feel free to make use of the contact details below if you have any questions,
comments, or feedback:[[br]]
[[br]]
* Leave a comment on this ticket[[br]]
* Send an email to the Theme Review email list[[br]]
* Use the #wordpress-themes IRC channel on Freenode.’ );

次に、外観>Theme checkを開いて、「テスト実行!」をクリックしてください。

このように、エラーを検出してくれます。

下の方にスクロールすると、何が足りていないか、説明されています。

エラーがなくなるまで、修正しましょう。

フロントエンド側のテストについて

HTML、CSS、JavaScriptのテストについてです。

構造化マークアップの動作確認について

構造化マークアップのテストは下記を使用しましょう。

2つありますが、好きな方で大丈夫だと思います。

OGPの動作確認について

OGPのテストは以下を使用しましょう。

AMPについて

AMPのテストは、AMPテストを使用しましょう。

URLを入力するとテストできます。

【Lighthouse】SEOやパフォーマンスについて

ChromeでF12ボタンを押下し、デバッグモードを開いて下さい。

Lighthouseをクリックした後、Generate reportをクリックしてください。

SEOやパフォーマンスなどの検証結果が100点満点で表示されます。スクロールすると、なぜこの点数になったのか?、改善点は何か?などアドバイスが表示されるので、修正していきましょう。

モバイルフレンドリーテストについて

スマートフォンでページを開いて、使いやすいページになっているかをテストします。

2021年にモバイルファーストインデックスという、スマホサイトを優先してインデックスを行うアルゴリズム?をすべてのWebページに適用すると発表しています。

したがって、2021年3月時点までにすべてのページでモバイルフレンドリーテストに合格している必要があります。

まとめ

テストツールで以下のことが担保できます

  • 構文エラーがないこと
  • 構造化マークアップにエラーがないこと
  • OGPの設定が正しいこと
  • AMPの設定が正しいこと
  • 速度チェック
  • SEOチェック

WordPressのテーマ開発している人や、受託開発をしている人は、テストツールで最低限の品質を担保しましょう。

コメントを残す

メールアドレスが公開されることはありません。