2016/11/14

ファイルをアップしてエラー!WordPressの文字コードUTF-8Nbomなしって何!?

Windowsのメモ帳などで、文字コードUTF-8を指定・保存して、サーバーにアップすると、(.htaccessを触った時)500 ERROR Internal Server Errorが出たり、single.phpをアップしたときは文字化けを起こすなど、エラーがでます。

WordPressで運営をしていると文字コード、UTF-8って見かけます。実はUTF-8N(bomなし)が正しいです。bomって何?難しいけど知りたい!って事で、超簡単にまとめました。

TeraPadなどテキストエディタでも、文字コード「UTF-8」でファイルをアップしたらエラーがでます。ブログ運営者に文字コード「UTF-8のbom」を理解してもらう為、文字コードから書いて、後半bomに力いれてきます。時短の目次からどうぞ^^

文字コードのUTF-8とUTF-8N、bomとは何?

スポンサーリンク

文字コードとは何?

IT用語辞典の文字コードの説明は難しいので、ITに無縁の私みたいな人が解るように物凄く簡単にざっくりとまとめてみましたっ。

文字コードとは、文字や記号をコンピュータで扱うために、文字や記号一つ一つに割り当てられた固有の数字のこと。

引用元:文字コード 【 character code 】 キャラクタコード / キャラクターコード|IT用語辞典

「文字や記号に割り当てられてた固有の数字」とは、IMEパッドの「ユニコード:Unicode」文字コードの一覧で″固有の数字″が、どんなものか見ると解りやすいです。

unicode一覧(IMEパッドより)

画面中四角内にある文字をみたら数字が書かれてます。それが「d」の文字コードになります。

  • 「Unicode: U+0064」Unicodeの文字コードは「0064」
  • 「UTF-16: 0×0064」UTF-16も「0064」

欧米などで使われる英数字の文字コードは1バイトで表現されるが、これでは256文字しか表現できず、日本語の漢字などは収録できないため、日本や韓国、中国などではそれぞれ独自に2バイト(最大65536文字)のコード体系を定め、それぞれ自国内で使用している。

~ 後略 ~

引用元:文字コード 【 character code 】 キャラクタコード / キャラクターコード|IT用語辞典

全然わかんないので、つぎ「文字コード」は何が書いてるか簡単にまとめますねっ。

文字コード「ASCII」「Shift_JIS」「UTF-8」の違い、初心者向けにざっくりと説明

バイト数の大きさだけを見て言えば「固有の数字(符号):文字(漢字など)の表現数」が多く使えるほ、どバイト数も上がります。

文字コード Byte数 説明
ASCII 1Byte
  • 世界基準
  • 英数字仕様なので、文字数が少ない
JISコード
EUC
Shift_JIS
~2Bytes
  • 漢字など独特の文字も使うため「日本特有のコード」が使われる
  • 英数字漢字ひらがな等にも対応;文字数が多い
Unicode 英数字以外「漢字など」にちょっと弱いみたいなっ
UTF-8 ~4Bytes バイトが増えると、文字形態がめちゃくちゃ多いってイメージすると解りやすい。

参考文字コード 【 character code 】 キャラクタコード / キャラクターコード|IT用語辞典

参考UTF-8 【 8-bit UCS Transformation Format 】:IT用語辞典

UTF-8は、header.php・CSSに「charset・・”utf-8″」と書いてます。書いてないテーマもあり。メリット・デメリットについて解りやすいのは下記ページさんです。

参考文字コードShift-JISとUTF-8の違いって何?|シリウス(SIRIUS)

UTF-8でアップするとエラーがでる!bomとは?

PCのメモ帳や、FFFTPの文字コード設定でUTF-8にして.htaccessをサーバーにアップしたら、管理画面に入れないエラーが出ます。

なぜかというと、UTF-8は(bomあり)と(bomなし)の2種類あるからです。ウィキを読んでみると

バイトオーダーマーク (byte order mark) あるいはバイト順マーク(バイトじゅんマーク)は通称BOM(ボム)といわれる、Unicodeの符号化形式で符号化したテキストの先頭につける数バイトのデータのことである。このデータを元にUnicodeで符号化されていることおよび符号化の種類の判別に使用する。

