神社のメディアサイトを多言語した話 vol.02

by 清水宏積

Slide 1

Slide 1 text

Okayama WordPress Meetup #4 令和元年9月21日ひだちデザイン　清水宏積神社のメディアサイトを多言語化した話

Slide 2

Slide 2 text

清水宏積和風デザイナー（Web / グラフィック / マーケティング）和風デザイナーひだち清水：@hidachi̲shimizu(Twitter) Shimizu Hirokazu

Slide 3

Slide 3 text

和風デザイナーって何？？和風カフェ・着物着付け教室・神社などのホームページ・ロゴ・御朱印帳ブランディングデザインやマーケティングもやってます。

Slide 4

Slide 4 text

Okayama WordPress Meetup #4 神社のメディアサイトを多言語化した話

Slide 5

Slide 5 text

どんなサイトか？

Slide 6

Slide 6 text

どんなサイトか？神社関係者さま、公式ライターしか投稿できない神社の情報サイト。

Slide 7

Slide 7 text

今回使用したWordPressプラグインなどテーマオリジナルテーマプラグイン Polylang

Slide 8

Slide 8 text

Polylang プラグイン Polylang 通常どおりに投稿、ページを作成、カテゴリ、投稿タグを作成してから、それぞれの言語を定義できるプラグインです。参考：https://ja.wordpress.org/plugins/polylang/

Slide 9

Slide 9 text

Polylangの使い方

Slide 10

Slide 10 text

サイトを多言語したフロー

Slide 11

Slide 11 text

サイトを多言語したフロー失敗パターン

Slide 12

Slide 12 text

サイトを多言語したフロー多言語化は記事がたまってでいいや失敗パターン

Slide 13

Slide 13 text

サイトを多言語したフローリサーチ、コンセプト制作（将来的に多言語） 1

Slide 14

Slide 14 text

サイトを多言語したフローリサーチ、コンセプト制作（将来的に多言語） 1 デザインを作る 2

Slide 15

Slide 15 text

リサーチ、コンセプト制作（将来的に多言語） 1 デザインを作る 2 メディアサイトを作る 3 サイトを多言語したフロー

Slide 16

Slide 16 text

リサーチ、コンセプト制作（将来的に多言語） 1 デザインを作る 2 メディアサイトを作る 3 コラムや神社の情報をためていく 4 サイトを多言語したフロー

Slide 17

Slide 17 text

リサーチ、コンセプト制作（将来的に多言語） 1 デザインを作る 2 メディアサイトを作る 3 コラムや神社の情報をためていく 4 多言語化する 5 サイトを多言語したフロー

Slide 18

Slide 18 text

多言語経験あるWEBデザイナーさん

Slide 19

Slide 19 text

多言語経験あるWEBデザイナーさん超それ大変っすよ

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

たまった神社情報やコラムの翻訳大変やんけその一たまった神社情報やコラムの翻訳大変やんけその一

Slide 22

Slide 22 text

たまった神社情報やコラムの翻訳記事の翻訳数十件の記事を一つ一つ翻訳する作業が発生タグ・カテゴリタクソノミー連携数十件のタグ・カテゴリー・タクソノミーを翻訳して連携する作業が発生時間とモチベーションを失う・・・

Slide 23

Slide 23 text

デザインの微調整大変やんけその二

Slide 24

Slide 24 text

デザイン調整日本語の文 EN LANG Characters are included. Characters are included. Characters are included. 文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章日本語と英語では文字数などが変わってくる。また、文字を入れている画像の画像の作り直しなどが発生

Slide 25

Slide 25 text

テーマのカスタマイズ大変やんけその三

Slide 26

Slide 26 text

テーマのカスタマイズドメイン後に/en/となる時にheaderとFooter違うものを読み込ませている 1 固定ページのテンプレートは全て日本語と英語のテンプレートを用意 2 Google Mapsを使っている場所の翻訳ルールを決めるのが大変。 3

Slide 27

Slide 27 text

日本人の目が良すぎる大変やんけその四

Slide 28

Slide 28 text

日本人の目が良すぎる日本向けデザイン海外向けデザイン日本人は淡い色など認識出来るが海外の方はぼやけて見えてしまう場合があります

Slide 29

Slide 29 text

コンセプトの段階で多言語の範囲を決める 1 こういうフローで多言語しよう

Slide 30

Slide 30 text

コンセプトの段階で多言語の範囲を決める 1 日本と海外向けのデザインを作る 2 こういうフローで多言語しよう

Slide 31

Slide 31 text

コンセプトの段階で多言語の範囲を決める 1 日本と海外向けのデザインを作る 2 メディアサイトを作る 3 こういうフローで多言語しよう

Slide 32

Slide 32 text

コンセプトの段階で多言語の範囲を決める 1 日本と海外向けのデザインを作る 2 メディアサイトを作る 3 多言語化対応する 4 こういうフローで多言語しよう

Slide 33

Slide 33 text

コンセプトの段階で多言語の範囲を決める 1 日本と海外向けのデザインを作る 2 メディアサイトを作る 3 多言語化対応する 4 記事ながら翻訳をする 5 こういうフローで多言語しよう

Slide 34

Slide 34 text

こういうフローで多言語しよう多言語化は、コンセプトや企画時から始まっています！メディアサイトを多言語化するのはかなり大変なので、まずは多言語化する必要のあるものは始めから多言語化しちゃいましょう！

Slide 35

Slide 35 text

ご清聴いただきまして誠にありがとうございました！ twitter. ひだちしみず（@hidachi̲shimizu）