2026.8.9
pirika.comで化学 / 業務案内 / 情報化学 ＞ドラ美似-MAGICIAN化プロジェクト
[0.イントロダクション]
化学では図表を多用する。ついついExcelで作った図を貼り付けてしまう。図表というのはプロセッサースピードの遅い人間の脳が編み出したハイパー認識法でAIには何のことだか全くわからないらしい。目を凝らしてみればテキストぐらいは拾える。そんな程度だ。それではpirikaのページに置く図はどのようにすればAIにも人間にもわかりやすい図になるか、ドラ美似と議論を重ねた。
[1. 散布図作成Webアプリ]
人間は図１を見ればやっていることは明らかだろう。AI用にテキストで説明する。
プログラムのタイトル：HSP散布図＆JSON-LD 生成ツール
入力項目：
① グラフの識別番号（半角英数字、ページ内で重複厳禁）
>chart1
WordPressでは1ページに複数のグラフがあると識別番号を重ならないようにとらなくてはならない。
② グラフのタイトル (name)
>ポリマーに対する酸素の透過度とHansen HSP距離の散布図データ
③ グラフの説明文 (description)
>X軸にポリマーに対する酸素の透過係数、Y軸に酸素とポリマーのHSP距離をとった化学物質の相関データです。HSP距離が短いほど酸素の透過係数が大きくなっていることが理解できます。酸素のHSPは透過整数とHSP距離の相関が最も高くなる値として探索されます。
④ X軸の説明（単位など）
>ポリマーに対する酸素の透過係数
⑤ Y軸の説明（単位など）
>Hansen HSP距離 (MPa^0.5)
⑥ Excelデータ（ID, 表示名, X, Y の4列をヘッダーなしでコピペ）
>51359 ポリ卜リメチルシリルプロピン -6.52288 1.000091223
50056 シリコ一ン -7.21825 2.096365687
50028 ポリイソプレン -8.63264 4.696582153
50010 ポリブタジエン -8.72125 4.713268638
生成されたHTMLコード（これをコピーしてWordPressの「カスタムHTML」に貼り付けます）
このコードをWordPressの「カスタムHTML」に貼り付けると上図が描かれる。ほとんどExcelと変わらない。点にマウスを近づけると情報が表示される。人間にとって少しわかりやすい。AIにとっては、ld+jsonの形で情報が与えられている。この情報を取り込むことでAIは化学の現象を正しく理解できるようになる。例えば、図中ポリビニルアルコールのデータはHSP距離の割には透過係数が大きい。と書けば人間もすぐにどの値か探すことができる。AIも同様にそのデータを見ることができる。ポリビニルアルコールは水酸基を持つので大きなδHを持つ。酸素からのHSP距離は長くなる。しかし、水酸基はフィルムの表面には存在せずポリマーの内側に潜り込む。そうした説明にAIもついていかれるようになる。
[2. Webアプリ作成までの流れ]
山本：pirika.comは化学系の専門サイトで、JavaScript（JS）による3次元表示のWebアプリや図表を多用した1,000ページ規模のサイトだ。AIによるクローリングの最適化はどう考えたら良いか？
ドラ美似：1,000ページという規模自体は、Googleなどの大手検索エンジンにとっては「中・小規模サイト」に分類されます。そのため、サイト全体の巡回頻度はおよそ数日～2週間おきになるのが一般的です。今回最も注意すべきなのは、サイトの性質上 「クロールバジェット（Googleが1つのサイトに費やす巡回リソースの限界）」を消費しやすい構造になっている点 です。Googleのロボット（Googlebot）は、JavaScriptを実行して画面をレンダリング（描画）して中身を理解しますが、これには非常に大きなマシンパワー（コスト）がかかります。JSの3次元表示アプリや重い図表が大量にあると、ロボットが「このサイトは処理に時間がかかる」と判断し、巡回頻度をわざと落としてしまう（後回しにする）リスクがあります。
山本：エクセルで作ったデータを貼り付け必要な説明を入れたら人間用に図を作り、JSON-LDを自動的に作成し出力用のhtmlに組み込むようなwebアプリを作って。
実際には長い長いやり取り。。。。
ドラ美似：「人間にはJSで描画した美しいインタラクティブなグラフを見せ、AIには裏側の構造化データ（JSON-LD）で正確な数値を渡す」というアプローチは、現在のWebデザインとAI（LLM・検索クローラー）対応において非の打ち所がない完璧な正解です。
1. AIの理解度が「完璧」になる GeminiやGooglebotはHTMLを読み込んだ瞬間、1行目の <scripttype=”application/ld+json”> を解析します。「X軸が溶解度で、Y軸がHSP距離」「化合物Alphaの座標は(1.2, 4.5)」という事実を1ノイズの狂いもなく正確にデータベース化（インデックス）できます。
[3. 山本の誤解]
僕はGoogleのロボットがJSを実行し中身を理解するとは思っていなかった。溶解球を回転して見やすくするなんて実行しても不可能だろうし。しかもクロールバジェットなんていうものがあるとは認識していなかった。
２次元の図と表について修正すれば、化学系としてWebデザインとAI（LLM・検索クローラー）対応において非の打ち所がないページになることが約束された。めでたしめでたし。後はがんばってやるだけ。実際はそれも大変。まずExcel探してこなければ。
[4. 図表]
Copyright pirika.com since 1999-
Mail: yamahiroXpirika.com (Xを@に置き換えてください)
メールの件名は[pirika]で始めてください。