引用元:バイトオーダーマーク

わかれば超適切で「ウィキ凄い」ってちょっと感動!忘れる前にbomを説明しますね。

文字コード、UTF-8のbom(ByteOrderMark)バイトオーダー「ByteOrder」のマーク「Mark」で【bom:ボム】と言います。

文字コードの最初に「バイトオーダーのマーク」が付いてます。バイトオーダーって何やねんってザックリ言ったら「文字コードの数字の前にある英文字」なんですねっ。

bomとは?文字コードの前にある英文字

文字コードの前に数字があれば『bomあり』になり、なければ『bomなし』です。その文字は、人間目には見えないので、「バイナリエディタ」と言う文字コードが見えるエディタを使って見ればOK!

画像にある「EF BB BF」がUTF-8のbomの正体です。文字コードUTF-8は、bonがついてるのが解りますよね。

UTF-8のbomバイトオーダーマーク:EF BB BF

画像下UTF-8(bomあり)を、バイナリエディタで表示したのが上。

UTF-8のbom「EF BB BF」の後に並んだ英数字。これが文字コードで、上述通り「UTF-8」は4バイトまで使え、半角#の文字コードは23で1バイト使ってるのが、わかります。

23 53 49 54 45 47 55 41 52

これら2桁の数字1つで1バイトですっ。

漢字の1文字「出」だけの文字コードを見てみると。。

2バイト使う漢字の文字コード例

E5 87 これは2バイト使ってる。おまけ^^

ポイント♪
  • UTF-8Nのbomなしは、bom「EF BB BF」がついてない
  • 「あり」と「なし」ではコンピューターの処理が変わる
  • ありでアップしたらエラーを引き起こす

だからbomありでアップすれば、エラーがでる!

bomなしには、bom「EF BB BF」が付いていない

このUTF-8N(bomなし)のファイルをバイナリエディタで表示させると「EF BB BF」が付いてません。だから、UTF-8Nと解ります。

UTF-8Nは「bomバイトオーダーマーク:EF BB BF」が無いのが解る

画像下UTF-8N(bomなし)。それをバイナリエディタで表示したのが上画像。

更にウィキペディアのbomを読みすすめると

UTF-8は文字コードとしてASCIIを前提としたプログラムでもおよそ支障なく動作するように設計されているが、BOMによって正常に処理できなくなる場合がある。Unicodeの規格において、UTF-8においてBOMは容認されるが、必須でも勧められるものでもないとされている。[3]また、データベースやメモリへロードするデータなど、内部的なデータ形式では、プログラムの性能や効率の観点から普通BOMは用いられない。

引用元:バイトオーダーマーク

奥が深くて何言ってるのか解んないですよねぇ。。聞きなれた言葉で物凄くざっくりWordPressに絡めて言いますね^^

ファイルによってはbomありにするとエラーがおきる

single.php・.htaccess・wp_config.phpで不具合がでたことあるので、次を見てください。wikiが言っているのを簡単に説明すれば、下記。

  • 「ASCII」でファイルをアップするとの異常起こす場合もある
    • bomでアップすると、single.phpでは文字化けをおこす。(起こしたことある)
    • さらに.htaccessやwp_config.phpでは500エラーを起こす(経験済み)」
  • UTF-8はbomありとbomなしの2種類ある
  • 英数字だけなら「bomあり」で対応できちゃう
  • bomありは、データベースなどの形式でプログラムの性能や効率から使わない

最後の部分!「データベースなどの形式でプログラムの性能や効率の観点から使わない」って事は・・・。

UTF-8はデータベース形式のブログでは「UTF-8N(bomなし)」である!

WordPressは元々UTF-8N(bomなし)だった!!いきなりスッキリ理解できましたよね^^

WordPressはデータベース形式のプログラムだからbomなしが適切

WordPressのheadにmeta charset文字コードの指定されてます。

  • <?php bloginfo( ‘charset’ ); ?>は、下記「WordPress Codex」を見ると「UTF-8を常に返してる」って事が解りますっ。

