Upgrade to Pro — share decks privately, control downloads, hide ads and more …

多言語都市・香港から見る多言語サイトのつくりかた ~中国語成分多めでお届け!~

Chiaki.K
November 02, 2019

多言語都市・香港から見る多言語サイトのつくりかた ~中国語成分多めでお届け!~

WordCamp Tokyo 2019 - 45min.

日本政府が観光立国を目指すなか、LCCの就航などにより、訪日外国人観光客が年々増加しています。インバウンド対策として、全世界から日本を訪れる外国人観光客にウェブを通じてアピールできる多言語サイトが重要になっています。ウェブサイトのほとんどが多言語サイトという多言語都市・香港で、多言語サイトを制作する中で感じた多言語サイト制作のポイントをご紹介します。中国語案件あるあるをはじめ、WordPressで多言語サイトを作るメリットやプラグイン、案件の提案や受注前に押さえておきたいチェックポイントなどに触れていきます。

動画アーカイブ(WordPress.tv):
https://wordpress.tv/2019/11/15/chiaki-kouno-how-to-create-a-multilingual-site-looking-from-hong-kong-a-multilingual-city-delivered-with-bit-of-chinese-ingredients/

動画アーカイブ(YouTube):
https://youtu.be/BMw4Ig75tk8

Chiaki.K

November 02, 2019
Tweet

More Decks by Chiaki.K

Other Decks in Research

