- 締切済み
多言語ページのエンコード記述が分かりません
友人に頼まれてサイトの挨拶文のようなページを、英語バージョンと中国語バージョンで作っています。 ナビゲーションなどは日本語のままで、メインのコンテンツエリアのみ英語や中国語を書くので２つの言語が交じるページとなります。 文字化けを防ぐためのエンコードがいまいち分かりません… 分からないなりに書いては見たものの、これであっているのかも分かりません。 （確認する方法はあるのでしょうか） コードを書いてみました。 添削やアドバイスをお願いします。 ───────────────────────── 【英語と日本語のページ】 ※エンコードをUTF-8にしただけです。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>△△△</title> <link href="◯◯◯.css" rel="stylesheet" type="text/css" media="all" /> </head> ───────────────────────── 【中国語と日本語のページ】 ※ネットで検索してcharset=bg2312、 lang="ja,zh" xml:lang="ja,zh"を書きましたがこれでいいんでしょうか？ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja,zh" xml:lang="ja,zh"> <head> <meta http-equiv="Content-Type" content="text/html; charset=bg2312" /> <meta http-equiv="Content-Style-Type" content="text/css"> <title>△△△</title> <link href="◯◯◯.css" rel="stylesheet" type="text/css" media="all" /> </head> ───────────────────────── また、友人のサイトを見てみるとその他すべてのページはShift_JISで作られています。 これは海外の人が開くと文字化けしてしまうということなのでしょうか？ 日本語の表示のままでいいのですが、UTF-8にしたほうがいいのでしょうか？ わからない事だらけでスミマセン(;_;) よろしくお願いします。。
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- ORUKA1951
- ベストアンサー率45% (5062/11036)
＞<html xmlns="http://www.w3.org/1999/xhtml" lang="ja,zh" xml:lang="ja,zh"> さすがに、XHTMLはもう使いませんが・・ HTML5が持つ本当の意味 － ＠IT( http://www.atmarkit.co.jp/news/200801/25/html.html )の「XHTMLがあるのに、なぜ今さらHTML？」あたり。 <!doctype html> <html lang="ja"><!-- この文書が日本語であることを宣言 --> <head> <meta charset="utf-8"> <title>サンプル</title> <link rel="stylesheet" href="css/style.css"> </style> </head> <body> ＿<header> ＿＿<h1>アラビア語<span lang="en-us">Arabic language</span><span lang="ar" dir="rtl">اللغة العربية</span></h1> ＿＿<p>アラビア語は、アフロ・アジア語族のセム語派に属する言語の一つ。</p> ＿＿<p lang="en-us">The Arabia language is one of the languages that belong to Semitic languages of a Afro Asian family of languages. </p> ＿＿<p lang="ar" dir="rtl">تنتمي اللغة العربية إلى أسرة اللغات السامية المتفرعة من مجموعة اللغات الإفريقية الآسيوية. وتضم مجموعة اللغات السامية لغات حضارة الهلال الخصيب القديمة، </p> ＿</section> で良いです。 標準スタイルシートで *[lang|="en"],*[lang|="ar"]{color:gray;} として代替スタイルシートでは <link href="english.css" title="English" rel="alternate stylesheet" type="text/css"> で *[lang|="en"]{color:black;} とするとか・・
- ORUKA1951
- ベストアンサー率45% (5062/11036)
ページ全体はUTF-8が楽でしょう。 Shift_JISなどの場合は、文字参照( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/charset.html#h-5.3 )を使用します。 とても説明しきれないので詳しくは↑ UTF-8の場合でも、個別にはlang( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/dirlang.html#adef-lang )属性で必ず指定します。 表示は代替スタイルシートで選択してもらったり、javascriptでuser agentの言語に合わせてスタイルを書き換えるとかします。 [例] ＿<section> ＿＿<aside> ＿＿＿<h3>Something aside</h3> ＿＿</aside> ＿＿<h2>アラビア語<span lang="en-us">Arabic language</span><span lang="ar" dir="rtl">اللغة العربية</span></h2> ＿＿<p>アラビア語は、アフロ・アジア語族のセム語派に属する言語の一つ。</p> ＿＿<p lang="en-us">The Arabia language is one of the languages that belong to Semitic languages of a Afro Asian family of languages. </p> ＿＿<p lang="ar" dir="rtl">تنتمي اللغة العربية إلى أسرة اللغات السامية المتفرعة من مجموعة اللغات الإفريقية الآسيوية. وتضم مجموعة اللغات السامية لغات حضارة الهلال الخصيب القديمة، </p> ＿</section>
補足
回答ありがとうございます！ では、エンコードのUTF-8にするだけで、 <html xmlns="http://www.w3.org/1999/xhtml" lang="ja,zh" xml:lang="ja,zh"> ここのlang=とxml:lang=の記述はいらないですか？ 使用する箇所にlangの指定すればいいということですが、日本語のところにはlang=ja必要無いのでしょうか？ ↓こんな感じでいいのかしら‥ <p>赤ちゃん</p> <p lang="zh">婴儿</p> <p lang="en-us">Baby</p> なんどもスミマセン！
補足
ありがとうございます。 代替スタイルシートというものがあるんですね！ 訪問者が任意で表示の切り替えができるということですね、知りませんでした…！ >標準スタイルシートで >*[lang|="en"],*[lang|="ar"]{color:gray;} >として代替スタイルシートでは ><link href="english.css" title="English" rel="alternate stylesheet" type="text/css"> > で >*[lang|="en"]{color:black;} >とするとか・・ 表示の切り替えで文字の色を設定する？ということなのでしょうか？ （通常cssで英語とアラビア語はグレーの文字、代替cssに切り替えると黒い文字） 間違っていたらスミマセン… 通常のデザインを適用するためのcssだけではだめなのでしょうか？ 度々すみません、勉強になります。