WordPressとDIVIによるCMSウェブ開発、プラグインプログラミング

WordPressの紹介

WordPressとDIVIを使ったウェブ開発は、企業や個人が部分的に自分で行うことができます。独自のプラグインプログラミング、SEO、GEO、AIの実装は当社が担当できます。コンテンツ管理システム(CMS)は、ウェブサイトの作成と管理を大幅に容易にします。最もよく知られているCMSは、WordPressJoomlaDrupalContao、そしてTYPO3ですが、WordPressは現在、世界中の全ウェブサイトの約43%を動かしており、圧倒的に最も利用されているシステムです。

私自身はJoomlaから始め、その後Contaoを使用し、正当な理由でWordPressに移行しました。私の顧客のプロフェッショナルな分野では、今でもTYPO3サイトをよく見かけますが、これらはTypoScriptのために多くの習熟が必要であり、すべてのユーザー、特にウェブ開発者にとって迅速な導入を提供するものではありません。そのため、拡張機能やメンテナンスを担当する人を見つけるのもより困難です。

システムが安定して稼働し、すべての技術的要件(最新のPHPバージョン、セキュリティアップデート、GDPR、パフォーマンス)を満たしている限り、完全な再開発の必要はありません。一般的に、ウェブサイトは根本的に再設計されるまでに通常4〜6年稼働します。

WordPressとDIVIによるCMSウェブ開発

WordPressとDIVIによるCMSウェブ開発、プラグインプログラミング

WordPressの紹介

コンテンツ管理システム(CMS)は、ウェブサイトの作成と管理を大幅に容易にします。プログラミングの知識がなくても、企業や個人はコンテンツを維持し、デザインを調整し、ウェブサイトをインタラクティブにすることができます。最もよく知られているCMSは、WordPressJoomlaDrupalContao、そしてTYPO3ですが、WordPressは現在、世界中の全ウェブサイトの約43%を動かしており、圧倒的に最も利用されているシステムです。

私自身はJoomlaから始め、その後Contaoを使用し、正当な理由でWordPressに移行しました。私の顧客のプロフェッショナルな分野では、今でもTYPO3サイトをよく見かけますが、これらはTypoScriptのために多くの習熟が必要であり、すべてのユーザー、特にウェブ開発者にとって迅速な導入を提供するものではありません。そのため、拡張機能やメンテナンスを担当する人を見つけるのもより困難です。

システムが安定して稼働し、すべての技術的要件(最新のPHPバージョン、セキュリティアップデート、GDPR、パフォーマンス)を満たしている限り、完全な再開発の必要はありません。一般的に、ウェブサイトは根本的に再設計されるまでに通常4〜6年稼働します。

all-inkl.comなどでのホスティング

WordPressは基本的に多くのものを必要としません。PHPとMySQL/MariaDBがあれば十分であり、WordPressサイトは実質的にすべてのプロバイダーで動作可能です。しかし、最近ではもう少し多くのことが期待されています。例えば:

  • 開発/ステージングドメイン
  • 便利なメール管理
  • HTTPS用のLetsEncrypt証明書(自動更新含む)
  • FTP/SFTPアクセスまたはウェブファイルマネージャー
  • 自動バックアップと簡単な復元
  • 迅速で無料のサポート
  • 十分なメモリと最新のPHPバージョン(例:8.1/8.2+)
  • 独自のDNS設定を行う機能
  • 迅速な移行とボタン一つでの認証コード提供
  • WordPressなどの簡単なインストールアシスタント

長年推奨されているプロバイダーは、非常に公正なパッケージ価格と優れたサポートで定評のあるall-inkl.com(アフィリエイトリンク)です。CMSシステムのみをホストしたい方には最適です。

MongoDB、Node.js、またはExpressが追加で必要な場合は、独自のサーバー/VPSをレンタルするか、これらの機能を提供するプロバイダーを利用する必要があります。しかし、従来のウェブサイトの99%はまだこれらを必要としません。ただし、AIを活用したツールにより、ウェブアプリ、API、自動化などの個別アプリケーションがますます増えています。nuonu.comも、WordPressに独自のプラグインを追加して非常に個別的な機能を提供する、そのようなアプリケーションの一つです。

なぜWordPressとDIVIなのか?

WordPressは、ユーザーフレンドリーなインターフェース、膨大な数の拡張機能(プラグイン)とテーマ、そして非常に強力なコミュニティを提供します。ブログ、企業サイト、ランディングページ、オンラインショップなど、WordPressを使えばほぼすべての種類のウェブサイトを実装できます。インストールと基本設定は迅速に完了し、DIVIのようなページビルダーのおかげで、初心者でもプロフェッショナルなレイアウトを作成できます。

ページビルダーとしてのDIVIの利点

