「費用をかけてホームページをつくったのに、問い合わせが増えない」「自社名以外で検索しても出てこない」——製造業の経営者やWeb担当の方から、こうしたご相談をよくいただきます。原因は一つではありませんが、意外な盲点になっているのが「見出しが画像になっている」ことです。
見た目がきれいに整っているサイトほど、見出しを画像（デザインされた文字）でつくっている傾向があります。ところがこの作り方は、検索エンジンに「このページが何のページか」を伝えられず、SEO上は大きな機会損失につながります。
本記事では、ホームページでありがちな見出しまわりのSEOの落とし穴を整理し、デザインを保ったまま検索に強くする直し方を解説します。あわせて、見出し以外で効くSEOの基本も紹介します。製造業に特化してWeb制作・SEO支援を行うテックオーシャンが、実際のサイト改善で得た知見をもとにお伝えします。
■ お急ぎの方へ
自社サイトが検索に強い作りになっているか不安な方は、お気軽にお問い合わせください。現状の課題を整理してご提案します。
なぜ「画像の見出し」がSEOで不利なのか
最初に、なぜ見出しを画像にすると不利になるのか、その仕組みを押さえておきましょう。
検索エンジンは画像の中の文字を読めない
WebサイトのデザインでよくあるのがSVGやPNGといった画像ファイルに文字を埋め込んだ見出しです。とくにSVGは、フォントを図形化（アウトライン化）して書き出すことが多く、その場合画像の中の文字は「ただの図形」になっています。
人間の目には「会社概要」「製品紹介」と読めても、検索エンジンのクローラーにとっては絵が置いてあるだけで、テキスト情報としては存在しません。つまり、ページの中でもっとも重要な「見出し」が、検索エンジンにはまったく伝わっていないのです。
見出しは、検索エンジンがページの主題を理解するための重要な手がかりです。その見出しが画像であることは、本のタイトルや章見出しを白紙にしたまま中身だけ書いているようなものだと考えると、影響の大きさがイメージしやすいでしょう。
「alt（代替テキスト）」が空だと、見出しは”存在しない”扱いになる
画像を使う場合の救済策がalt属性（代替テキスト）です。altは「この画像には何が書かれているか」をテキストで補う仕組みで、検索エンジンや音声読み上げソフトはこのaltを手がかりにします。
問題は、デザイン用の画像見出しはaltが空（alt=””）のまま放置されているケースが非常に多いことです。altが空の画像見出しは、検索エンジンから見ると「中身の分からない画像が置いてあるだけ」で、見出しのテキストはゼロ評価になります。アクセシビリティの面でも、視覚に障害のある方が読み上げソフトを使った際に、見出しが読み上げられず内容が伝わりません。
実際に私たちがある製造業のWebサイトを診断した際も、ページの主見出しが「アウトライン化されたSVG画像＋空のalt」という状態で、検索エンジンにはページの主題がまったく伝わらない作りになっていました。見た目は整っているのに検索で評価されない、という典型的なパターンです。
ホームページでありがちな、3つの見出し問題
見出しまわりで損をしているサイトには、共通したパターンがあります。代表的な3つを、自社サイトのチェックリストとしてご活用ください。
① 見出しがすべて「デザイン文字の画像」になっている
「会社概要」「製品紹介」「品質への取り組み」といったセクション見出しが、すべて画像でつくられているパターンです。デザイン性は高いものの、前述のとおり検索エンジンには内容が伝わりません。ページ内のキーワード（事業名や地域名など）が見出しに含まれていても、画像である限りSEO上の効果はほとんど得られません。
② H1がロゴだけで、全ページ同じになっている
H1はページ内で最も重要な見出しタグで、そのページのテーマを表す1行であるべきものです。ところが、ヘッダーのロゴ画像がH1に設定され、しかも全ページ共通になっているケースが少なくありません。
この場合、トップページも製品ページも会社概要ページも、すべてH1が「会社名（＝ロゴ）」で同一になります。ページごとのテーマが検索エンジンに伝わらず、「このページは製品紹介のページだ」「ここは技術解説だ」という区別がつかなくなってしまいます。
③ ページの主題を表すH1が、そもそも存在しない
②と似ていますが、ロゴをH1から外した結果、どのページにもH1が無い状態も見かけます。見出しがすべて画像で、かつ見出しタグ（h1〜h3）で囲まれていないと、検索エンジンはページの構造を読み取れません。
ここまでの問題を、NG例とOK例で整理すると次のようになります。
| 項目 | ありがちなNG | 望ましいOK |
|---|---|---|
| セクション見出し | アウトライン化SVGの画像 | 実テキストのh2（CSSでデザイン） |
| 画像見出しのalt | alt=””（空） | 見出し文言をaltに記載 |
| H1の中身 | ロゴ画像（全ページ共通） | ページ固有のテーマを表す実テキスト |
| H1の数 | 0個 または 複数で曖昧 | 各ページに1つ |
| 検索エンジンの理解 | ページの主題が不明 | 主題・事業・地域が明確 |
■ ご相談ください
「自社サイトがどの状態か分からない」という方も、現状診断からお手伝いできます。製造業向けWebマーケティング支援の一環として、サイトのSEO改善に対応しています。
デザインを保ったまま、SEOに強くする直し方
ここからが本題です。「デザイン性を犠牲にせず、検索にも強くする」ための具体策を3つ紹介します。
実テキスト＋CSSで「デザインされた見出し」を再現する
もっとも効果的なのは、画像見出しを実テキストに置き換え、CSSで見た目を整える方法です。フォントの色・サイズ・太さ・字間、英語のサブ見出し（COMPANY、PRODUCTなど）の併記まで、CSSで十分に再現できます。
実テキストにすれば、検索エンジンは見出しの文言を正しく読み取り、ページの主題やキーワードを理解できます。読み上げソフトにも対応でき、アクセシビリティも向上します。私たちがサイトを改善する際も、まずこの「画像見出しの実テキスト化」を最優先で行います。デザインの再現度は完璧に元と一致するわけではありませんが、SEOとアクセシビリティの効果を考えれば、置き換える価値は十分にあります。
どうしても画像を残すなら、最低限altを入れる
ロゴと一体化したデザインなど、どうしても画像のままにしたい見出しもあります。その場合はaltに見出しの文言を必ず入れることが最低条件です。altがあれば、検索エンジンはその文言を見出しテキストの代わりとして読み取ります。
ただし、altはあくまで「実テキストの代替」であり、評価としては実テキストより一段弱い扱いです。重要な見出しほど、画像ではなく実テキストにすることをおすすめします。
H1はページごとに1つ、ページのテーマを表す言葉で
H1は各ページに1つ、そのページのテーマを表す実テキストにします。ロゴはサイトのブランドであって見出しではないため、H1から外し、通常のリンク（divやp）に変更します。
そのうえで、各ページのH1を次のように設計します。
トップページ : 〇〇県〇〇市の金属加工メーカー 〇〇製作所
会社概要ページ: 〇〇製作所の会社概要・沿革
製品ページ : 精密切削部品の加工
技術ページ : 〇〇加工の特徴と対応範囲
このように、ページごとに「何のページか」と「地域・事業」が伝わるH1にすることで、検索エンジンはページの主題を正確に理解できるようになります。
見出し以外にも効く、SEOの基本の打ち手
見出しの改善とあわせて取り組むと効果的な、サイト全体の打ち手も紹介します。
構造化データで検索エンジンに情報を正しく伝える
構造化データは、会社情報やコンテンツの内容を検索エンジンが理解しやすい形式で伝える仕組みです。会社情報（Organization）、パンくず（BreadcrumbList）、記事（Article）などを実装すると、検索結果での見え方が向上します。
なお、求人ページを持つ場合は、求人専用の構造化データ「JobPosting」を実装すると、Googleの求人枠「Googleしごと検索（Google for Jobs）」に掲載される可能性が生まれます。「地域×職種×求人」の検索で表示されれば、媒体に頼らない自社サイトからの応募導線になります。
タイトルや本文に「地域×事業」を盛り込む
地域名と事業内容は、BtoB製造業の検索で必ず使われるキーワードです。各ページのタイトルタグ（titleタグ）に「〇〇市 ＋ 加工・サービス名」を含め、本文でも対応エリアや得意分野を自然に盛り込みます。指名検索だけでなく、「〇〇市 精密加工」のような地域×事業の検索からの流入を狙えます。
「会社の言いたいこと」から「読み手の知りたいこと」へ
サイトは、つくり手の意識が「自社が伝えたいこと」に寄りがちです。しかし検索から訪れる読み手が知りたいのは、自分の課題が解決できるかどうかです。技術解説・加工事例・よくある質問など、読み手の疑問に答えるコンテンツを増やすことで、検索流入と問い合わせの両方に効きます。これは採用ページでも同じで、求職者の不安に答えるコンテンツが応募につながります。
■ ご相談ください
サイトのSEO改善は、見出しの直しから構造化データ、コンテンツ設計まで一体で進めると効果が高まります。テックオーシャンでは製造業に特化して、こうした改善を伴走支援しています。詳しくは製造業向けWebマーケティング支援をご覧ください。
自社サイトでできる、簡単セルフチェック
専門知識がなくても、見出しが画像かどうかは数分で確認できます。次の3つを試してみてください。
- 見出しをマウスでドラッグしてみる：文字を選択（反転）できれば実テキスト、選択できず画像ごと選ばれるなら画像です。
- ブラウザの翻訳機能を使う：自動翻訳をかけたとき、見出しが翻訳されなければ画像の可能性が高いです。
- 右クリック→「ページのソースを表示」：見出し部分が
<h1>テキスト</h1>なら実テキスト、<h1><img ...></h1>や<img>だけなら画像です。
ひとつでも当てはまったら、改善の余地があります。
よくあるご質問
Q. 見出しを画像にすると、必ず検索順位が下がるのですか？
必ず下がるとは限りませんが、見出しのキーワードが評価されないため、本来得られるはずの評価を取りこぼします。とくに競合の多い分野では、見出しの実テキスト化は基礎体力として重要です。
Q. altを入れれば、画像のままでも問題ないですか？
altを入れれば「及第点」にはなりますが、実テキストより評価は一段弱くなります。重要な見出しは実テキスト化し、補助的な画像にはaltを付ける、という使い分けが理想です。
Q. デザインされた書体の見た目が好きで、テキストにすると味気なくなりませんか？
CSSでフォント・色・太さ・英語サブ見出しまで再現でき、見た目はかなり近づけられます。元のデザイン書体と完全に同一にはなりませんが、SEOとアクセシビリティの効果を踏まえると、実テキスト化のメリットが上回るケースがほとんどです。
Q. 構造化データは、自社で実装できますか？
内容がそろっていれば実装可能ですが、要件を満たさないとエラーで認識されません。とくにJobPostingなどは必須項目や有効期限の管理が必要なため、専門家に確認しながら進めると安心です。
Q. 既存サイトを大きく作り替えずに改善できますか？
多くの場合、テンプレート（テーマ）の見出し部分を実テキストに置き換え、CSSで見た目を整えるだけで対応できます。デザインや構成を全面的に作り直さなくても、見出し・H1・構造化データの改善は段階的に進められます。
まとめ
ホームページの見出しを画像にすると、見た目は整っても検索エンジンにはページの主題が伝わらず、SEOで損をします。要点は次の3つです。
- 見出しは実テキスト＋CSSでつくる。画像を残すならaltに文言を入れる
- H1はページごとに1つ、ページのテーマと地域・事業を表す言葉にする
- 見出し改善とあわせて、構造化データと読み手目線のコンテンツで流入と問い合わせを強化する
まずは自社サイトの見出しが「テキストか画像か」を確認することから始めてみてください。
■ お問い合わせ
ホームページのSEO改善・リニューアルのことなら、製造業専門のテックオーシャンにお任せください。「自社サイトが検索に強い作りになっているか診断してほしい」といったご相談から、構造化データの実装、コンテンツ設計まで対応します。お問い合わせはこちら →
受付時間：平日 9:00〜18:00
【この記事の著者】
堀江祐介（テックオーシャン株式会社 代表取締役）
製造業に特化したWebマーケティング支援・ホームページ制作・SEO対策・AI活用支援を手がける。金属加工・金型・表面処理など、ものづくり企業のWebサイト改善とSEO最適化に携わる。
【参考文献】
1. Google検索セントラル「検索エンジン最適化（SEO）スターターガイド」 https://developers.google.com/search/docs/fundamentals/seo-starter-guide
2. Google検索セントラル「画像SEOのベストプラクティス」 https://developers.google.com/search/docs/appearance/google-images
3. Google検索セントラル「構造化データの仕組み」 https://developers.google.com/search/docs/appearance/structured-data/intro-structured-data
【関連コラム】
- ※（公開後）製造業サイトで問い合わせを増やすコンテンツ設計
- ※（公開後）Googleしごと検索に載せるJobPosting構造化データ入門
- コラム一覧はこちら