チャットアプリでアスキーアートが崩れる理由と直し方

パソコンではきれいに見えたアスキーアートも、チャットアプリで送ると崩れることがよくあります。理由は2つです。チャットのフォントが等幅ではないことと、吹き出しが狭いことです。

なぜ行がずれるの？

アスキーアートは、すべての文字が同じ幅であることを前提にしています。チャットアプリは読みやすさを重視したフォントを使っていて、スペース・i・l・. は狭く、W・M・@ は広くなります。

等幅フォント        チャットのフォント
|  HAPPY  |         | HAPPY |
|_________|         |_________|

上の行はスペースが多く、下の行はアンダースコアが多いので、同じ文字数でも2つの行の長さが変わってしまいます。スペースで位置を決めている絵ほど、崩れが目立ちます。

スマホでは、吹き出しは画面の一部しか使いません。行が吹き出しより長いと残りが次の行に折り返され、絵全体が崩れます。文字サイズを大きくしている人には、さらに崩れて見えます。

メッセンジャーによっては、文字を等幅フォントで表示できます。

アプリ	方法
WhatsApp	文字の前後にバッククォートを3つ（```）付ける
Telegram	前後にバッククォートを3つ付けるか、書式メニューで「等幅」を選ぶ
Slack	前後にバッククォートを3つ付けてコードブロックにする
Discord	前後にバッククォートを3つ付ける（詳しく）

これで行がそろいやすくなりますが、対応していない記号は代わりのフォントで表示されることがあります。吹き出しが広くなるわけではないので、スマホでは長い行がやはり折り返されることがあります。LINE のように等幅で表示する機能がないアプリでは、下の2〜4の方法を使ってください。

lab.ascii のフォントカードには、結果が何列になるかが表示されます。スマホでは Small・Mini・Small Slant・Digital に**「狭い画面向け」**の印が付きます。同じ単語でも、フォントによって幅が2倍違うこともあります。

長い文字は2通のメッセージに分けて送りましょう。

1行の顔文字には、そろえる行がありません。ただし、アプリのフォントや記号の対応によって見た目が変わることはあります。

ʕ•ᴥ•ʔ   (づ｡◕‿‿◕｡)づ   \(^o^)/   (╯°□°)╯︵ ┻━┻

テキストアートのギャラリーでは、テキストをコピーするか、カードの「PNG 保存」ボタンを使ってください。プレーンテキストにはフォントの設定が含まれませんが、PNG ならプレビューの色と行間の比率が保たれます。

複数行のバナーや変換した写真は、アプリが別のフォントを使ったり長い行を折り返したりすると形が変わります。PNG ボタンを使えば、受け取るアプリのフォントに関係なく、文字の形と配置を画像のまま残せます。それでもアプリが画像を縮小したり圧縮したりすることはあります。

ファイルの共有に対応した端末では、共有ボタンで結果をいったん保存せずに PNG ファイルとして送れます。対応していない端末では文字とリンクが共有されることがあるので、画像で送りたいときは PNG を保存して添付してください。

いちばん確実なのは、まず自分あてに送ってみることです。ほとんどのアプリには、自分だけのトークやメモのチャットがあります。自分のスマホでうまく見えても、相手は端末や文字サイズが違うかもしれないので、大事なメッセージには PNG を選びましょう。

パソコン版のチャットアプリは吹き出しが広いですが、パソコンでのプレビューからはスマホでの見え方はわかりません。

lab.ascii ではハングルのバナーも作れます。ハングルを入力すると、自動でハングルモードに切り替わります。