DIVIは、完全なテーマ+ビルダーとして使用でき、追加のテーマが不要であるという点で、他の多くのページビルダーとは一線を画しています。これは次のことを意味します。

  • ワンストップの完全なデザイン – 追加のテーマ依存性なし。
  • ビジュアルなドラッグ&ドロップエディターによる柔軟なデザインオプション
  • ページ上で直接行えるクライアントサイド編集機能(フロントエンド編集)。
  • デスクトップ、タブレット、モバイルデバイス向けの優れたレスポンシブ対応
  • 新しいページの作成を大幅に加速する既成のレイアウト&モジュール

新機能:DIVI 5 – パフォーマンスと将来性

DIVI 5は単なる通常のアップデートではありません。ビルダーは内部的に完全に再構築され、モダンで大幅にスリムな基盤の上に構築されました。これにより、体感できるほど高速な読み込み時間、コードの肥大化の軽減、そして将来の機能のためのより良い基盤が提供されます。

  • 新しい、スリムなコアシステム – ビルダーはゼロから再開発され、よりリソース効率的に動作します。
  • 高速な読み込み時間と応答性の高いエディター – 特に多くのモジュールを持つ複雑なページは、新しいアーキテクチャの恩恵を受けます。
  • ショートコードの削減、よりクリーンなコード – これにより、長期的なメンテナンス、移行が容易になり、SEOにも良い影響を与えます。
  • デザイン変数、拡張された単位、ネストされた行、個別に調整可能なブレークポイントなど、より正確なレスポンシブレイアウトのための新しいデザイン機能
  • 大規模プロジェクトのより良い処理 – DIVI 5は、多くのテンプレート、グローバル要素、ライブラリレイアウトを持つ大規模なウェブサイト向けに設計されています。

当社の現状:nuonu.comのサイトはすでにDIVI 5ベータ版で稼働しています。現在DIVI 4で実装されているすべての顧客プロジェクトは、DIVI 5の最終リリース後、段階的かつ管理された方法で移行できます。理想的には、まずステージング環境で行います。これにより、既存のサイトは安定したままですが、適切かつ安全になり次第、新バージョンのパフォーマンスと利便性のメリットを享受できます。

モダンなウェブサイトの一般的な構造

今日のウェブサイトは、明確に構造化され、視覚的に魅力的であり、何よりもレスポンシブである必要があります。以下の点が重要です。

  • 色とフォントは、コーポレートデザインと一貫している必要があります。
  • ロゴと間隔は、レイアウトに調和して統合される必要があります。
  • 直感的なナビゲーションのための個別のヘッダーとメニュー
  • 法的リンク、ソーシャルメディアプロフィール、連絡先情報を含む構造化されたフッター
  • メインページが「設定 > 表示設定」で設定されるように、ホームページを定義します。

法的要件:インプレッサム、データ保護、クッキー同意

すべてのウェブサイトには、インプレッサムとプライバシーポリシーが必要です。さらに、GDPRおよびTTDSGに準拠するためには、機能するクッキー同意ツールが必要です。その一例が、テストされ、独自のスクリプトで拡張して、例えばMatomoをGDPRに準拠して統合できるReel Cookie Consentです。

サブドメインでのMatomo利用

Matomoは、メインドメインまたはサブドメインのいずれかで運用できます。サブドメイン利用の利点は次のとおりです。

  • より良いデータ管理とセキュリティ – データは完全に自社サーバー上に保持されます。
  • データが第三者に送信されないため、プライバシーに配慮した設定
  • GDPR要件を満たすためのユーザー独自のオプトアウトオプション

WordPressウェブサイトのための必須プラグイン

プロフェッショナルで機能的なWordPressサイトには、特定のプラグインがほぼ不可欠であると私たちは考えています(プロジェクトによってリストは当然異なります):

  • RankMath – スキーマサポート、リダイレクト、多くのオンページヘルプを備えたSEOプラグイン
  • Happy Files – メディア、投稿、ページなどのフォルダによるファイル管理
  • Reel Cookie Consent – クッキー管理(またはReal Cookie Banner、Borlabs Cookie、Complianzなどの代替品)
  • DIVI Supreme – DIVI用の拡張モジュールとエフェクト
  • WP Armour – フォームスパムからの保護
  • AIOS (All in One Security) – ログイン、ファイルシステム、ファイアウォールの強化のための包括的なセキュリティプラグイン

WordPressにおけるセキュリティ設定

インストール後、セキュリティ設定は直ちに最適化されるべきです。

  • ブルートフォース攻撃、スパム、単純なボット攻撃からの保護のために、AIOSとWP Armourを有効化します。
  • 標的型攻撃を困難にするために、標準の管理者ユーザー名を変更します。
  • セキュリティを強化するための二要素認証(オプションですが推奨)。
  • 定期的なバックアップを設定し(例:Duplicator、UpdraftPlus、BackWPupを使用)、復元をテストします。

WordPressメディア設定の調整

