静岡・浜松のWebマーケティング|株式会社シーエムエー

お問い合わせ

CMA BLOG

株式会社シーエムエー ホーム > CMA BLOG > ホームページ制作 > 「文字コード」って何?Webディレクターなら知っておきたいUnicode(ユニコード)のこと!

ホームページ制作 システム関連 「文字コード」って何?Webディレクターなら知っておきたいUnicode(ユニコード)のこと!

  • このエントリーをはてなブックマークに追加

こんにちは。制作部開発グループの山本です。

私たちが普段、PCやスマートフォンで見ている文字や記号・絵文字などは、
「文字コード」と呼ばれる仕組みを利用して表示しています。

今回は「文字コード」の基本と、
Webディレクターなら知っておきたいUnicode(ユニコード)についてもご紹介いたします。

文字コード

文字コードについて

文字コードとは、文字や記号・絵文字などをコンピュータが理解できる形に変換するための仕組みのことです。

コンピュータは「0と1のビットの組み合わせ」で構成された数値を用いて、
具体的な文字や記号・絵文字などに対応づけて表示します。

例えば「A,B,C,D,E」5種類の文字を符号化する例を考えてみます。


※実際のアルファベットの符号とは異なります。

文字を重複なく集め、各文字に0か1の符号の組み合わせを一意に定めたものを「符号化文字集合」と言います。
符号化文字集合は広く「文字コード」という名前で呼ばれております。

文字コードの進化

文字コードが使われ始めた頃は言語毎に専用の文字コードを使っており、
扱う言語を変えるたびに文字コードも切り替える必要がありました。

そこで、世界中の文字を一つにまとめることを目的に生まれたのが「Unicode(ユニコード)」です。

現在「Unicode」には13万文字が登録されており、各国の言語の他、
楔形文字(くさびがたもじ)やヒエログリフといった古代文字まで登録されています。

代表的な文字コードの種類

Unicode(ユニコード) 世界中の様々な言語や記号を統一的に扱うために開発された文字セットです。
UTF-8 Unicodeを表現する可変長文字エンコーディング方式で、主にWeb上で使用され、英語のテキストはASCIIと同じ表現を使用します。
UTF-16 Unicodeを表現する可変長文字エンコーディング方式で、プログラミング言語やファイル形式で広く使用されます。
ASCII(アスキー) 最初に広く使用された文字エンコーディング方式で、文字や記号・英数字など7ビットで表現します。
Shift JIS 日本語の文字エンコーディング方式で、漢字・ひらがな・カタカナ・記号を含み、主にWindowsや一部のウェブページで使用されます。

絵文字が表示される仕組み

絵文字はUnicodeと呼ばれる文字コードで定義されています。
各デバイスには絵文字フォルダがあり、文字コードに対応した絵文字を表示する仕組みとなります。
環境によって絵文字の見え方が異なるのは、絵文字フォルダに保存されてる画像データの違いによるものです。

環境による見え方の違い

SNSでメッセージのやり取りがより簡単になったことで、年々、絵文字の数が増えております。
普段使っている絵文字が、環境やプラットフォームによってどう見えるのかを比較してみました。

まとめ

いかがでしたでしょうか。

笑顔の絵文字だけでも、環境に応じて様々なバリエーションがあることに驚きました。

文字コードはプログラミングだけでなく、日常のコミュニケーションにおいても欠かせない役割を果たしています。
今後も適切な文字コードを理解し、新しい表現方法に対応していきたいと思います。

  • このエントリーをはてなブックマークに追加

人気の記事ランキング

  • posted on 2023/02/082023年度版 Google PageSpeed Insights(ページスピードインサイト)を使って読み込み速度を改善したら、何点になるのかチャレンジしてみた

  • posted on 2023/12/07迫る、浜松市の行政区再編(中央区、浜名区)。住所変更だけじゃない。Webサイトで必要な対応とは?

  • posted on 2020/06/10ノンデザイナーのためのデザイン基本ルール ~文字編 文字詰め~

  • posted on 2024/02/22「文字コード」って何?Webディレクターなら知っておきたいUnicode(ユニコード)のこと!

  • posted on 2022/10/21DockerでPHP環境を簡単に構築してみよう

おすすめタグ

ECサイト 動画 HTML レクリエーション 創業記念日 ASP SSL PageSpeed Insights スピードアップデート 動画広告 ECcube wordpress 構造化マークアップ カスタマイズ Transport Layer Security 保護されていない通信 HowTo Chrome TLS クリック率 ハウツー ノンデザイナー リッチリザルト Instagram広告 文字 デザイン フォント Core Web Vitals 自作PC 初心者 構造化データ Facebook広告 リモート iPhone CSS 動画制作 AMP 広告 HTML5広告 Google Chrome videoタグ GoogleMapsPlatform Zapier Facebook Audience Network Google my map ワイヤーフレーム Google for jobs Googleしごと検索 撮影 iPad 一眼レフカメラ 写真 自作パソコン ウェブサイト翻訳 Adobe XD PC組み立て XMLサイトマップ PHP タスクランナー gulp.js node.js WebP画像 楽天GOLD スマートフォン用新店舗トップページ Threads(スレッズ) Instagram Adobe Firefly 画像生成AI アセット生成 生成塗りつぶし Adobe MAX Japan 2023 UI UX Adobe Stock アンチックフォント Adobe Express Webマーケティング デジタルマーケティング 文字コード 符号化文字集合 生成拡張 Google Search Console レクタングルバナー 画質パラメーター shopify ショッピングサイト ショッピファイ Shopify使い方 WebP リモートワーク remotework プラグイン IE コーディング サイズパラメーター モダンブラウザ gridレイアウト object-fit aspect-ratio any-hover docker Photoshop クラウドドキュメント ディスプレイ広告 スマートオブジェクト gap Unicode(ユニコード)

Top