Transcript

  1. ホントの 本日のおしながき 1. 似て非なる 中国・台湾・香港 マーケット 2. グレート・ファイアウォール問題 3. ウェブサイトの多言語化に

    る5つのポイント コンテンツ・翻訳・デザイン・サーバー・SEO 4. プラグインを使った多言語サイト構築方法 5. 未来の多言語サイト構築
  2. • コーポレートサイト …… 英・繫・簡・日・韓 • 飲食店サイト …… 英・日 • レシピサイト

    …… 繫・日 • ツアー予約管理サイト …… 繫・簡・日 • 有料会員制のニュースサイト …… 繫・簡・日 • 有料会員制の動画学習サイト …… 簡・日 • 会員登録制のモバイルアプリ …… 繫・簡・日 これまで制作してきた多言語対応のサイト
  3. • コーポレートサイト …… 英・繫・簡・日・韓 • 飲食店サイト …… 英・日 • レシピサイト

    …… 繫・日 • ツアー予約管理サイト …… 繫・簡・日 • 有料会員制のニュースサイト …… 繫・簡・日 • 有料会員制の動画学習サイト …… 簡・日 • 会員登録制のモバイルアプリ …… 繫・簡・日 これまで制作してきた多言語対応のサイト ぜんぶ WordPressで つくりました!
  4. まずは言葉の違い 場所 話される中国語 読み 書き 中国 普通话 ふつうわ 北京官話 Mandarin

    ぺきんかんわ、マンダリン 简体字 んたい 台湾 國語 こくご 繁體字 はんたい 香港 廣東話 かんとんわ 広東語 Cantonese かんとんご
  5. まずは言葉の違い 場所 話される中国語 読み 書き 中国 普通话 ふつうわ 北京官話 Mandarin

    ぺきんかんわ、マンダリン 简体字 かんたいじ 台湾 國語 こくご 繁體字 はんたいじ 香港 廣東話 かんとんわ 広東語 Cantonese かんとんご 中国本土 向け 台湾•香港 向け
  6. こんなに違うよ、中国語! エリア 書 読み 中国 他喜欢坐出租车。 (簡体字) タァ シーファン ズオ

    チューズーチェー Tā xǐhuān zuò chūzū chē 台湾 他喜歡座計程車。 (繁体字) タァ シーファン ズオ ジーチャンチェー Tā xǐhuān zuò jìchéngchē 香港 佢鍾意搭的士。 (繁体字) コイ チュンイー ダップ ディクシィー Kéuih jūngyi daap dīksí どっちも同じ「くるま」なのに こんなに違う! 车 車 例文「彼はタクシーに乗るのが好きです。」
  7. こんなに違うよ、中国語! エリア 書 読み 中国 他喜欢坐出租车。 (簡体字) タァ シーファン ズオ

    チューズーチェー Tā xǐhuān zuò chūzū chē 台湾 他喜歡座計程車。 (繁体字) タァ シーファン ズオ ジーチャンチェー Tā xǐhuān zuò jìchéngchē 香港 佢鍾意搭的士。 (繁体字) コイ チュンイー ダップ ディクシィー Kéuih jūngyi daap dīksí 例文「彼はタクシーに乗るのが好きです。」
  8. 中国人 繁体字中国語 広東語 簡体字 + マンダリン すごいストレス 理解できない文字 読みたくない。 広東語だろうけど

    …分からない! 中国本土の方向けには 簡体字+マンダリン のコンテンツを きちんと用意しよう!
  9. 台湾人 簡体字中国語 広東語 繁体字 + マンダリン まあ読めるけど、 繁体字だと かなり喜ぶ 広東語だろうけど

    …分からない! 台湾の方向けには 繁体字+マンダリン のコンテンツを きちんと用意しよう!
  10. 香港人 繁体字 + 広東語 簡体字中国語 普通話 マンダリン 台湾・國語 まず見ない 英語

    できます 聞こえる! 無問題! 読めるよ! 無問題! 香港の方向けには 繁体字 (英語もまぁOKだけど、 おもてなししたいところ) のコンテンツを用意しよう!
  11. 香港人 繁体字 + 広東語 簡体字中国語 普通話 マンダリン 台湾・國語 まず見ない 英語

    できます 聞こえる! 無問題! 読めるよ! 無問題! 香港の方向けには 繁体字 (英語もまぁOKだけど、 おもてなししたいところ) のコンテンツを用意しよう! ピンポイントに香港人を対象として、 親しみやすく刺さるプロモーションをする時は きちんと繁体字・広東語対応をしましょう!
  12. グレート・ファイア ウォール とは? 中国国内のインターネット利用者に対 て、 ブロッキングとフィルタリングを行う大規模 情報検閲システム。 ファイアウォールと"Great Wall" (万里の長

    城)をも って Great Firewall(グレート・ ファイアウォール)と呼ばれ、GFWとも略 れる。 あなたの サイトを 見れなく している?
  13. グレート・ファイアウォール問題 • Google • Facebook • YouTube • Twitter •

    Instagram • Dropbox • reCAPTCHA 参考:Websites blocked in mainland China https://en.wikipedia.org/wiki/Websites_blocked_in_mainland_China 中国国内で利用できない • Googleマップ • Googleフォーム • Googleカレンダー • jQuery(Google CDN) 使わない・代替を用意する
  14. 読み込み時間比較(webpagetest.orgでの北京の結果を追加) 日本 香港 深セン 北京 基本:プレーン 0.038 秒 0.175 秒

    0.292 秒 0.346 秒 読み込み Googleフォント(CDN) 0.458 秒 0.289 秒 0.886 秒 2.692 秒 ウェブフォント読み込み自体は OK jQuery(Google CDN) 0.293 秒 0.316 秒 xxx xxx jQuery(jQuery本家CDN) 0.364 秒 0.242 秒 10.860 秒 11.540 秒 jQuery(jQueryをダウンロードして含める) 0.330 秒 0.268 秒 1.130 秒 0.713 秒 Google アナリティクス 0.568 秒 0.232 秒 1.990 秒 1.927 秒 Google タグマネージャー 0.313 秒 0.152 秒 1.820 秒 1.753 秒 reCAPTCHA プラグイン on / reCaptcha on 2.040 秒 2.090 秒 xxx xxx 表示するが、必要な API読み込めず、ログイン失敗 プラグイン on / reCaptcha off 1.350 秒 0.957 秒 xxx xxx プラグイン off / reCaptcha off 0.588 秒 0.804 秒 1.520 秒 1.224 秒 HTMLに埋め込み Googleマップ 2.010 秒 0.695 秒 xxx xxx Googleフォーム 1.600 秒 1.220 秒 xxx xxx Googleカレンダー 2.010 秒 1.460 秒 xxx xxx 管理画面 Google アナリティクス サービス紹介 1.950 秒 0.917 秒 xxx xxx 管理画面は閲覧できないのに、タグは動作する ー ログイン・管理画面 1.650 秒 1.370 秒 xxx xxx Google サーチコンソール サービス紹介 1.440 秒 0.786 秒 xxx xxx ー ログイン・管理画面 0.038 秒 1.440 秒 xxx xxx
  15. SNSの利用率 中国 香港 台湾 タイ 日本 百度贴吧 72% Baidu Tieba

    Facebook 85% Youtube 90% Facebook 93% Youtube 75% 新浪微博 60% Sina Weibo Youtube 83% Facebook 89% Youtube 91% Twitter 49% 优酷 59% Youku Instagram 57% Instagram 49% Instagram 65% Facebook 36% QQ空间 56% QZONE Twitter 26% Twitter 24% Twitter 52% Instagram 33% 腾讯微博 37% Tencent Weibo 优酷 23% Youku EYNY 22% LinkedIn 25% アメブロ 22% 出典 DIGITAL 2019 https://wearesocial.com/global-digital-report-2019
  16. メッセンジャーの利用率 出典 DIGITAL 2019 https://wearesocial.com/global-digital-report-2019 中国 香港 台湾 タイ 日本 WeChat

    74% WhatsApp 82% LINE 84% LINE 84% LINE 67% QQ 68% WeChat 53% FB Messenger 57% FB Messenge 72% FB Messenge 11% FB Messenger 50% WeChat 32% Skype 27% Skype 8% LINE 29% Skype 25% WeChat 25% WeChat 2% Skype 24% WhatsApp 19% WhatsApp 25% Viber 2%
  17. 翻訳方法 予算 日数 長所 短所 機械翻訳 ⌛ Google翻訳は無料 も、瞬時に出来る 時々、大誤訳

    クオリティチェック負荷あり クラウド翻訳 ⌛⌛ 費用・所要日数的にみて 気軽に利用で る人力翻訳 まちまちの品質 ばらつ トーンと表現 クオリティチェック負荷あり 翻訳会社 ⌛⌛⌛ 品質を担保で る 一定の時間を要 る 一定のコスト る で る! 制作会社 ⌛⌛⌛ 品質を担保で る 翻訳・多言語化に加えて、マーケ ティングも踏まえた対応 可能 一定の時間を要 る 一定のコスト る おすすめの翻訳方法は?
  18. カラー • 色のもつ意味の違い(例: 縁起の良い色、悪い色) フォント • 文字数・フォント変更によるレイアウト れ対応 • 言語に合わ

    た適切なフォント指定 • フォントサイズの調整 画像 • 文字入り画像は総入れ替え • 現地でも通 る 、誤解を生まないイメージ チェック お問い合わせ ツール • コンタクト・フォーム • チャット・ウィンドウ • メッセージ・アプリ ユーザー登録 • メールアドレスで登録 • SNSアカウントで登録(ソーシャルログイン) 国・地域に合わせたデザイン(UI/UX)の最適化
  19. カラー • 色のもつ意味の違い(例: 縁起の良い色、悪い色) フォント • 文字数・フォント変更によるレイアウト れ対応 • 言語に合わ

    た適切なフォント指定 • フォントサイズの調整 画像 • 文字入り画像は総入れ替え • 現地でも通 る 、誤解を生まないイメージ チェック お問い合わせ ツール • コンタクト・フォーム • チャット・ウィンドウ • メッセージ・アプリ ユーザー登録 • メールアドレスで登録 • SNSアカウントで登録(ソーシャルログイン) 国・地域に合わせたデザイン(UI/UX)の最適化 色のもつ意味合い 黒 紫
  20. カラー • 色のもつ意味の違い(例: 縁起の良い色、悪い色) フォント • 文字数・フォント変更によるレイアウト れ対応 • 言語に合わ

    た適切なフォント指定 • フォントサイズの調整 画像 • 文字入り画像は総入れ替え • 現地でも通 る 、誤解を生まないイメージ チェック お問い合わせ ツール • コンタクト・フォーム • チャット・ウィンドウ • メッセージ・アプリ ユーザー登録 • メールアドレスで登録 • SNSアカウントで登録(ソーシャルログイン) 国・地域に合わせたデザイン(UI/UX)の最適化 コンタクトフォームだけじゃなく チャットツール や メッセージアプリも!
  21. カラー • 色のもつ意味の違い(例: 縁起の良い色、悪い色) フォント • 文字数・フォント変更によるレイアウト れ対応 • 言語に合わ

    た適切なフォント指定 • フォントサイズの調整 画像 • 文字入り画像は総入れ替え • 現地でも通 る 、誤解を生まないイメージ チェック お問い合わせ ツール • コンタクト・フォーム • チャット・ウィンドウ • メッセージ・アプリ ユーザー登録 • メールアドレスで登録 • SNSアカウントで登録(ソーシャルログイン) 国・地域に合わせたデザイン(UI/UX)の最適化 「メールアドレス持っていない…」 地域に合わせた ソーシャルログインも!
  22. URL 構造 URL の例 長所 短所 国別のドメイン example.de • 地域ターゲティング

    明確 • サーバーの場所に依存 ない • サイトの分割 簡単 • 高価(利用 制限 れる場合もある) • より多 のインフラ 必要 • ccTLD 要件 厳 い(一部) gTLD を使用 る サブドメイン de.example.com • 設定 簡単 • Search Console の地域ターゲティングを 使用で る • 複数の場所のサーバーを使用で る • サイトの分割 簡単 • ユーザーは URL のみ ら地域ターゲティ ングを認識で ない場合 ある(例: 「de」 言語なの 国なの 不明) gTLD を使用 る サブディレクトリ example.com/de/ • 設定 簡単 • Search Console の地域ターゲティングを 使用で る • 管理 や い(ホスト 同 ) • ユーザーは URL のみ ら地域ターゲティ ングを認識で ない場合 ある • サーバーの場所は 1 所のみ • サイトの分割 難 い URL パラメータ site.com?loc=de • 非推奨 • URL ベースの分割 難 い • ユーザーは URL のみ ら地域ターゲティ ングを認識で ない場合 ある • Search Console の地域ターゲティングを 利用で ない 出典:Search Consoleヘルプ > 多地域、多言語のサイトの管理 https://support.google.com/webmasters/answer/182192?hl=ja SEO的にどのURL構造が良い?
  23. URL 構造 URL の例 長所 短所 国別のドメイン example.de • 地域ターゲティング

    明確 • サーバーの場所に依存 ない • サイトの分割 簡単 • 高価(利用 制限 れる場合もある) • より多 のインフラ 必要 • ccTLD 要件 厳 い(一部) gTLD を使用 る サブドメイン de.example.com • 設定 簡単 • Search Console の地域ターゲティングを 使用で る • 複数の場所のサーバーを使用で る • サイトの分割 簡単 • ユーザーは URL のみ ら地域ターゲティ ングを認識で ない場合 ある(例: 「de」 言語なの 国なの 不明) gTLD を使用 る サブディレクトリ example.com/de/ • 設定 簡単 • Search Console の地域ターゲティングを 使用で る • 管理 や い(ホスト 同 ) • ユーザーは URL のみ ら地域ターゲティ ングを認識で ない場合 ある • サーバーの場所は 1 所のみ • サイトの分割 難 い URL パラメータ site.com?loc=de • 非推奨 • URL ベースの分割 難 い • ユーザーは URL のみ ら地域ターゲティ ングを認識で ない場合 ある • Search Console の地域ターゲティングを 利用で ない 出典:Search Consoleヘルプ > 多地域、多言語のサイトの管理 https://support.google.com/webmasters/answer/182192?hl=ja SEO的にどのURL構造が良い? サブドメイン サブディレクトリ どちらでも◎
  24. URL 構造 URL の例 長所 短所 国別のドメイン example.de • 地域ターゲティング

    明確 • サーバーの場所に依存 ない • サイトの分割 簡単 • 高価(利用 制限 れる場合もある) • より多 のインフラ 必要 • ccTLD 要件 厳 い(一部) gTLD を使用 る サブドメイン de.example.com • 設定 簡単 • Search Console の地域ターゲティングを 使用で る • 複数の場所のサーバーを使用で る • サイトの分割 簡単 • ユーザーは URL のみ ら地域ターゲティ ングを認識で ない場合 ある(例: 「de」 言語なの 国なの 不明) gTLD を使用 る サブディレクトリ example.com/de/ • 設定 簡単 • Search Console の地域ターゲティングを 使用で る • 管理 や い(ホスト 同 ) • ユーザーは URL のみ ら地域ターゲティ ングを認識で ない場合 ある • サーバーの場所は 1 所のみ • サイトの分割 難 い URL パラメータ site.com?loc=de • 非推奨 • URL ベースの分割 難 い • ユーザーは URL のみ ら地域ターゲティ ングを認識で ない場合 ある • Search Console の地域ターゲティングを 利用で ない 出典:Search Consoleヘルプ > 多地域、多言語のサイトの管理 https://support.google.com/webmasters/answer/182192?hl=ja SEO的にどのURL構造が良い? ダメ!非推奨! URLパラメータ 例: site.com?loc=de
  25. 特に抑えておきたい 多言語サイトSEO、Googleからの注意点! • ユーザーの言語を認識 て自動的にリダイレクトすることは 避けてください。 のようなリダイレクトを行うと、ユーザー(と 検索エンジン) サイトの べての言語バージョンを見られな

    なる場 合 ありま 。 • 自動翻訳したサイトページが検索エンジンからクロー ルされないようにしてください。自動翻訳は意味 通 ない 場合 あるため、スパムとみな れる可能性 ありま 。 出典:Search Consoleヘルプ > 国際化 たサイトと多言語サイト>多地域、多言語のサイトの管理  hhttps://support.google.com/webmasters/answer/182192
  26. 1. HTML タグ 2. HTTP ヘッダー 3. サイトマップ 出典:Search Consoleヘルプ

    > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja 言語や地域ごとのページをグーグルに知らせ る方法は3つ
  27. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <!DOCTYPE html> <html

    lang="ja"> <head> <meta charSet="utf-8"/> <title>Example Corporation</title> ・ ・ ・ lang="ja" 言語や地域ごとのページをグーグルに 「HTMLタグ」で知らせる方法
  28. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <!DOCTYPE html> <html

    lang="ja"> <head> <meta charSet="utf-8"/> <title>Example Corporation</title> ・ ・ ・ lang="ja" ちがっていた! -“ Google では、ページの表示内容 らその言語を判断 ま 。 lang 属性のようなコードレベルの言語情報や、URL は使用しません。” 言語や地域ごとのページをグーグルに 「HTMLタグ」で知らせる方法
  29. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <head>内に次の<link>要素を追加 <link rel="alternate"

    hreflang="言語コード" href="ページURL" /> • 言語コード:ページ 対象と る言語や地域のコード • ページURL:指定 た言語や地域 対象と るページのフルパス 言語や地域ごとのページをグーグルに 「HTMLタグ」で知らせる方法
  30. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja http://example.com/page.html 日本人向 のページ

    http://hk.example.com/page.html 香港人向 のページ http://tw.example.com/page.html 台湾人向 のページ http://cn.example.com/page.html 中国人向 のページ http://en.example.com/page.html 英語のページ • 他言語ページの他、現在のページもリストに含める必要あり • ページURL:指定した言語や地域が対象とするページのフルパス • 他言語ページは同じドメイン内である必要はない <head> <title>Example Corporation</title> <link rel="alternate" hreflang="ja" href="http://example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-HK" href="http://hk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-TW" href="http://tw.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hans" href="http://cn.example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> </head> 言語や地域ごとのページをグーグルに「HTMLタグ」で知らせる方法 (記述例)
  31. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <head> <title>Example Corporation</title>

    <link rel="alternate" hreflang="ja" href="http://example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> <link rel="alternate" hreflang="en-US" href="http://us.example.com/page.html" /> <link rel="alternate" hreflang="en-GB" href="http://uk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-HK" href="http://hk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-TW" href="http://tw.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hans" href="http://cn.example.com/page.html" /> </head> 文字コード例 ISO 639-1 ISO 15924 ISO 3166-1 Alpha 2 言語 文字体系 地域 ja ja en en en-US en US en-GB en GB zh-Hant-HK zh Hant HK zh-Hant-TW zh Hant TW zh-Hans zh Hans 言語コードの構成
  32. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <head> <title>Example Corporation</title>

    <link rel="alternate" hreflang="ja" href="http://example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-HK" href="http://hk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-TW" href="http://tw.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hans" href="http://cn.example.com/page.html" /> <link rel="alternate" hreflang="en-US" href="http://us.example.com/page.html" /> <link rel="alternate" hreflang="en-GB" href="http://uk.example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> </head> 文字コード例 ISO 639-1 ISO 15924 ISO 3166-1 Alpha 2 言語 文字体系 地域 ja ja zh-Hant-HK zh Hant HK zh-Hant-TW zh Hant TW zh-Hans zh Hans en-US en US en-GB en GB en en 言語コードの構成 言語 文字体系 (もしあれば) 言語コードの要素 地域 (もしあれば) ー ー
  33. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <head> <title>Example Corporation</title>

    <link rel="alternate" hreflang="ja" href="http://example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-HK" href="http://hk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-TW" href="http://tw.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hans" href="http://cn.example.com/page.html" /> <link rel="alternate" hreflang="en-US" href="http://us.example.com/page.html" /> <link rel="alternate" hreflang="en-GB" href="http://uk.example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> </head> 文字コード例 ISO 639-1 ISO 15924 ISO 3166-1 Alpha 2 言語 文字体系 地域 ja ja zh-Hant-HK zh Hant HK zh-Hant-TW zh Hant TW zh-Hans zh Hans en-US en US en-GB en GB en en 言語コードの構成 言語 文字体系 (もしあれば) 言語コードの要素 地域 (もしあれば) ー ー ja
  34. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <head> <title>Example Corporation</title>

    <link rel="alternate" hreflang="ja" href="http://example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-HK" href="http://hk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-TW" href="http://tw.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hans" href="http://cn.example.com/page.html" /> <link rel="alternate" hreflang="en-US" href="http://us.example.com/page.html" /> <link rel="alternate" hreflang="en-GB" href="http://uk.example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> </head> 文字コード例 ISO 639-1 ISO 15924 ISO 3166-1 Alpha 2 言語 文字体系 地域 ja ja zh-Hant-HK zh Hant HK zh-Hant-TW zh Hant TW zh-Hans zh Hans en-US en US en-GB en GB en en 言語コードの構成 言語 文字体系 (もしあれば) 言語コードの要素 地域 (もしあれば) ー ー en GB
  35. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <head> <title>Example Corporation</title>

    <link rel="alternate" hreflang="ja" href="http://example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-HK" href="http://hk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-TW" href="http://tw.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hans" href="http://cn.example.com/page.html" /> <link rel="alternate" hreflang="en-US" href="http://us.example.com/page.html" /> <link rel="alternate" hreflang="en-GB" href="http://uk.example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> </head> 文字コード例 ISO 639-1 ISO 15924 ISO 3166-1 Alpha 2 言語 文字体系 地域 ja ja zh-Hant-HK zh Hant HK zh-Hant-TW zh Hant TW zh-Hans zh Hans en-US en US en-GB en GB en en 言語コードの構成 言語 文字体系 (もしあれば) 言語コードの要素 地域 (もしあれば) ー ー en US
  36. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <head> <title>Example Corporation</title>

    <link rel="alternate" hreflang="ja" href="http://example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-HK" href="http://hk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-TW" href="http://tw.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hans" href="http://cn.example.com/page.html" /> <link rel="alternate" hreflang="en-US" href="http://us.example.com/page.html" /> <link rel="alternate" hreflang="en-GB" href="http://uk.example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> </head> 文字コード例 ISO 639-1 ISO 15924 ISO 3166-1 Alpha 2 言語 文字体系 地域 ja ja zh-Hant-HK zh Hant HK zh-Hant-TW zh Hant TW zh-Hans zh Hans en-US en US en-GB en GB en en 言語コードの構成 言語 文字体系 (もしあれば) 言語コードの要素 地域 (もしあれば) ー ー zh 中文 Zhong Wen
  37. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <head> <title>Example Corporation</title>

    <link rel="alternate" hreflang="ja" href="http://example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-HK" href="http://hk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-TW" href="http://tw.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hans" href="http://cn.example.com/page.html" /> <link rel="alternate" hreflang="en-US" href="http://us.example.com/page.html" /> <link rel="alternate" hreflang="en-GB" href="http://uk.example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> </head> 文字コード例 ISO 639-1 ISO 15924 ISO 3166-1 Alpha 2 言語 文字体系 地域 ja ja zh-Hant-HK zh Hant HK zh-Hant-TW zh Hant TW zh-Hans zh Hans en-US en US en-GB en GB en en 言語コードの構成 言語 文字体系 (もしあれば) 言語コードの要素 地域 (もしあれば) ー ー zh 漢字 han zi Hant
  38. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <head> <title>Example Corporation</title>

    <link rel="alternate" hreflang="ja" href="http://example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-HK" href="http://hk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-TW" href="http://tw.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hans" href="http://cn.example.com/page.html" /> <link rel="alternate" hreflang="en-US" href="http://us.example.com/page.html" /> <link rel="alternate" hreflang="en-GB" href="http://uk.example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> </head> 文字コード例 ISO 639-1 ISO 15924 ISO 3166-1 Alpha 2 言語 文字体系 地域 ja ja zh-Hant-HK zh Hant HK zh-Hant-TW zh Hant TW zh-Hans zh Hans en-US en US en-GB en GB en en 言語コードの構成 言語 文字体系 (もしあれば) 言語コードの要素 地域 (もしあれば) ー ー zh [t] Traditional Chenese [s] Simplified Chenese Hant
  39. 出典:Search Consoleヘルプ > ページのローカライズ版について Google に知ら る https://support.google.com/webmasters/answer/189077?hl=ja <head> <title>Example Corporation</title>

    <link rel="alternate" hreflang="ja" href="http://example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-HK" href="http://hk.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hant-TW" href="http://tw.example.com/page.html" /> <link rel="alternate" hreflang="zh-Hans" href="http://cn.example.com/page.html" /> <link rel="alternate" hreflang="en-US" href="http://us.example.com/page.html" /> <link rel="alternate" hreflang="en-GB" href="http://uk.example.com/page.html" /> <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" /> </head> 文字コード例 ISO 639-1 ISO 15924 ISO 3166-1 Alpha 2 言語 文字体系 地域 ja ja zh-Hant-HK zh Hant HK zh-Hant-TW zh Hant TW zh-Hans zh Hans en-US en US en-GB en GB en en 言語コードの構成 言語 文字体系 (もしあれば) 言語コードの要素 地域 (もしあれば) ー ー zh TW Hant
  40. 中国語サイト用言語コード例 中国本土向け 台湾・香港向け 迷ったら ここから 1. zh 2. zh-CN 3.

    zh-TW 4. zh-HK 5. zh-Hans 6. zh-Hant 7. zh-Hans-CN 8. zh-Hant-TW 9. zh-Hant-HK 中文 中文 中国(簡体字) 中文 台湾 (繁体字) 中文 簡体字 中文 繁体字 中文 繁体字 台湾 中文 繁体字 香港 中文 香港 (繁体字) 中文 繁体字 中国
  41. 多言語化プラグインでできること(例) 1. 言語スイッチャー 2. 言語毎のサブディレクトリ・サブドメイン設定 3. Googleに必要なHTMLコードを追加 4. 自動翻訳機能 5.

    .mo .po ファイルを使わないテーマ・プラグインの 翻訳管理 6. プロ翻訳依頼(追加料金) 7. 無料/有料(買い切り、サブスクリプション制)
  42. 1. 言語スイッチャー 2. 言語毎のサブディレクトリ・サブドメイン設定 3. Googleに必要なHTMLコードを追加 4. 自動翻訳機能 5. .mo

    .po ファイルを使わないテーマ・プラグインの 翻訳管理 6. プロ翻訳依頼(追加料金) 7. 無料/有料(買い切り、サブスクリプション制) 多言語化プラグインでできること(例) 一つだけ or 多機能 いろいろ あります
  43. WordPressで多言語サイトを構築する4つのアプローチ 1. シングルサイトの一部として追加  でにあるウェブサイトの一部に多言語ページを構築 ...「必要最小限のコンテンツだ 」「小規模導入」「プロモーションはSNS メイン etc.」 2. シングルサイトを複数構築

    言語毎に、全 別々のサイトと て構築 ...「言語 とに担当者あり」「 っ り予算」「大企業・大規模サイト向 」 3. マルチサイト+プラグインで構築 WordPressのマルチサイト機能とプラグインを活用 て統一管理 可能 ...「小~中規模」「管理 楽」「言語 とに編集スタッフのアカウント分 可能」 4. シングルサイト+プラグインで構築 プラグインの活用で翻訳や言語スイッチをサポート ...「小~中規模」「管理 楽」「プラグイン 多 、多機能」 マルチサイト向けプラグインを使用 シングルサイト向けプラグインを使用
  44. 多言語サイト構築でよく使われるプラグイン WordPress 特徴 費用 備考 WPML シングル サイト 投稿ページ、固定ページ、カスタムタイプ、タグ、カテゴリー、カ スタムタクソノミー、メニュー(カスタムフィールド、ウィジェッ

    ト、テーマ、プラグイン) 翻訳管理機能 有料 〇 充実 た機能 〇 本文だ ではな 、メニューや見出 の翻訳も対応 × 機能を多 て、 には使い な ない × 他プラグインへの乗換え 困難 qTranslate X シングル サイト 無料 〇 無料プラグイン 〇 直感的に利用 や いUI × 最終更新日 2016年 × 複数言語のコンテンツを1記事内に保存 WEGLOT シングル サイト SaaSサービス:Weglotサーバーで翻訳管理 機械翻訳・自己翻訳・プロ翻訳 無料・有料 1言語2,000語まで無料 それ以上は継続課金 Polylang シングル サイト 自己翻訳 (Lingotek Translation利用で、機械翻訳・プロ翻訳も利用可) 無料 迷ったら れで。 BOGO シングル サイト 無料 Contact Form 7作者の三好 ん MultilingualP ress マルチ サイト 投稿ページ、固定ページ、カテゴリ、タグ、タクソノミー、カスタ ム投稿タイプの多言語化 無料・有料 5.0以降対応は有料 Multi Language Switcher マルチ サイト 無料 〇 シンプルな設定画面で、直感的に操作で 簡単 × メディアアップロード 複数回必要 × シンプル過 て、多 を望めない
  45. • 「グーテンベルグ」プ ロジェクト第4フェー ズで多言語対応予定 • 本体の対応でプラグイ ン 不要になる? • 2020年後半

    ? Long term roadmap While we expect to need most or all of 2019 to finish phase 2 of Gutenberg, there are already plans for Phase 3 and 4. Phase 3 will focus on collaboration and multi-user editing. Phase 4 will contain support for multilingual sites. https://wordpress.org/about/roadmap/