よみがな　あり｜なし

前回のログで、とあるテストプログラムを作成中と申し上げましたが、なんとか動くようになりましたので動作テストを兼ねてお披露目。

「よみがな」が表示できるようになりました。
右上の「よみがな　あり｜なし」をクリック（あるいはタップ）して、よみがな表示を切り替えることができます。

現在、スタジオムーンリーフでは小学生くらいのこどもが自主的に閲覧できるウェブコンテンツを模索しておりまして、漢字の扱いが大きな問題になっていました。よみがな（ルビ）を振れば解決しそうなものですが、ルビを振るＨＴＭＬコーディングはちょっと複雑で、いちいち複雑なコーディングをしていたら面倒くさくてかないません。

「なんとか半自動でもいいからプログラムでルビを振れないかな」

とあれこれ探していたら、「キッズgoo」というコンテンツが提供しているルビの振り方が理想形に近いことがわかりました。

キッズgoo
http://kids.goo.ne.jp/

「これに近いものなら、自分で作れるかも」

と試行錯誤で作ってみたのが、スタジオムーンリーフ独自の「よみがな表示機能」です。

仕組みはいたって単純で、目で見てわかるように特定のフォーマットでよみがなを付記したテキストをアップロードするとプログラムが自動でルビを振るＨＴＭＬコーディングをしてくれるという流れです。ただ、プログラム上では、長大なテキストのどこからどこまでが漢字で、どこからどこまでがその「読み」にあたるのかを判別せねばなりません。当ブログの文字コードはバイト可変長のUTF-8を使用しています（UTF-8は１文字あたり１バイト～仕様上最大８バイトの範囲を持つ文字。日本語の全角文字は３バイト長）。全角文字は１文字あたり３バイト。３バイトだと正規表現での検索があやしくなってきたので、かなりゴリ押しで漢字を判別しています。

デフォルトでは、ルビは表示されないのでＳＥＯ的にも考慮した仕組みになっています。おそらく、検索にも引っかかりやすいと思われます。

≫ NEXT_LOG いずれは「制限解除キャンペーン」かな？

≪ PREV_LOG テストプログラム実験場