本文へ移動
SOLVE ET COAGULA

BLOG

そるこあブログ

見た目は何も変えていない。それでも、Webサイトの中身は変わっている。

見た目は変えない。でも、Webサイトの中身は変わる。

Webサイトの改善と聞くと、デザインを変えたり、ページを増やしたりすることを思い浮かべるかもしれません。けれど、画面に表示される文章や写真はそのままでも、サイトの情報の伝わり方を整えることはできます。
SOLVE ET COAGULAとしてお引き受けした最初の仕事は、そんなWebサイトの「見えない部分」を整えることでした。
ご依頼いただいたのは、医療機関向けの施設基準管理クラウドサービス「iMedy3」の紹介サイトです。
サイトに掲載されている情報を検索エンジンなどが読み取りやすいように、構造化データを自動で出力するWordPress専用プラグインを開発し、導入しました。

Webサイトの情報を、機械にも伝わる形に

ページに会社名とサービス名が並んでいれば、人は見出しや前後の文章から、それぞれが何を指しているのかを読み取れます。
検索エンジンも、文章やHTMLの構造、リンクなどを手がかりにページの内容を理解します。
構造化データは、そうした手がかりに加えて、「これは運営会社の名前」「これはソフトウェアの名前」「これは記事の公開日」と、情報の意味を明示する仕組みです。会社とサービスの関係のように、情報同士のつながりも記述できます。
今回使ったのは、情報の種類や関係を表す共通の語彙である Schema.org と、それをHTMLの中に記述する形式の JSON-LD です。

ページの内容に合わせて、自動で出力する

iMedy3のサイトには、サービス紹介、会社概要、お知らせ、導入事例などがあります。
同じサイトの中でも、ページごとに伝えたい情報は違います。
たとえば、トップページではサービスをソフトウェアとして記述し、会社概要では運営会社の情報を記述します。ニュース記事には公開日と更新日を含め、導入事例では記事と導入先の病院を関連づけます。
専用プラグインは、WordPressの投稿タイプやカテゴリー、既存の入力項目などをもとに、ページに応じた構造化データを出力します。料金やレビューなど、掲載内容から確認できない情報は出力に含めません。
テスト環境では、ページごとの出力やJSONの書式、同じ情報が重複していないかを確認しました。
会社概要に載っている所在地や電話番号、導入事例に載っている病院名や病床数なども、実際のページ表示と照らし合わせています。

Codexを使って、サイトに合う仕組みを作る

今回のプラグイン開発には、コーディング支援ツールのCodexを使いました。
実装を進めるうえで時間をかけたのは、どのページで何を出力するかを決め、出力された情報を実際のページと照らし合わせることです。たとえば、導入事例には病院名や病床数の入力欄がすでにありました。
どの項目を使えば、普段の更新作業を活かしながら、画面に表示される情報と揃えられるかを考えました。
こうした判断を一つずつ積み重ねることで、このサイトのページ構成と運用に合う仕組みにできました。

検索結果への反映は、検索サービスによって異なる

構造化データは、検索エンジンなどがページの内容を理解するための補助情報です。
検索サービスが対応している形式では、検索結果に追加情報が表示される場合もあります。
検索順位の上昇や、AI検索での引用が保証されるわけではありません。
今回の目的は、サイトにすでにある情報の意味や関係を、機械にも読み取れる形で明示しておくことでした。

ホームページを作らないWebの仕事

SOLVE ET COAGULAでは、小規模なホームページ制作もお引き受けしています。
今回のように、既存のサイトを活かしながら、その内側に手を入れる仕事もあります。
今回の構造化データの実装では、ページのデザインやレイアウトに手を加えていません。
HTMLのソースには、運営会社や製品、記事の公開日などを機械が読み取れる形式で追加しました。
SOLVE ET COAGULAの初仕事が、ふだん画面には現れない部分を整える仕事だったことを、少し面白く感じています。

解いて、結んで。

既存の仕組みを理解し、必要な形に整え直す。
そんな仕事も、これから少しずつ積み重ねていければと思います。

明るいデスクに置かれたノートパソコンとカップ

Contact

まずはお気軽に
ご相談ください。

Webサイトの制作・運用・生成AIの活用など、お気軽にお問い合わせください。
内容を確認のうえ、通常1〜2営業日以内にご返信いたします。

※ 内容によっては確認作業など生じるため数日お時間をいただいております。

お問い合わせフォームへ