UnicodeとUTF-8の関係を中心に「入力」から「表示」までのしくみを解説

「UTF-8って何？」「Unicodeって聞くけど、何がすごいの？」といった疑問や文字化けに困ったことはありませんか？

紹介するZenn本では、以下の疑問にやさしく答えていきます：

文字コードとは？
UnicodeとUTF-8の違いって？
パソコンの画面に文字が表示される仕組みは？
なぜWindowsでバックスラッシュが円マークに見えるの？
Pythonで作ったcsvファイルをExcelで読み込むと文字化けするのはなぜ？
ファイルの中身って何が書いてあるの？

具体的な文字列にまつわるハマりどころの事例を紹介します。紹介するZenn本↓で解決できます。

Unicodeを中心に「入力」から「表示」までのしくみ

パソコンでキー入力したら、どのような処理を経て画面に表示されるのかを解説します。この本を読めば、Unicode、UTF-8、フォント、IME、Pythonでエスケープ文字が原因で発生するエラー、文字化けの原因などが分かります。

Pythonで遭遇する文字列にまつわるエラー
UnicodeをUFT-8へエンコードするのはなぜか？
便利ツールHex Ediotr
日本語のURL表示が%になる原因
解決策

Pythonで遭遇する文字列にまつわるエラー

文字列に関係したよく起こるエラーです。

パスをコピーして変数に入れるとエラーになる

text_path="C:\User\test.txt"
print(text_path)

  Cell In[15], line 1
    text_path="C:\User\test.txt"
              ^
SyntaxError: (unicode error) 'unicodeescape' codec can't decode bytes in position 2-3: truncated \UXXXXXXXX escape

Pythonで作ったCSVがExcelで文字化けする

import pandas as pd
df = pd.DataFrame({'名前': ['山田', '田中'], '年齢': [30, 25]})
df.to_csv('output_pd.csv')

上記ファイルを無料のWeb版Excelにアップロードすると以下のように文字化けする

Webのコードをコピペするとバックスラッシュが円マークになる

例えばMCPサーバーのQuickStartの以下の部分をメモ帳にコピペするとバックスラッシュが円マークに代わってしまいます。

UnicodeをUFT-8へエンコードするのはなぜか？

Unicodeは「文字コードのルール（番号）」ですが、そのままメモリやファイルに保存するにはエンコード（符号化）が必要です。
そのエンコード方法の1つが UTF-8 です。

Unicode ひらがな・カタカナコード表を見ると「あ」は0x3042（0xは16進数の数値を表す接頭辞です）
メモ帳で「あ」と書いてファイルの中身を16進で表示してみると
UTF-8コード表(1)にあるようにe38182で保存されている。
つまり0x3042をe38182に変換することがエンコードであり、その変換ルールがUTF-8ということになります。
VsコードのHex Ediotrで表示したもの

便利ツールHex Ediotr

Hex EdiotrはVsコードの拡張機能です。ファイルの中身を16進で表示できます。

「Hex Editor」拡張機能のインストール方法

VS Code を開く: Visual Studio Code を起動します。
拡張機能ビューを開く: 左側のアクティビティバーにある「四角いアイコン」（Extensions / 拡張機能）をクリックするか、Ctrl+Shift+X (macOS: Cmd+Shift+X) を押します。
検索ボックスに「Hex Editor」と入力: 検索結果に「Hex Editor」が表示されます。通常、提供元が「Microsoft」となっているものが公式です。
インストール: 「Hex Editor」を選択し、「Install」ボタンをクリックしてインストールします。