デフォルトでは、WordPressはメディアを月ごとに分割されたフォルダに保存します。これはブログには便利ですが、企業ウェブサイトにはしばしば不便です。そのため、「設定 > メディア」で自動フォルダ構造を無効にし、代わりにHappy Filesのようなツールでメディアライブラリを整理することをお勧めします。

基本インストール後のデザインフェーズ

基本インストール後、実際のデザインが始まります。

  • 色、フォント、間隔を設定 – DIVIではデザインの基本としてグローバルに(DIVI 5ではデザイン変数を通じて追加で)。
  • ナビゲーションを直感的にするために、個別のヘッダーとメニューを作成します。
  • インプレッサム、データ保護、ソーシャルメディアリンク、連絡先情報を含むフッターをカスタマイズします。
  • 電話番号をtel:で、メールアドレスをmailto:でクリック可能にします。
  • ホームページを作成し、その後「設定 > 表示設定」でメインページとして設定します。

この構造により、お客様はウェブサイトをモダンで、法的に安全で、機能的に構築するための明確なガイドラインを得ることができます。さらなる調整が必要な場合は、上記のプラグインとツールを個別に設定できます。

共同開発プロセス

私たちは、お客様が希望される場合、開発の早い段階から参加していただくことを重視しています。これは、外観の決定と承認だけでなく、ページの作成、メニュー、SEOデータの管理、メディアのアップロードなどにも及びます。お客様自身ができることが多ければ多いほど良いですし、その後の自主的なメンテナンスも容易になります。

ロゴとファビコン

多くの場合、古いデザインや独自のデザインがまだないことがあります。この場合、私たちはロゴとファビコンをベクターファイルおよび透明なPNGとして作成します。MidjourneyとIllustratorのおかげで、ご要望に応じて2Dおよび3Dロゴの選択肢を提供できます。また、空きドメインの名称選定、確認、登録、または移管も担当します。

ソーシャルメディアリンク

DIVIには、多くのソーシャルメディアプロバイダーの既製の法的にも安全なロゴを含む独自のモジュールが付属しています。ダッシュボードのDIVI > テーマオプションでも、グローバルリンクを設定できます。ロゴ、メニュー、カスタムフッター付きのヘッダーは、このページでもご覧いただけます。

SEOコンテンツ作成

ここから、私たちはページごとに作成を開始します。その際、RankMathを直ちに考慮する必要があります。タイトル、ディスクリプション、og:imageh1h2h3… SEOに優しく、読みやすい見出しとテキスト、意味のある強調表示、そして表現力豊かで最適化された画像素材。SEOファーストとは、コンテンツが訪問者だけでなく、検索エンジンやソーシャルメディアのためにもカスタマイズされることを意味します。考慮すべき点や必要なツールについては、当社のSEO戦略のガイドで確認できます。

すべてのコンテンツとSEOデータの最終化

作成はページごとに異なる時間がかかります。一部のページでは、フォームとそのSSL経由での安全な送信、または特別なトラッキング/同意設定など、追加の設定が必要です。平均して、1ページあたり約1時間以上かかると予想されます。すべてのページが完成し、最後のリンクがテストされて初めて、サイトはライブテストの準備が整います。

パフォーマンス最適化を伴うテストフェーズ

完成したページは常に素晴らしいものですが、今度は徹底的にテストする必要があります。私たちは以下をチェックします。

  • すべての内部および外部リンク
  • すべてのRankMath推奨事項
  • ソーシャルネットワークでの表示(例:Facebookデバッガー / URLデバッガーを使用)
  • スピードテストによる読み込み時間(例:PageSpeed Insights、GTmetrix、WebPageTest)

すべてのエラーが修正され、パフォーマンステストでサイトが合格して初めて、最終的にライブ公開されます。

サイトマップ生成とGoogle Search Consoleへの登録

作成の最終段階は、Google Search Consoleへの登録です。RankMathまたはWordPressによって生成されたサイトマップが登録され、Googleがすべての関連コンテンツを構造的に把握できるようになります。

短期および長期的な監視

数日後には、サイトが検索結果に表示されるはずです。site:domain.deまたはGoogle Search Consoleで直接、すべての重要なコンテンツが本当にリストされているかを確認します。遅くともこの時点で、潜在的なエラーが発見され、修正されるべきです。

これからは、定期的にMatomoサブドメインを訪問し、サイトの成功をリアルタイムで評価することもできます。訪問者の関心に応じて、コンテンツを拡張したり、検索キーワードを洗練させたり、新しいランディングページを作成したりできます。これにより、ウェブサイトは静的なままでなく、企業の目標とともに進化し続けます。

Googleビジネスプロフィール登録

ウェブサイトの作成と最適化を担当する者は、Googleビジネスプロフィール、マップ、画像、動画、ニュースなどにも目を向けるべきです。私たちはサービスプロバイダーであり、訪問者が見るデータについても責任を負います。多くの場合、訪問者がウェブサイトに気づいたり、電話をかけたりするきっかけとなるのは、まさにこれらのデータです。