SEO集客サイト

コロナ禍の影響でインドネシアのビジネス形態も従来のフィールドセールスによる対面取引から、非対面取引を前提としたインサイドセールス重視型へとシフトしており、現にインドネシア在住各企業によるウェビナーが頻繁に開催されています。

コロナ禍で今後顧客の購買までの意思決定の比重がよりオンラインに移行し、インターネットを駆使して購買活動を進めていく潜在顧客の購買担当者に、役立つ情報を提供して結果的に自社の商品を選んでもらうためのバイヤーイネーブルメントの営業活動の比重が高まると思われます。

リアルで行われていたビジネスがデジタルシフトした非対面型、非接触型の社会では、対面でのプレゼンテーションの機会が減少することになり、それに代わる引き合い（お問い合わせ）獲得、リード（見込み顧客）獲得の手段としての情報の管理と有効活用が益々重要になっています。

WordPressは世界の全WEBサイトの38%、CMS（コンテンツマネージメントシステム）市場では63%を占める圧倒的なシェアを誇っており、HTMLやCSSなどの知識のない人でも簡単に集客WEBサイトの構築が可能です。

WordPressがここまで世界中で採用されるようになった背景は、コンテンツを複数人で管理しやすい強力なダッシュボード（管理画面）が標準装備されており、ブログ機能を充実させるためのプラグインや、デザイナーではない素人でもプロのデザイナーが開発したSEO対応された美しいテーマを自由自在に着せ替えることが出来ることです。

その結果画一的なデザインのサイトばかりになりWEBがつまらなくなったという意見が出ることもありますが、WEBサイトがデザイン性を重視されたのは過去の話で、今のエンドユーザーはスタイリッシュで洗練されたUIよりも、なじみのある使いやすいUIで良質なコンテンツを読みたいという考えが主流になっていることはGoogleが提示する検索順位に影響を与える要素を見ても明らかです。

とはいえビジネスとしてサイトの開発を請け負う際には、顧客の要件を既存のプラグインやテーマですべて満たせることはないため、WordPressのメカニズムを理解した上で、PHPやCSS、JavaScriptを使った開発が必要になります。

そして集客を目的としてWEBサイトを構築するということは、SNSからの流入やGoogle検索での上位表示が必須となります。

2000年代に僕がバリ島から日本向けにインドネシア家具と雑貨のBtoB集客WEBサイトを運営していた頃は、大量の類似ドメインからの被リンクによってドメインパワーを上げるブラックハットSEOによって、「バリ島 旅行」という検索ワードの結果がすべて一旅行社のサイトのページで埋まるということが起こっていました。

2012年に低品質コンテンツを排除するパンダアップデートと、低品質被リンクを排除するペンギンアップデートが実施され、2016年のWELQ問題が契機となったと言われる健康アップデートにより、お金や人生（健康や安全など）に大きく影響するものとGoogleが位置付けるYMYL（Your Money or Your Life）系アフィリエイトサイトが駆逐されました。

繰り返されるGoogleアップデートの末、2020年12月現在では専門性（Expertise）、権威性（Authoritativeness）、信頼性（Trustworthiness）が重視されるようになった結果、どれだけコンテンツが優れていてもSEO対策が完璧であっても、必ずしもビッグキーワードやミドルキーワードで上位表示させることは出来なくなっています。

ここ数年のSEOでは特定のキーワードで個々のコンテンツを上位表示させることはあきらめて、トピックごとのコンテンツ群をピラーページ（まとめ記事的なもの）を中心として内部リンクでクラスター化させることで、トピックに関する権威性を上げて上位表示を狙うという手法が主流ですが、2021年のGoogleアップデートではユーザー体験（UX）が重視されると言われており、これからの集客WEBサイトにはページスピードや使いやすさを評価するアルゴリズムへの対応が必要になってくると考えられます。

当ブログではインドネシアでWEBによる集客の必要性を感じているものの、具体的に何から手を付けたらいいのか分からないという方にとって、集客WEBサイト制作とは何かをイメージするための一助となるような記事を書いています。

SEO

検索エンジンとアルゴリズムの変遷

度重なるGoogleアルゴリズムの変更によって、今回上位表示されていたサイトが次回圏外に飛ばされることも普通に起こる状況ですが、SEO施策結果を定量的に数値化されることに慣れている人にとっては、ネトゲやソシャゲでステージをクリアする感覚で上位表示させるために研究し創意工夫すること自体を楽しめるのかもしれません。

