guide·pdfty チーム··16 分で読めます

PDFをHTMLに変換する方法(きれいなWebページにする)

PDFをきれいなHTMLページにする方法:テキストと画像を抽出して組み直す、pdftohtmlやCalibreを使う、あるいは埋め込む。変換で何が生き残るかを正直に解説します。

PDFファイルをきれいなHTMLのWebページに変換
PDF → HTML:変換の旅で実際に生き残るもの

PDFをHTMLに変換したいなら、最初に正直なニュースを:任意のPDFをきれいでレスポンシブなHTMLに自動変換できるツールは存在しません。PDFは印刷フォーマットです — 「このグリフをx=142、y=380に置け」を保存するのであって、「これは見出しだ」を保存するのではありません。HTMLはその正反対です。すべての変換は2つの哲学の間の翻訳であり、必ず何かが失われます。

とはいえ、難しいわけではありません。本当に必要なもの — きれいなマークアップ、手早い一回きりの出力、とにかく文書をWebページに載せること — に合わせて方法を選べばいいのです。ここでは3つの方法すべてと、変換しないという選択肢を紹介します。

そもそもなぜPDFをWebページにするのか

繰り返し挙がる理由は3つです:

  • SEO。検索エンジンはPDFもインデックスしますが、本物のHTMLページのほうがはるかに上位に表示されます:HTMLには構造(見出し、リンク、altテキスト)があり、読み込みが速く、モバイルでも機能します。PDFに埋もれたコンテンツは、ほとんどの検索者に見つけてもらえないコンテンツです。
  • アクセシビリティ。スクリーンリーダーは、平均的なタグなしPDFよりもセマンティックなHTMLをはるかにうまく読み上げます。全員に届くべき文書なら、アクセシブルな形式はHTMLです。
  • ユーザー体験。モバイルでのPDFリンクは、ダウンロード → 別アプリで開く → 固定A4レイアウトをピンチズーム、を意味します。HTMLページなら、ただ読めます。

方法1 — 抽出して再構築(最もきれいなマークアップ)

本当に大切なコンテンツ — サイトに載せるレポート、ガイド、ドキュメント — には、この方法があらゆる自動変換ツールに勝ります。PDFから素材を取り出し、そのまわりのシンプルなHTMLを自分で書くのです。

1

テキストを取り出す

PDFをテキスト抽出 にドロップします。全テキストコンテンツが手に入ります。20 MB・50ページまで無料、登録不要です。

Drop PDF here
2

画像を取り出す

同じPDFを画像抽出 にかけます — 埋め込まれた画像がすべて元の解像度で個別ファイルとして出てきます。imgタグに使う準備は完了です。

▾WebPrintPrepress
3

構造をマークアップする

テキストをエディタに貼り付け、PDFには存在しなかったセマンティクスを加えます:セクションタイトルにはh2、段落にはp、リストにはul、必要ならtable。ここが手作業パートです — 10ページの文書で通常15〜30分です。

Compressing…69%~2 seconds remaining
4

画像を戻す

図が入るべき場所に、実のあるaltテキスト付きのimgタグを追加します。ついでに画像をWeb用に圧縮しておきましょう。

contract_draft.pdfDownload
5

公開する

結果は手作り品質のHTML:レスポンシブで、アクセシブルで、インデックス可能 — 自動変換ツールでは何ひとつ得られない性質です。

All done — file readyAuto-deleted in 1 hour

はい、手作業です。しかし出力は本当に保守したくなるHTMLであり、実際の読者に届けるものなら、その交換条件には価値があります。

方法2 — pdftohtmlとCalibre(コマンドライン派向け)

自動化したい、そして多少乱れた出力でも我慢できるなら:

pdftohtml(Popplerユーティリティの一部。Linux/Macならプリインストールか、パッケージ1つで導入可能):

pdftohtml -s -noframes document.pdf output.html

-sフラグは1ページ1ファイルではなく、連続した1つのHTML文書を出力します。-cフラグは「複雑モード」を追加し、絶対配置のdivでレイアウトを再現します — 見た目はPDFに近づきますが、そのマークアップは表示以外の用途には使い物にならず、モバイルでは完全に崩壊します。

Calibre(無料、クロスプラットフォーム)はPDFを電子書籍として扱います:Calibreを開く → PDFを追加 → 変換 → HTMLZ出力を選択。1段組でテキスト中心のPDFに最適で、多段組レイアウトは苦手 — 読む順序を間違えることがよくあります。

有料変換ツール(Adobe Acrobat ProのHTML書き出し、月額$6〜20の各種オンラインサービス)は表の処理が上手く、書式もより多く保持しますが、出力はやはり機械生成のマークアップ — 数百のインラインスタイルと入れ子のspanです。今日中にコンテンツをオンラインに載せたいだけなら十分。今後編集するつもりなら苦痛です。

方法3 — 変換しない:PDFを埋め込むかリンクする

「このPDFをどうやってWebサイトに載せるか」への正しい答えが、PDFをそのままWebサイトに載せることである場合もあります:

<embed src="/files/report.pdf" type="application/pdf" width="100%" height="800px" />

あるいはサイズを添えた素朴なリンクでも: <a href="/files/report.pdf">年次報告書(PDF、2.4 MB)</a>