charset’ – Version 3.5.0 以降は “UTF-8“を常に返します。その前のバージョンでは、管理画面の「設定 > 表示設定」で設定された「ページとフィードのエンコーディング」を表示するものです。このデータは wp_options テーブルの “blog_charset” レコードから取得されるものです。

引用元:テンプレートタグ/bloginfo|WordPress Codex

目で見るともっと解りやすいです。CSSをみると、一行目に「@charset “utf-8”;」ってあるんですねっ。文字コードがUTF-8ですよぉって事です。

CSSの先頭にcharset utf-8

それから書いてないテーマ例えばTwenty Sixteenは書かれてませんけど、そのCSSの文字コードを調べたらUTF-8N(bomなし)です。

Twenty SixteenのスタイルシートもUTF-8N

WordPressの重要ファイルwp-config.phpには、注意書きもあります。

// 注意:
// Windows の “メモ帳” でこのファイルを編集しないでください !
// 問題なく使えるテキストエディタ
//(http://wpdocs.sourceforge.jp/ Codex:%E8%AB%87%E8%A9%B1 %E5%AE%A4 参照)
// を使用し必ず UTF-8 の BOM なし (UTF-8N) で保存してください

引用元:wp-config.php

UTF-8 の BOM なし (UTF-8N) で保存とあるのは、そのコードで元々保存してるからですっ。テキストエディタで文字コードを見たら、UTF-8Nになってます。

wp-config.phpの引用部分の記載

更に改行コードが「LF」ってなってます。Twenty SixteenのCSSもLFとなってるので、Naifix:改行コードこれが正しい書き方!と、ついでに覚えておきましょう^^

wp-config.phpの文字コード:UTF-8N、改行コード:LF

ウィキに書いてるように、UTF-8Nが「bomなし」です。日本特有の呼び方だから「@charset “utf-8n”;」とNを付けない、またそんな書き方はないのでしょう。

日本の特殊事情として、このシーケンスがある方をUTF-8、ない方を特にUTF-8Nと呼ぶこともある[11]が、このような呼び分けは日本以外ではほとんど知られておらず、また公的規格などによる裏付けもない[12]。

引用元:UTF-8|ウィキペディア

参考エラーが起きた?それはUTF-8のBOMと改行コードが原因かもしれません|Naifix

UTF-8とUTF-8N(bomあり、なし)のまとめ

  • UTF-8は、文字表現が豊富!その分他の文字コードよりも重たい
  • UTF-8はbom「EF BB BF」が有るバージョン
    ※PCのメモ帳のUTF-8(bomあり)だからエラーが出る
  • UTF-8Nは文字コードの前にbom「EF BB BF」が無い
  • UTF-8とUTF-8Nは処理方法が違う(他の文字コードも)

WordPressでいえばUTF-8N(bomなし)で保存してサーバーにアップする。bomありでアップするとエラーがでるってこと。

さいごに

私はTeraPadを使ってます。初心者向けでホントに使いやすいですよっ。Windows専用ですけど・・。

1番言いたかったのは、UTF-8N(bomなし)でエラーを回避しましょうよぉ!って話です。その為にTeraPadのようなテキストエディタを使って保存しましょ!って事でしたっ。

「処理方法が違うしコードが正常に処理されないと、エラーがでちゃうから。」気をつけましょうねっ♪

wp-config.phpや、.htaccess、functions.phpなどは特に!間違うとブログが真っ白になったり、表示されないことがあります。この機会にローカル環境やサブドメインでテスト環境を作ってみてはどうでしょうか!?

LINKWordPressのサブドメインでテスト環境を作る手順!&ちょっとした知恵的なの

では、かうたっくでしたっ!

書いた人:かうたっく

何も知らない初心者ですが、WordPressでブログを始めました。 ブログの技術系でつまずいたエラーを経験したことからエラー関連を、初心者が初心者に向けて分かりやすい言葉で書いてます★子どもの喘息様気管支炎や、幼い子どもとの生活ページなどよく読まれる雑多ブログを運営中^^♪ご意見、感想、質問はお問い合せよりお待ちしています。

Twitterフォロー