コンテンツへスキップ

UX BEAR【ゆえっくま】

IT業界ではたらくまの開発&投資情報。鮭の皮は食べる派です。
  • テクノロジー
  • マネジメント
  • ファイナンシャルリテラシー

UX BEAR【ゆえっくま】

IT業界ではたらくまの開発&投資情報。鮭の皮は食べる派です。
  • テクノロジー
  • マネジメント
  • ファイナンシャルリテラシー

【文字化け解決】文字コードと文字エンコーディング「UTF-8」「Shift_JIS」「EUC-JP」とは?

  • by UXBEAR
  • JavaScript, テクノロジー
  • 2021年7月14日2021年5月23日
code

HTML/CSS/JavaScriptを書いてサーバにアップしたとき、ブラウザ上で文字化けが起こることがあります。なぜ文字化けが起こるのでしょうか?文字コード指定方法など対策についてです。

目次

  • なぜ文字化けが起きる?
  • 日本の文字コード
  • プログラム上での文字コードの指定方法
    • HTML
    • CSS
    • JavaScript
  • まとめ
  • JavaScriptの学習講座、エンジニアの転職
  • あわせて読みたい記事
  • あわせて読みたい書籍

なぜ文字化けが起きる?

ファイル自身の文字コード(文字エンコーディング)と、それを表示するブラウザの文字コード(文字エンコーディング)が異なると、文字の対応表が異なるので文字化けが発生します。

日本の文字コード

日本では、「UTF-8」「Shift_JIS」「EUC-JP」の3つがよく使われている文字コード(文字エンコーディング)です。

HTMLでは UTF-8 を使用することが推奨されています。

文字コードの指定手順

  1. プログラム上での文字コード指定
  2. エディタで保存する際の文字コードを確認
  3. FTP転送字の文字コード確認

プログラム上での文字コードの指定方法

HTML

<meta charset="UTF-8">

meta要素のcharset属性に文字コードを指定

CSS

@charset "utf-8";

スタイルシートで使う文字エンコーディングを定義。

JavaScript

<script src="sample.js" charset="UTF-8"></script>

src属性で外部Javascriptを読み込む場合は、charset属性で文字コード指定します。

まとめ

なぜ文字化けが起こるか?解決のための文字コードの指定方法についてでした。

リンク

JavaScriptの学習講座、エンジニアの転職

あわせて読みたい記事

JavaScriptとは? タイプ別 入門/初心者向けおすすめ本5選【プログラミング】
【CodePenとは?】無料のWebコードエディタで使い方、ブログへの埋め込み方法。
JSONの書き方
【Anime.js入門】JavaScriptアニメーション基礎入門(変形編)

あわせて読みたい書籍

リンク

リンク

関連記事

  • チャールズ・エリス氏とは?経歴、おすすめ書籍3冊「敗者のゲーム」「投資の大原則」チャールズ・エリス氏とは?経歴、おすすめ書籍3冊「敗者のゲーム」「投資の大原則」
  • 英文法チェックツール無料3選【外資系転職】英文法チェックツール無料3選【外資系転職】
  • WWDC2021開始日時、ライブ配信、発表内容など【iOS 15, WatchOS 8, tvOS】WWDC2021開始日時、ライブ配信、発表内容など【iOS 15, WatchOS 8, tvOS】
  • ニューアムステルダム医師たちのカルテ “New Amsterdam”【 海外ドラマで英語学習】ニューアムステルダム医師たちのカルテ “New Amsterdam”【 海外ドラマで英語学習】
  • 「 Firebase 」とは? –  Google MBaaS で進むグロース高速化、サーバレス開発環境「 Firebase 」とは? – Google MBaaS で進むグロース高速化、サーバレス開発環境

共有:

  • Twitter
  • Facebook
タグ:euc-jpShift-JISutf-8文字コード文字化け
前【インデックス投資】QQQとは? – ナスダック100指数連動米国ETFを分析
次介護保険サービスを受けるには?申請方法【老後資金問題】

コメントを残す コメントをキャンセル

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です

CAPTCHA


カテゴリー

  • Chart (28)
  • ETF (31)
  • JavaScript (27)
  • xR (14)
  • アプリ (9)
  • その他 (45)
  • テクノロジー (83)
  • ファイナンシャルリテラシー (137)
  • ファイナンス (80)
  • マーケティング (45)
  • マネジメント (64)
  • ライフスタイル (18)
  • ライフハック (10)
  • 不動産 (2)
  • 仮想通貨 (14)
  • 確定申告 (1)
  • 確定申告 (1)
  • 老後資金 (12)
  • 英語 (27)

検索

関連記事

  • チャールズ・エリス氏とは?経歴、おすすめ書籍3冊「敗者のゲーム」「投資の大原則」チャールズ・エリス氏とは?経歴、おすすめ書籍3冊「敗者のゲーム」「投資の大原則」
  • 英文法チェックツール無料3選【外資系転職】英文法チェックツール無料3選【外資系転職】
  • WWDC2021開始日時、ライブ配信、発表内容など【iOS 15, WatchOS 8, tvOS】WWDC2021開始日時、ライブ配信、発表内容など【iOS 15, WatchOS 8, tvOS】
  • ニューアムステルダム医師たちのカルテ “New Amsterdam”【 海外ドラマで英語学習】ニューアムステルダム医師たちのカルテ “New Amsterdam”【 海外ドラマで英語学習】
  • 「 Firebase 」とは? –  Google MBaaS で進むグロース高速化、サーバレス開発環境「 Firebase 」とは? – Google MBaaS で進むグロース高速化、サーバレス開発環境

関連サイト

にほんブログ村 IT技術ブログへ

関連キーワード

d3.js Defi e-Tax ETF ETH Google Analytics Google Chart JavaScript jobinterview Resume TOEIC transferwise Unity Webマーケティング wise xR インデックス投資 インフレ イーサリアム スマートコントラクト セービングス口座 チェッキング口座 チャート デジタル有価証券 デフレ ビジネス英語 ビットコイン 仮想通貨 仮想通貨ウォレット 会計ソフト 入金 口座開設 外資系 手数料 景気 海外口座 海外投資 海外送金 為替手数料 確定申告 税金 英会話 英語 英語面接 転職

Neve | Powered by WordPress