空白文字ビジュアライザーとは?

Whitespace Visualizerは、テキスト中の不可視文字を可視化するツールです。スペース、タブ、改行、キャリッジリターン、ノーブレークスペース、ゼロ幅文字にそれぞれ色分けされたマーカーが付くため、フォーマットのバグやインデントの不一致、データファイル中の不要な文字をすぐに見つけられます。

空白文字ごとに色が違います。半角スペースはオレンジの点、タブは矢印、改行はピルクロウ記号、ゼロ幅文字は斜線入りの丸として表示されます。種類ごとにカウントが出るので、ファイルがタブとスペースのどちらを使っているか、両方混じっているか、パーサーを壊す目に見えない文字が紛れていないかを一目で確認できます。 さらに、通常のエディタが完全に隠してしまう拡張不可視文字——ソフトハイフン、ワードジョイナー、左から右・右から左の方向マーク、全角・半角スペース——も検出します。

使い方

  1. ステップ1 — テキストを入力エリアに貼り付けるか入力します。空白文字は即座に色分けされたマーカーでハイライトされます。
  2. ステップ2 — ハイライトする空白文字の種類を切り替えます:スペース、タブ、改行、キャリッジリターン、ノーブレークスペース、ゼロ幅文字に加え、ソフトハイフン、ワードジョイナー、方向マーク、全角・半角スペースといった拡張不可視文字も対象です。タブ幅を 2・4・8 列から選び、行番号の表示をエディタに合わせて切り替えられます。
  3. ステップ3 — 各空白文字のカウントを表示する統計情報を確認し、必要に応じて注釈付きテキストをコピーします。

使用するタイミング

  • CSV や TSV が pandas や Excel で正しく読めない原因を探すとき。
  • 厳しい lint のリポジトリにコミットする前に、貼り付けたコードでタブと空白の混在を確認するとき。
  • 翻訳された UI 文字列に紛れ込んだゼロ幅結合子や BOM を見つけるとき。

結果

CSVファイルの解析が失敗します。数行をビジュアライザに貼り付けると、区切り文字としてタブとスペースが混在していること、さらにヘッダー行に隠れたゼロ幅スペースがあり最初の列名が一致しない原因になっていることが判明します。

よくある質問

ゼロ幅文字とは何で、なぜ問題を起こすのですか?
U+200B(ゼロ幅スペース)や U+FEFF(BOM)などは見た目の幅はゼロですがバイトとしては存在します。Word、コピーした PDF、シェルからのエクスポートで紛れ込みやすく、文字列比較がありえない形で失敗する原因になります。
ファイルのインデントがタブか空白かを見分けるには?
ファイルを貼り付けてカウント欄を見ます。Tabs が 0 で Spaces が多ければスペースインデント、逆ならタブインデントです。両方ともゼロでない場合は混在で、特に Python や Makefile では大抵バグの原因になります。
アラビア語や中国語のような非ラテン文字でも動きますか?
動きます。Unicode コードポイント単位で走査するので、アラビア語、CJK、絵文字を正しく扱えます。非ラテン文字は普通に表示され、書記体系に関係なく空白だけがマーカーに置き換わります。
普通の空白とノンブレーキングスペースの違いは?
普通の空白(U+0020)はブラウザがそこで改行できる位置です。ノンブレーキング(U+00A0)は改行を拒否し、二つの語をくっつけたままにします。Word や PDF からのコピーで混入しやすく、見た目は同じでも検索や split、trim で問題を起こします。
注釈付きのテキストを書き出したりコピーできますか?
できます。コピーボタンを押すとマーカー入りのテキストがクリップボードに入るので、コードレビューやバグ報告で「ここの空白が問題」と正確に伝えるのに使えます。

関連ツール