インドネシアで収益化を目的としたブログ運営が難しい理由

在住者目線で書かれるインドネシア関連情報サイトでは、大きな検索ボリュームを期待できないことが最大のネックであり、要は刺激的な日常生活から書くネタは無尽蔵にあったとしてもそれに対する需要が少ないことが、収益化に繋がらず継続のモチベーションを削いでいく元凶となっています。

多地域・多言語WEBサイトの作成方法

インドネシア国内のインドネシア人向けた情報発信を目的とした多言語WEBサイトの構築の場合、お客様に取得していただくドメインは、ジェネリックトップレベルドメイン（gTLD）である「.com」を推奨しており、Googleサーチコンソールので地域と言語設定に基づいたターゲット ユーザーの設定の重要度が増えるにせよ減るにせよ、インドネシア国内から検索してもらえるようなサイト設計とコンテンツ作成が重要になってきます。

集客のためのサービスサイト構築

長年趣味の延長としてWEBサイト構築やブログ運営をやってきましたが、今回初めて企業案件として集客サイト構築を行ってみて気づいたことは、SEOの技術的な施策を行うのはもちろん、それ以上にサイトで何を実現したいのか、どのようなサイトにしたいのかというコンセプトの確定が重要ということであり、コンセプトが確定すればその後のサイト設計もUI/UX設計も自然に決まってきます。

WordPress

WordPressの仕組み

フロントエンド開発を「ユーザーに見える部分の開発」、バックエンド開発を「ユーザーに見えない裏方処理の開発」と定義すれば、WEBサイト全体はフロントエンド（View）で入力されたデータが、バックエンドで処理（Controller）されて、データベースに格納（Model）されるという動きをします。

WordPressはテーマ（View）とコアシステム＆拡張機能プラグイン（Controller）とMySQLが独立して機能するという意味で、MVCモデルのような動きをすると言えますが、MVCフレームワークではないのでWordPressをインストールしたディレクトリやテーマフォルダの中に、viewとかcontrollerとかmodelというフォルダは存在しません。

テンプレート階層とテンプレートタグ

テーマのテンプレートファイルは、PHPファイルとスタイルシートから構成され、「wp-content/themes」内のテーマフォルダに格納されます。

テーマ用のPHPファイルの中に、1人だけ拡張テーマ関数を集めたfunctions.phpという色違いが居り、これがwp-includes内の関数ファイルと同様に、自動的にWordPressの初期化中にロードされ、WordPressの拡張インターフェイスのような機能を果たします。

プラグインの開発

WordPress本体（コアシステム）のロジック内に、do_actionとかapply_filterとかでキーが仕込んであるので、開発するプラグイン関数の中に、キーと紐付けするためのadd_actionとかadd_filterという命令を記述します。

WordPress本体でロジックが実行され動作するときには必ずアクションが起動され、出力がされる時には必ずフィルターが起動されます。

固定ページと投稿記事の派生テンプレート

投稿記事のメインクエリ内の日付や著者を削除して、本文欄に商品情報を配置していってもいいわけですが、商品名・サイズ・価格など、どのページにも必ず必要になる情報を、膨大な数の全商品ページにHTMLでコーディングするのは非効率です。

投稿記事が持つカテゴリやタグといったタクソノミ機能を利用しながら、全商品ページで必要になる共通の情報は、管理画面の投稿画面からタイトルやコンテンツと同じように公開・更新できるようにして、作業負荷を軽減し入力ミスを防止したい。

投稿タイプ・フィールド・タクソノミの追加

投稿記事の入力画面に、共通情報用の入力フィールドをカスタムフィールドで追加し、管理画面からのコンテンツ作成を「投稿（post）」「固定ページ（page）」とは違う第三の投稿タイプ（post_type）として定義できます。

また標準ではカテゴリとタグという2つのタクソノミが利用できますが、商品分類の切り口は、価格・サイズ・在庫数量・色・材質というように多数ありますので、第三の分類「商品カタログ」をタクソノミとして定義できます。

WordPressテンプレートファイルの構成

WordPressは起動時の最初にデータベースやfunctions.phpの情報を読み込み環境設定を行い、URLからページの種類を判断しあてはまるテンプレートファイルをテンプレート階層に従って優先度の高い順に探し、パラメータに応じたSQL文を組み立て記事を取得し、WEBページとしてレンダリングします。

