ちいつる
A-14リファレンス

QR/バーコード生成アルゴリズム

符号化・誤り訂正の仕組みから、読み取り精度を上げる設計まで。

触ってみる好きな文字を入れてみてください

サーバーへは送信されません。誤り訂正符号のぶん、文字数が増えるほど模様が密になります。

1文字打つごとに模様が変わる。これは画像ではなく、そのつど誤り訂正符号ごと計算し直しているから——この記事はその仕組みを扱う。

QRコードの符号化と誤り訂正の仕組み

QRコードはデータをそのまま白黒パターンにするのではなく、リード・ソロモン符号という誤り訂正符号を付加してから配置する。これにより、コードの一部が汚れたり破れたりしても、欠けた分を計算で復元して読み取れる。誤り訂正のレベルは4段階あり、レベルを上げるほど破損への耐性は増すが、同じデータ量に対してコードが大きくなる。

触ってみるQRコードを指でなぞって汚し、レベルを切り替えてみてください
誤り訂正レベル
25×25モジュール / 破損 0.0%復元可能の目安内(レベルMは約15%まで)

レベルLでは少しの汚れで限界を超えるのに、Hなら3割近く塗りつぶしても復元の目安内に収まる。代わりにHはモジュール数が増える——「耐性とサイズのトレードオフ」が本文の4段階の意味になる。

触ってみる各行のマスをタップして「欠損」させ、パリティで戻るか試してください
無傷
無傷
無傷
無傷

各行末(枠が太いマス)がパリティ = 行内の全データのXOR。1マスの欠損なら残りのXORで必ず取り戻せる。

パリティ1個は、行のマスをすべてXORしただけの符号にすぎない。それでも1マス欠けた程度なら、残りを突き合わせて必ず元が割り出せる。検査記号を増やして複数マスの誤りまで正せるよう広げたものがリード・ソロモンで、冗長さで欠けを埋め直す発想はどちらも変わらない。

触ってみる8つのマスクを切り替え、ペナルティが最小になるものを探してください

選択中マスク #0 のペナルティ(規則1: 同色5連の評価)= 141(最小は #7113。QRは自動でそれを選ぶ)

同じデータでも、選ぶマスク次第で黒白の散らばり方はこれだけ変わる。QRは8種すべてを試し、ペナルティが最小の一枚を選んで焼き込む。並べて終わりの単純作業に見えて、その裏では読みやすさを競わせる審査がひそかに走っている。

バーコード規格ごとの違い

JANコード(EAN-13)は数字のみ13桁で、商品識別用として小売店で広く使われる。CODE128は英数字・記号を扱え、物流・在庫管理で使われる。QRコードは2次元でデータ容量が桁違いに大きく、URLのような長い文字列も収められる。「何を」「どれだけの情報量で」表したいかで規格を選ぶ。

触ってみる12桁を書き換えたり、改変ボタンで検証実験をしてみてください

奇数桁の和 = 24 / 偶数桁の和 × 3 = 34×3 = 102

合計 126 → 10の倍数まであと 4 ← これがチェックディジット

4901234567894

1桁の書き換えは必ず検出できる一方、隣接2桁の入れ替えは差が5の組み合わせ(例: 27→72)だとすり抜けます。何度か試して「見抜けない例」を探してみてください。

JANコードの13桁目は「データ」ではなく検算用の数字。レジの読み取りミスを桁の計算だけで見抜く仕組みで、QRの誤り訂正のいちばん素朴なご先祖にあたる。

触ってみる数字だけ・英大文字だけ・小文字混在で、必要ビット数の変化を見てください

数字モード

3桁=10bit

英数字モード

2文字=11bit

バイトモード

1バイト=8bit

判定モード: 英数字 / 8文字(8バイト)

データ本体 = 44 ビット

もしバイトモードなら 64 ビット 20ビット節約

数字だけ・英大文字だけなら専用モードで詰められる。小文字や日本語を混ぜた瞬間バイトモードに落ち、必要ビットが跳ね上がります。