欠点:埋め込みPDFは依然としてSEOに弱く、スマホでは扱いにくいままです。よくある折衷案は両方載せること — 重要な内容のHTML要約をページに置き、その下に完全版PDFへのリンクを添えます。

あなたのケースにはどの方法?

状況最適な方法理由
サイトに長期掲載するコンテンツ抽出+再構築きれい、レスポンシブ、編集可能、インデックス可能
一回きり・社内用・誰も編集しないpdftohtml / Calibre速くて無料。乱れは問題にならない
200本のPDFをまとめてオンライン化pdftohtmlをスクリプト化その規模で自動化できる唯一の選択肢
固定レイアウトが本質(フォーム、証明書)PDFを埋め込むかリンク変換しても悪くなる一方
スキャンPDF(ページの画像)先にOCR、その後再構築OCRが走るまで抽出できるテキストレイヤーがない
目的がSEO抽出+再構築検索エンジンが評価するのは構造化HTMLで、配置されたdivではない

正直な期待値:生き残るもの・消えるもの

どの方法を選ぶにせよ、期待値を調整しておきましょう:

  • プレーンテキスト:どこでも生き残ります。これが簡単な90%です。
  • フォント:Webフォントを手動で追加しない限り、たいていWebセーフフォントかシステムフォントに置き換わります。
  • 多段組レイアウト:古典的な失敗ポイント。変換ツールは段組を1本の混乱した流れに潰すか、絶対配置で凍結するかのどちらかです。
  • 表:当たり外れあり。単純なグリッドはよく変換されますが、結合セルや入れ子の表はほぼ無理です。
  • ヘッダー、フッター、ページ番号:「ページ」ごとに繰り返されるゴミテキストとして付いてきます — 手作業で削除することになります。
  • インタラクティブなフォームフィールド:どの変換ツールでも生き残りません。HTMLフォームとして作り直しましょう。

逆方向 — Webページがあって、そのPDFが欲しい — なら、それははるかによく解決された問題です。HTMLからPDFへの変換ツールを使いましょう。

約90%
どの変換方法でも生き残るプレーンテキストの割合
15〜30分
一般的な10ページのPDFをきれいなHTMLに手作業で再構築する時間
$0
pdfty+手元のエディタでの抽出・再構築の費用
1時間
pdftyがファイルをサーバーから削除するまで

よくある質問

本当に無料のPDF→HTML変換ツールはオンラインにありますか?

無料の自動変換ツールは存在しますが、出力は機械生成のマークアップ — 配置されたdivとインラインスタイルです。きれいなHTMLへの正真正銘無料のルートは、pdftyでテキストと画像を抽出し(20 MBまで無料、1日10回、登録不要)、マークアップを自分で書くことです。

PDFがスキャンで、抽出しても何も出てきません。なぜ?

スキャンPDFはページの写真であり、内部にテキストレイヤーがありません。先にOCRをかけましょう。その後はテキスト抽出が普通に機能します。OCRなしでは、存在しないテキストを見つけられる変換ツールは地球上にありません。

PDF内のハイパーリンクは変換後も残りますか?

pdftohtmlはほとんどのリンク注釈をaタグとして保持します。抽出・再構築ワークフローでは、プレーンテキスト抽出でリンクが落ちます — マークアップの際に重要なURLをPDFから手動でコピーしてください。

画像をフル品質で取り出すには?

画像抽出 を使いましょう — ページのスクリーンショットではなく、埋め込まれた原本を取り出すため、PDFに実際に保存されていた解像度が得られます。公開前にWeb用に圧縮しましょう。

GoogleはそもそもPDFをインデックスしますか?

はい — GoogleはPDFをインデックスし、順位も付けます。しかし同じ内容のHTMLページのほうが一貫して上回ります:より良いモバイル体験、速い読み込み、本物の見出し構造、内部リンク、そのすべてがランキングに効きます。検索で見つけてほしいコンテンツなら、HTMLとして公開しましょう。

WordでPDFをHTMLにできますか?

一応。Wordは多くのPDFを開き(ファイル → 開く)、編集可能な文書にリフローし、名前を付けて保存 → Webページができます。ただし出力されるHTMLは悪名高いほど肥大しています — 出発点としては使えても、本番用マークアップにはなりません。

HTMLではなくPDF→Markdownはどうですか?

多くの場合、より賢い選択です。テキストを抽出し、Markdownの見出しやリスト記法を加え(タグより速く打てます)、サイトジェネレーターにHTMLを生成させましょう。方法1と同じワークフローで、タイプ量が減ります。

PDFの埋め込みはアクセシビリティに悪いですか?

たいてい、はい。ブラウザのPDFビューア内でのスクリーンリーダー対応は一貫性がなく、タグなしPDFはどこでも読み上げが不十分です。アクセシビリティが重要なら、コンテンツを本物のHTMLとして提供しましょう — 埋め込みの横に簡易版を置くだけでも違います。

pdfty チーム

pdfty チームはプライバシー重視のオンライン PDF ツール(圧縮・変換・OCR・署名・保護)を開発しています。ファイルは 1 時間以内に削除されます。 私たちについて →

関連記事