Text/Clean

WebページやHTMLソースをプレーンテキストに変換する

HTMLソースからタグを削除し、段落と改行を活かしてプレーンテキストを得る方法。script・styleの削除、& などのエンティティ、表のタブ化、画面コピーとの違いを解説。

ブログエディターのHTML表示、メールテンプレート、CMSのエクスポートファイルのように、手元にHTMLソースしかないときに本文の文字だけを取り出したい場合があります。タグを手で消していくと、& のようなエンティティやスクリプトのコードが残りがちです。

基本のパイプライン

標準レシピは次の順番です。

  1. HTMLタグを削除 — タグを削除し、ブロックの境界を改行に、エンティティを文字に変えます。
  2. 見えない文字・引用符の整理 —   から変わったNBSP(U+00A0)とカーリー引用符を通常の文字に整理します。
  3. 前後の空白を削除 — ソースのインデントのせいで行頭に残った空白を削除します。
  4. 空行を削除 — 「連続する空行を1行に」で段落間の余白を1行にそろえます。
  5. 連続する空白・タブを整理 — 行内の連続する空白を1文字にまとめます。
レシピHTML → プレーンテキスト
  1. HTMLタグを削除
  2. 見えない文字・引用符の整理
  3. 前後の空白を削除
  4. 空行を削除
  5. 連続する空白・タブを整理
このレシピでツールを開く

タグの削除が処理するもの

  • コメントと実行コード: <!-- --> コメントと、<script>、<style>、<noscript>、<template> 要素は中身まで削除します。タグだけを消すと、JavaScript や CSS のコードが本文のように残ってしまうためです。
  • ブロックタグと改行: 「ブロックタグ・<br> を改行に」がオンなら、<br> と、p、div、h1〜h6、li、tr のようなブロック要素の境界で改行します。開始タグと終了タグの両方が改行になるため空行ができますが、3行以上続く改行は2行に減らします。
  • 表: セルの終わり(</td>、</th>)はタブに変えます。結果をスプレッドシートに貼り付けると列が分かれます。
  • エンティティ: 「&amp; などのエンティティを解釈」がオンなら、&amp; &lt; &gt; &quot; &nbsp; &hellip; のようなよく使う名前付きエンティティと、&#39; &#x27; のような数値エンティティを実際の文字に変換します。ツールが知らない名前付きエンティティは原文のまま残します。
<h2>お知らせ</h2>
<p>今週のメンテナンス&nbsp;予定です。<br>お問い合わせはQ&amp;A掲示板へ。</p>
<ul><li>月: サーバー</li><li>水: DB</li></ul>
<script>track();</script>

上のソースは次のように整理されます。

お知らせ

今週のメンテナンス 予定です。
お問い合わせはQ&A掲示板へ。

月: サーバー

水: DB

&nbsp; は通常の空白になって残ります。日本語の文中に不要な空白なら、後ろに「検索と置換」を追加して削除してください。リストの項目の間に空行が残るのが嫌なら、連続する空行の整理の代わりに「空行をすべて削除」を選んでください。ただしこの場合、段落の間の空行も一緒に消えます。

表の構造を活かしたいなら

レシピの最後のステップ「連続する空白・タブを整理」は、既定で「タブも空白にまとめる」がオンになっているため、表のタブを空白に変えてしまいます。「前後の空白を削除」も行の前後のタブを削除します。表をタブ区切りのデータとして使うなら、「連続する空白・タブを整理」の「タブも空白にまとめる」をオフにし、前後の空白を削除するステップはオフにしてください。

ブラウザの画面コピーとの違い

Webページを画面上でドラッグしてコピーするのと、HTMLソースをこのツールで整理するのとでは、結果が異なります。

  • このツールは CSS を解釈しません。display:none で非表示にされた要素の文字も結果に残ります。
  • 画像の代替テキスト(alt)やリンクのアドレス(href)はタグと一緒に消えます。リンクのアドレスが必要なら、タグを削除する前にソースで別途確認してください。
  • HTMLソースの中で長い文を複数行に分けて書いていた場合、その改行はそのまま残ります。この場合は、段落内の行をつなぐ PDFコピーの改行を復元 を後ろに追加すると役に立ちます。
  • <span> のようなブロックでない要素の境界には改行も空白も入れないので、ソースで空白なしに隣り合っていた要素は文字がくっついて出てきます。

メールテンプレートの隠れた文字

ニュースレターのHTMLには、受信トレイのプレビュー文を調整するために &zwnj; や &#8203; のような見えない文字が何十個も入っていることがあります。タグの削除はこれらのエンティティをゼロ幅非接合子(U+200C)とゼロ幅スペース(U+200B)に変え、レシピの2番目のステップがそれを削除します。「見えない文字・引用符の整理」のステップをオフにするとこれらの文字が結果に残り、見た目は問題のないテキストが検索や比較で食い違うことがあります。

リストの項目の前に箇条書き記号を付け直したいなら、レシピの後ろに「行の前後に文字を付ける」を追加し、先頭に - を入れてください。ただしすべての行に付くので、見出しと段落が混ざった結果には向きません。

注意

  • タグは、< の後に英字が続き > で閉じる形を基準に削除します。属性値の中に > が含まれるまれなソースでは、一部が残ることがあります。
  • エンティティはタグを削除した後に解釈するので、ソースの &lt;b&gt; はタグとして処理されず、<b> という文字として残ります。意図した動作です。

チェックリスト

  • ソース全体を貼り付けて、まずレシピを適用してみる。
  • 表を使うなら、タブを削除するステップをオフにする。
  • リンクのアドレスが必要なら、タグを削除する前に確保しておく。

最終更新: 2026-09-23