何を表すかによって、必要な情報量は変わる。数字専用・英数字専用のモードは3桁=10ビットのように高密度で詰め、対象外の文字が混じった瞬間バイトモードへ落ちる。規格選びとは、この情報量の見積もりそのもの。

生成ライブラリの選定基準

ブラウザ内で完結させたい場合、サーバーへのデータ送信なしにQR・バーコードを生成できる軽量なライブラリを選ぶのが望ましい。生成ロジックが規格に忠実であること(誤り訂正レベルを選べること)と、SVG/Canvasどちらの出力形式に対応しているか(印刷用途ならSVGが有利)を基準に選ぶ。

触ってみるスライダーで拡大し、左右(SVGとラスター)の輪郭を見比べてください
ベクター (SVG)
ラスター (PNG相当)

SVGは座標データなので何倍にしても輪郭が鋭いまま。ラスターは画素の集まりなので、引き伸ばすほど輪郭がぼやける——印刷用途でSVGが有利な理由です。

なぜ印刷にはSVGが向くのか。拡大するとラスターは画素が粗くにじみ、SVGは何倍でも輪郭が鋭いまま保たれる。大きく刷るほど、この差は容赦なく開く。ポスターや缶バッジを想定するなら「SVG出力に対応しているか」は外せない。

触ってみる桁数スライダーと訂正レベルで、バージョン(サイズ)の段差を確かめてください
バージョン225 × 25 モジュール
誤り訂正

桁を増やすとバージョンが1→2→3…と段階的に上がり、同じ桁数でも訂正レベルをL→Hに上げると必要サイズが増える。「情報量」と「耐性」の両方がサイズを押し上げます。

データが増えればバージョンは段階的に上がり、同じ量でも訂正レベルを一段上げれば、コードはさらに大きくなる。この容量とサイズの対応表を狂いなく引けるかどうか——ライブラリが規格に忠実かを測る、地味だが確かな物差し。

読み取り精度を上げる設計

QRコードは周囲に一定の余白(クワイエットゾーン)がないと読み取り機が認識できない。印刷する際は最小サイズの目安(一般的なスマホカメラなら2cm四方以上)を守り、コードの色は背景とのコントラストを十分に確保する(薄い色同士の組み合わせは避ける)。

触ってみる余白スライダーを動かし、右のカメラ像で境界が溶ける瞬間を探してください
実物(そこに在るもの)
読み取り機のカメラ越し

余白4 ≥ 推奨4 — カメラ像でも白い枠が残り、四隅を検出できる

左の実物には確かに白い縁がある。でもカメラは解像度が有限でわずかにボケる。余白が薄いと、その白線がぼけて周囲の暗い模様と混ざり、「どこまでがコードか」を機械が決められなくなる。仕様が4モジュール以上を求めるのはこのため。

左の実物にはちゃんと白い縁がある。それでもカメラ越しの右では、余白を削るほど白線がぼやけて周囲の暗い模様に溶けていく。読み取り機が四隅を掴めるのは、この白枠がぼけに耐えて残っている間だけ。クワイエットゾーンは飾りではなく、コードの輪郭を機械に伝えるための白い宣言だ。

触ってみる前景と背景の明度を近づけ、右の復元像に青い取り違えが現れるまで動かしてください
実際の見た目
機械が復元した像(青=取り違え)
コントラスト比 15.1:1取り違え0モジュール — 機械はコードを正しく復元できる

読み取り機はカメラ画像を明暗の2値に切り分ける。前景と背景の明度が離れていれば中点は余裕をもって引けるが、近づけるとカメラのわずかなノイズが暗明の判定を跨いでしまい、右の復元像に青い取り違えが散り始める。薄い色同士を避けるのは、この余裕を残すため(比はWCAG式)。

前景と背景の明度が離れているうちは、右の復元像は実物とぴたり一致する。ところが両者を近づけていくと、カメラのわずかなノイズが暗明の判定を跨ぎ、取り違えた青いマスが像を蝕みはじめる。「薄い色同士を避ける」という指針は、比の数値というより、機械の目に映る像を崩さないための余裕を残せということ。

次はこれ