WordPress起動時に読み込まれるコアファイルの順番

WordPressはURLクエリストリングを処理しテーマを表示しますが、その前にコアファイルがWordPressを起動させるまでにファイルが順番に実行されます。

WP_Queryクラスのカスタマイズ

WordPressはURLクエリストリングに適合したテンプレートをテンプレート階層に従って選択し、データベースから取得したメインクエリを$wp_queryに格納し、have_posts()が$wp_query内にデータを確認できる間はthe_posts()で投稿を、the_title()でタイトルを取得し表示し続けます。

WEB

スタイルシートによるレイアウト調整

要素という言葉は「物・事を成り立たせるもとであるそれ以上は簡単なものに分析できないもの」というこれ以上分解できない絶対的な単位という意味があります。

一方システムは人間の言葉をそのままでは理解できないので、理解できるようにタグを付けて範囲を明確にしてあげた後のカタマリを要素と考えます。

人間世界でプロパティ（属性）という言葉は「土地・資産・所有物」という意味であり、世の中のすべてのオブジェクトは属性を持っています。

システムの世界の属性はオブジェクトが持つ「特徴・性質」という意味であり、HTML要素内の属性（id, classなど）はDOMオブジェクトのプロパティに割り当てられ、CSSでセレクタというオブジェクトとして、プロパティと値を持っています。

セレクタはWEB上のオブジェクトに対して、装飾（CSSにてプロパティに値を設定）したり処理を実行（メソッドやイベント）したりするための仲介役ですが、セレクタになる資格のあるものはHTML要素またはHTML属性です。

配列はお年玉用のルピア紙幣の入った封筒を束ねたようなものであり、封筒に連番が振ってあれば通常配列、渡す相手の名前が書いてあれば連想配列となります。要素はこの場合のルピア紙幣の入った封筒全体であり、ルピア紙幣が値、封筒に振ってあるのが連番ならインデックス、相手の名前ならキーとなります。

封筒からルピア紙幣を出した後の相手の名前付きの空の封筒をプロパティと考えると、入れるものはルピア紙幣に限る必要はなく、車のキーでも手紙でもいいわけです。

航空券が入っている場合は、「スカルノハッタ空港からバリ島に飛ぶ」というアクションを約束するものですので、航空券は関数リテラルという値であると考えられ、この場合は別の封筒には名義人の名前を入れておきます（参照渡し）。

以前のHTMLタグは見出し・段落・表などブロック（かたまり）として認識されるブロックレベル要素と、ブロックレベル要素の内容として用いられるインライン要素に分類されていましたが、HTML5ではフローコンテンツ、セクショニングコンテンツ、ヘッディングコンテンツ、フレージングコンテンツ、埋め込みコンテンツ、インタラクティブコンテンツ、フォーム関連コンテンツの7つに分類されます。

WEB開発言語（タグ）の役割（DOMの基本操作）

開発言語（タグ）の役割分担です。

ブラウザはHTMLの開始タグから終了タグまでを、1つのDOM（Document Object Model）オブジェクトとして要素化（エレメント化）し、DOMはJavaScriptやjQueryからエレメントにアクセスするために、Nodeインターフェイスを提供します。

例えば製品クラスは製品にインスタンス化できますが、セット販売用に製品を組み合わせたセット品はそのままではインスタンス化できないファントムであり、インスタンス化できない抽象クラスであるインターフェイスと呼ばれます。

製造工程途中で跳ね出される中間品のうち在庫があるものは所要量展開時に引き当てをしたいが、新規に製造指図は発行したくない場合はファントム品という扱いになります。

Ajax関数によるGET通信とPOST通信

ブラウザとWEBサーバー間のデータ通信であるHTTPプロトコルはOSI参照モデルのセッション層に属しており、ブラウザ上のHTMLフォームに入力したデータをサーバーに引き継ぐGETメソッドとPOSTメソッドもHTTPプロトコルに定義されています。

ブラウザの役割は、ユーザーが要求したURLのリソースをサーバーに要求して、ブラウザウィンドウに表示（レンダリング）することですが、内部では以下の2つを行なっています。

nodeインターフェイスを通してアクセスできるDOMの最上位オブジェクト（エレメント）は、html開始タグ＜html＞とhtml終了タグ＜／html＞から生成されるdocumentオブジェクトです。

