数字の表やグラフを画像だけで載せると、検索やAIがその数字を正しく読み取れるかは確かではありません。表はHTMLの文字で出し、数字には単位と時点を付け、いちばん大事な数字は本文の1文でも言います。
画像を使うなとは言いません。グラフや図は、読む人に傾向を見せるのに役立ちます。数字そのものは、画像の外にも文字で置く、という分け方です。
表のHTMLの組み方は比較表をHTMLで作るに、グラフをコードで描く方法はグラフをSVGで出すにまとめました。ここでは、どこで数字が画像になりやすいかと、文字で出した後の書き方に絞ります。
画像の中の数字は、どう読まれる？
Googleの画像のSEOの説明には、次の一文があります。
Google では、代替テキストに加えて、コンピュータ ビジョン アルゴリズムやページのコンテンツを使用して、画像のテーマを理解します。
理解するのは画像のテーマです。画像に写った表の数字を、1つずつ正しく読み取るとは書かれていません。画像の情報は、キャプションやページの題など、画像の周りの文章からも取ると説明しています。
AIの回答も同じです。GoogleのAI機能の説明は、AI OverviewsやAIモードに出るための追加の要件はないとしたうえで、勧めることの1つに次を挙げています。
重要なコンテンツはテキスト形式で提示します。
画像の数字が読まれることもある、ではなく、数字が読まれる前提に立てるのは文字だけ、と考えて作ります。
どこで、数字が画像になっている？
画像の表は、作った人が気づかないまま残っていることが多い部分です。製造業のサイトで見かけるのは次の形です。
| 画像になっている所 |
起きやすい理由 |
直し方 |
| 仕様表 |
カタログの表を切り抜いた |
HTMLの表で打ち直す |
| 会社概要の数字 |
会社案内のPDFを画像化した |
本文に書く |
| 試験結果のグラフ |
Excelのグラフを貼った |
元の数字の表を添える |
| 料金表 |
デザインを崩したくなかった |
表を文字で組む |
| 紹介用の画像 |
数字を大きく入れた |
同じ数字を本文にも書く |
探し方は簡単です。ページを開き、数字の上でドラッグして文字を選べるか試します。選べなければ画像です。ブラウザの翻訳を通して、数字の周りの言葉が訳されないかを見る方法もあります。
スキャンしたPDFも同じです。Googleは対応するファイル形式にPDFを含めていますが、紙をスキャンしただけのPDFは、中身が画像で、文字の情報を持たないことがあります。ページ上で文字を選べるかで見分けます。
表は、データから文字で出す
画像の表を打ち直すときは、表をページに直接書くより、元の数字を1つのファイルに持ち、そこから表を作る形にします。グラフも同じファイルから描けば、表とグラフで数字が食い違いません。
私たちのメーカー図鑑の比較ページは、製品・メーカー、コスト、製品の強み、仕様、公式ページの5列をそろえた表を、ページの文字として出しています。各メーカーの公式サイト・カタログで確かめた情報だけを載せるので、どの値も元のページと照らし合わせられます。
元の数字をファイルで持つと、CSVで配ることもできます。配り方はデータをCSVで配るに書きました。
打ち直した数字は、元と照らし合わせる
画像の表を文字に直すとき、画像から文字を読み取る道具を使うことがあります。便利ですが、読み取りの結果をそのまま載せてはいけません。数字の0と英字のO、1と英字のl、桁区切りのカンマと小数点は、取り違えやすい組み合わせです。
打ち直した表は、元のカタログやPDFと1行ずつ照らし合わせます。行数が多いなら、合計の行や、行ごとの合計を計算して、元の表の合計と同じになるかを見ると、取り違えに早く気づけます。照合を機械で回す方法は出典と機械で照合にまとめました。
表には、題を付ける
表の上か下に、何の表かを1行で書きます。HTMLならcaption要素です。県名、項目、年度を並べた短い1行にし、地域・項目・時点が必ず入るようにします。
題の無い表は、表だけが切り出されたときに何の数字か分かりません。表の題は、後で書く本文の1文の下書きにもなります。
数字には、単位と時点を付ける
文字で出した数字も、単位と時点が無いと、取り出されたときに意味が分かりません。「12.3」だけでは、%なのか日なのか、いつの数字なのかが伝わりません。
書く場所は2つに分けます。
- 単位：列の見出しに「離職率・%」のように書く
- 時点：表の題に「2025年度の数字」のように書く
列の中で単位がそろわないときは、セルごとに単位を書きます。「前年比」のような比べる数字なら、何と比べたかも見出しに入れます。
時点は、データの時点と、こちらが取得した日を分けます。統計の時点の読み方は統計の数字の読み方にまとめています。
空のセルを「0」で埋めない
画像の表を打ち直すと、元の表で空欄だったセルを0にしてしまうことがあります。0と、公表されていない、とは意味が違います。空欄の書き分けはデータの空欄の見せ方で扱っています。
大事な数字は、本文の1文でも言う
表は比べるための形です。検索やAIは、ページの一部の文を取り出して答えに使うことがあります。表の1セルだけでは、何の数字かが分かりません。
いちばん伝えたい数字は、表の上か下で、1文にして言います。
2025年度の調べでは、〇〇県の製造業の平均勤続年数は〇年でした（出典：〇〇の公表データ）。
この文には、時点、地域、業種、項目、値、出典が入っています。この1文だけを読んだ人にも、何の数字か分かります。文の中の値は例で、実際の数字ではありません。
逆に、上の表のとおりA社が最も長い、とだけ書くと、表を見ていない人には何が最も長いのか伝わりません。要約されても意味が変わらない書き方は要約に強い書き方にあります。
本文と表の数字を、別々に打たない
本文の1文も、表と同じデータから作ります。手で打つと、表を直したときに本文だけ古い数字が残ります。
見えない場所にだけ中身を置く失敗は、私たちもしています。暦のメディアで、一覧のFAQを構造化データにだけ入れ、画面に出していませんでした。答えを画面にも出す形に直しています。
紹介用の画像に入れた数字も、本文に書く
SNSで共有されたときに出る紹介用の画像に、数字を大きく入れることがあります。目を引くための画像なので、それ自体は構いません。ただ、その数字がページの本文に無いと、ページを開いた人は数字の出どころを確かめられません。
画像に入れた数字は、本文の最初のほうに同じ値で書き、時点と出典を添えます。画像を作り直さずに本文の数字だけ直すと、画像と本文で数字が食い違います。数字を直したら、画像も作り直す決まりにしておきます。
画像を残すときの書き方
グラフや図を残すなら、代替テキストには何の画像かを短く書き、数字は表に任せます。
altの例：県別の平均勤続年数の棒グラフ。数字は下の表に掲載
altに数字を全部並べるより、表を置いたほうが読む人にも使いやすくなります。代替テキストの書き方の全体はalt属性とはにまとめました。AIに読まれるための自社サイトの点検は自社サイトの対策から順に見られます。
仕様・出典の確認日：2026年10月26日。
