PDF を HTML に：書き出しの見え方を気にする人向けの変換
「PDF HTML 変換」と聞くと一発変換を想像しがちですが、大事なのは何と引き換えるかを知ることです。ここではWordのように編集可能な本文を抽出するのではなく、各ページの見た目を1つのHTMLに詰め込みます。オフラインで開く、メールに添付する、画像ファイルを別管理せず静的ホストに置く、といった用途向けです。範囲は狭く、制限も正直に示します。長文のようにリフローする文字ではありませんが、見えているレイアウトがそのまま届くレイアウトです。
「添付は1つ、見え方はPDFのまま」という要件のとき
Mozilla pdf.jsでブラウザ内にページを描画し、canvasに書き込んだピクセルをdata URLとして埋め込みます。マークアップの壁を吐き出す汎用の「pdf から html コンバータ」に疲れた方には逆の発想です。意外を減らし、ファイルサイズを握りやすくします。ここでの変換は「いったんピクセルに落としてから包む」に近く、脚注や図、特殊フォントもPDFに近い見え方を保ちやすいです。主にページを見せたい読者向けで、編集が主目的ではありません。
処理はすべてローカルに留まるため、機微な資料もアップロードせず試行錯誤できます。代償はファイルサイズです。Base64は膨らみやすいので、長い文書では解像度やページ数の上限を検討してください。準備ができたら単一の.htmlをダウンロードするか、出力ビューを切り替えて生のdata URLだけをコピーし、後段のCMSで画像を分離ホストしたい場合にも対応できます。
変換ツールへ移動手に取れるラスター設定
書き出しパネルでレンダー倍率・最大幅・ページ上限・画像形式を変更します。プレビューがぼける、HTMLが重いと感じたら再レンダリング。最初の一発に縛られません。
判断しているページの横にHTML
左でページをめくりながら、右列にはドキュメント全体か生のsrcビューを表示します。微調整が効いたかがすぐ分かり、小さな変更のたびに闇雲にダウンロードしなくて済みます。
別アプリなしのページ単位の仕上げ
ページごとに幅・高さ・代替テキスト・任意のリンクを設定し、統一したいときは同じパターンを全体に適用できます。書き出し後にエディタでやる掃除を、同じ画面に寄せました。
このPDF HTML 変換がループから外れにくい理由
多くのツールはアップロードとダウンロードで終わります。ここでは変換過程を見せたままにし、推測ではなく出力を調整できます。
ブラックボックスではなく視覚的なつまみ
つまずきは初回ダウンロードで顔を出しがちです。1ページ目がぼける、見開きが欠ける、添付を躊躇するほど巨大なBase64、といった具合に。議論の対象になるラスターは左に固定し、右列にはコピーした瞬間にマシンから出ていくHTML、あるいは素のsrc行が並びます。レンダー倍率・最大幅・埋め込むページ数を変えると、別ファイルを取る前にサムネイルが応答します。CMSが素のdata URLだけ欲しいときはsrcのみ表示へ。1つのきれいな添付が欲しい規程なら完全なドキュメント枠のままに。現場で書き出しを検証するときの「届いたもの」と「意図したもの」の並べ方に近く、一方で最速の変換サイトは相変わらず「上げて変えて消える」を教えます。長いレポートには妥当なページ上限、PNGだらけのスキャンはWebPやJPEGへ、軽い位置合わせでスマホの縦読みも楽になります。追加インストールは不要でプレビューの隣にあります。送信前にもう一度目を通したいときは「HTMLをプレビュー」でトップページのPlaygroundに投げられます——任意ですが、ワンクリック系ではあまり見ません。
- PDFを調整しながらHTMLを確認
- 倍率や形式を変えたあと再レンダリング
- 当社サーバーへのアップロードなし
- PlaygroundでHTMLをプレビュー
HTMLをPDFに変換するには
逆のフローを探していた場合
検索では名前が似た別ページに着地しがちです。マークアップを固定レイアウトのファイルにしたいときは、/ja/html-to-pdf の「HTMLからPDF」ツールを使ってください。HTMLを貼り付けまたは読み込み、必要ならCSSを足し、プレビューを見てから書き出します。そちらは印刷余白やレイアウト固定向け。本ページのPDF HTML 変換は「PDFの各ページにまだ見える1つの持ち運べるファイルが欲しい」という問いに答えます。
正本がすでにPDFならこのページのまま
PDFを読み込み、ラスター設定を選び、矢印でページを素早く確認します。アクセシビリティが効く場所ではページごとに幅や代替テキストを調整し、ブロックを揃えたいなら全ページに適用してからHTMLをコピーまたはダウンロードします。
共有する前にプレビュー
余白やリンクをもう一度見たいときは「HTMLをプレビュー」でPlaygroundに開けます。タブが重いときは、まず埋め込むページ数か解像度を下げてください。大きなcanvasではよくあることです。
PDF HTML 変換：短い回答
PDF HTML 変換試す
左で読み込み、右で微調整と比較。
PDF HTML 変換
- pdf.jsラスターとページ上のコントロール
- PDFプレビューの横にHTML出力
- ページごとの幅・代替テキスト・リンク
- ブラウザ内ローカルで処理
非常に大きなPDFは遅くなることがあります。タブが重ければページ数か解像度を下げてください。
1つのHTML、複数ページ分の画像
画像を別途ホストせず、PDFの見た目を単一ファイルで持ち運びたいときに便利です。