GETはフォームに入力したデータを元ににサーバーから情報を取得することに重きを置いており、Google検索やWordPressの下書きとして保存などはGETです。GETメソッドは、URLの後ろに「?」で始まり、「=」で結ばれた名前と値を「&」で連結したクエリ文字列によってデータを引き継ぎます。

一方POSTはフォームのデータを投稿することに重きを置いており、WordPressの新規投稿はPOSTになります。

PHP・JavaScript・VBの書き方の違い

プログラムのコードは変数、値（リテラル）、式、制御文の4つから構成され、制御文の書き方には順次処理、分岐処理、繰り返し処理の3種類があります。

言語によってこの4要素の表現方法が異なり、しかもコード内部に書かれるSQL文も、接続するデータベースによって多少の差異がある、複数のプログラム言語を扱うときに何となくモヤッとした曖昧感が残る原因の正体がここにあります。

当然すべての型や内部関数を網羅することはできませんが「どこに曖昧感の原因があるのか」を以下のマトリックスから概念的に掴みたいと思います。

連想配列に関数リテラルを格納

関数は用途や場所によって呼称が変わりますが、連想配列の中に変数の値が格納されるのと同じように、関数も無名関数として連想配列に格納され、同じようにキー（リテラル）で管理される場合はメソッドと呼ばれ、その配列自身を実体化（オブジェクト化）します。

PHPからMySQLとSQLServerとOracleへの接続方法

ADOの場合Query実行結果を2次元配列であるrs（レコードセット）に格納し、レコードセットからフィールド名を指定することで値を取得し、レコードセットに対して直接MoveNextで行を進めていくが、MySQLの場合mysql_query関数によるQuery実行結果を2次元配列であるret（レコードセット）に格納し、レコード単位にmysql_fetch_array関数でで配列に格納した上でフィールドの値を取得する。

PHPからMySQLに接続するためには拡張ディレクトリに拡張モジュールであるphp_mysql.dllが配置され、php.iniに拡張指定がある必要があります。

PHPからSQLServerに接続するにはMicrosoft Drivers for PHP for SQL Serverという拡張モジュール（ドライバー）のdllファイルが必要であり、PHPコードからはドライバーの関数（API）を呼び出してSQL文を実行します。

PHPからOracleを操作するにはoci.dllとして実装されているOCI（Oracle Call Interface）というRDBMSのAPIを使用しますので、まずはApache起動時にoci.dllがロードされる必要があるわけで、その拡張モジュールとしてphp_oci8_11g.dllがプロシージャーエントリーポイントでリンクします。

クリッカブルマップの作り方

今はGoogleで検索することでほとんどの情報を入手できる時代ですが、複雑なことを考えたり発案したりするためには、ある程度は事前に暗記することで素材が頭の中に入っている必要があります。

例えばインドネシアのシングルオリジン（生産地の農場単位）コーヒーの風味の傾向とそれを生み出す産地特有の風土や歴史などの基本情報を、地図上からクリック一つで参照できるような仕組みを作りたいとします。

地図をクリックすることで産地の説明ページにジャンプさせるためにHTML4.0のクリッカブルイメージマップを使用し、マウスオーバーでポップアップ表示するためにJavaScript使用し、レスポンシブサイトで可変サイズの画像のリンクエリアがずれないようにするためにjQUeryプラグインを利用するというようにHTMLとJavascript、CSS、jQueryなどWEB関連技術の基本的な仕組みの理解が必要になります。

jQueryプラグインであるjsTreeでツリー表示

ツリー表示のjsTreeはjQueryのプラグインでありscriptタグの中にjstreeプラグインを読み込む必要がありますが、DataGridはTabsなどと同じくJQuery UIのウィジェットにあたります。

Apacheサーバー環境の設定

HTTP通信はクライアントからのリクエストに対してApacheサーバーがレスポンスを返すことで成立します。

HTTPサーバーとしての最大の機能はバーチャルホストであり、物理ディレクトリを仮想サーバーのDocumentRootに指定してURLを割り当てることで、1つのApacheサーバーで複数のドメインや複数のサブドメインの管理することができます。

Apacheサーバーのチューニングをするといういことは、Apache設定ファイルであるhttpd.confに、Apacheディレクティブと値（ON/OFF, 数字, HTTP環境変数, URLなど）を設定することであり、これを親子関係にある.htaccessに設定して、ディレクトリ単位に配置することもできます。