BOHRミーティング vol.161「HTML5最新活用事例! 進化する電子書籍セミナー」イベントレポート

イベントレポート

イベントレポート

  1. HOME
  2. イベントレポート
  3. BOHRミーティング vol.161「HTML5最新活用事例! 進化する電子書籍」イベントレポート

BOHRミーティング「HTML5最新活用事例! 進化する電子書籍」イベントレポートBOHRミーティング「HTML5最新活用事例! 進化する電子書籍」イベントレポート

1/14(水)に「HTML5最新活用事例! 進化する電子書籍」をテーマにしたBOHRミーティングを開催しました。

本セミナーでは、様々な科目の高等学校学習者用デジタル教科書を制作し、近年では教育用電子書籍ビューア「PUBLUS Reader for Education」の開発に貢献された東京書籍株式会社の長谷部直人氏をお招きし、電子書籍をめぐる技術についてお話しいただきました。

高等学校学習者用デジタル教科書の誕生とADPS

今回の講師

東京書籍株式会社 ICT事業本部事業開発部 長谷部 直人 氏

東京書籍株式会社
ICT事業本部事業開発部
長谷部 直人 氏

誕生のきっかけ

東京書籍は1909年に国定教科書という、全国の学校で使用するために国が著作した教科書の印刷や発行を行う翻刻発行会社として創業しました。現在は小学校、中学校、高等学校に向け、様々な教科の教科書、教材を発行しています。

最初に、紙の教科書会社として歴史のある東京書籍が、教科書のデジタル化に興味を持ち、学習者用デジタル教科書を作成するに至った経緯についてお話いただきました。

「きっかけはiPadが2010年に発売されたことでした。当時、iPadを何とか教育に活用することができないかと考えていましたところ、実際に教育現場でiPadを生徒に持たせる教育機関が出てきました。

そこで、iPadで使える教科書のニーズが高まるのではないかと思ったところから、東京書籍の学習者用デジタル教科書開発への取り組みが始まりました」

ADPSとの出会い

iPadの発売、教育機関への普及をきっかけに開始した東京書籍の学習者用デジタル教科書開発への取り組みですが、どのような技術が用いられたのでしょうか。

「当初はWebページのように、HTML形式で作ろうとしました。ただ、教科書のレイアウトは非常に複雑であるため、その紙面をiPadなどの端末上で再現することは至難の業でした。そこで、我々はブラウザベースでの教科書の表現をあきらめた経緯があります。そのときに出会ったのがAdobeRのADPS(Adobe Digital Publishing Suite)というソリューションです。

現在、教科書の編集工程はほぼ100%デジタル化されています。AdobeRのInDesignRというソフトを使用して文章を流し込んだり、紙面レイアウトを整えたりしています。ADPSとInDesignは非常に親和性が高く、ADPSを活用すると、InDesignで編集した紙面をiPad上で忠実に表現することができました」

ADPSとHTML5

「ただし、ADPSだけでは表現できる幅に制約がありました。そこで、ADPSにHTML5を組み合わせることにより、さらに豊かな表現ができるのではないかと考えました。

そして実際にHTML5を組み合わせ、グラフの表示切り替えやシミュレーションが行えるようになるなど、よりインタラクティブなコンテンツを掲載することができました。

例えば、苦手な方が多い理科。実験風景の紹介は、紙の教科書では一枚の写真でしか表現できません。しかしデジタル教科書になれば、実験風景の映像とともに紹介でき、臨場感ある学習が可能になります。他にも、ユーザーの操作に応じて、映像の時間を巻き戻したり進めたり、実験の条件を変更したりと、より細かな操作を行うことができます。

また、皆さんが教科書を使うとき、マーカーで重要なところをチェックされたご経験があるかと思います。試験前に重要な単語をチェックするという作業も、デジタル教科書で実現しています。赤シートを重ねて文字を消す、教科書紙面にペンで書き込みを行うなど、紙の教科書にしていたことと同じようなことも、ADPSとHTML5との組み合わせで表現することができました」

ADPSの弱点

しかし、ADPSにもいくつかの弱点がありました。

「ADPSの弱点の一つは、文字を画像として認識しているということです。PDFのように、文字を拡大するときれいには見えますが、リフロー(※1)ができないという問題があります。また、教科書本文を全文検索できない、音声読み上げができないといった、デジタル教科書としては実現させたかった部分が実現できませんでした。」

※1 リフロー……文字の大きさに応じてレイアウトを柔軟に変化させること。ユーザーの操作に合わせて、ページ内の段組みや表示文字数が変化するため、ユーザーにとって最適な環境を実現できるが、書籍によってはレイアウトが崩れる可能性がある。文字が多く使われる小説やエッセイなどを表現する際に用いられる。

EPUB3で変わる電子書籍

EPUB3の国際標準化

「ADPSとHTML5によるデジタル教科書開発が一段落した2014年の12月中旬、EPUB3という電子書籍フォーマットが国際標準規格として認められました。

EPUB3は電子書籍の規格であるEPUBの最新バージョンです。EPUBは、HTMLやCSS、SVGといった各種Web技術・規格の標準化を進めるW3Cが標準で作っているものをパッケージ化したものです。この流れを受け、新たに東京書籍ではEPUB3に準じたデジタル教科書を開発することにしました。

株式会社ACCESSと協力し、教育用コンテンツを表現するビューア『PUBLUS Reader for Education』の開発を行いました」

EPUB3の日本語対応

「電子書籍用ファイル・フォーマット規格であるEPUBは徐々に改良を重ね、EPUB3になったときに、日本語で一番大きな課題だった縦書き、ルビ(ふりがな)や禁則処理などに対応することができました。

また、リフローにも対応しています。フォントサイズや行間、背景色を自由に変更でき、ユーザーにとって最適な表示を、ユーザー自身が設定できます。文字にテキスト情報を持たせていますので、検索や音声読み上げにも対応可能となっています」

PUBLUS Reader for Educationの特長

「今回開発した『PUBLUS Reader for Education』では、写真や図をタップすると拡大することはもちろんのこと、固定レイアウト(※2)とリフローを組み合わせた「ハイブリッド」表示機能を持っています。固定レイアウトで、紙と同様のレイアウトの紙面を俯瞰することができ、リフロー表示でユーザーの好みに合った文字数や段組が自動的に調整された文字表示が可能となりました」

※2 固定レイアウト……画像や文字などのパーツの配置を固定してコンテンツを表示するレイアウト。紙面の複雑なレイアウトをそのまま表示でき、どのような端末でも同じ見た目で表示できるが、文字や行間などをユーザーがカスタマイズすることができないというデメリットがある。主に、画像や写真が多く使われるマンガや絵本、写真集などを表現するのに適している。

ユーザーが自身の好みに合わせてレイアウトを調整できる「PUBLUS Reader for Education」は、特別な支援を必要とされる学習者の方々への配慮が整っているとも言えます。

「これまでも、弱視や読み障がいなどを抱えられている子どもたちのために、拡大教科書を作成してきました。ただ、紙の場合、文字は一定の大きさしか対応できません。しかし、『PUBLUS Reader for Education』を使えば、閲覧する子どもが使いやすいように文字サイズや行間を変えることができます。白黒反転や書体の変更、さらには文字と背景の色の組み合わせも柔軟に変更することができ、特別な支援を必要とされる学習者の方々がもっと学びやすくなります。まだ発展途上ですが、文字の音声読み上げ機能も搭載することができました。

また、『PUBLUS Reader for Education』はHTML5の技術も積極的に取り入れています。詳細は割愛しますが、どのエリアをクリックしたらどのアクションが発生するのかといった部分を制御することに大変役立っており、コンテンツの豊かでダイナミックな動きをサポートしています。このように、HTML、CSS、SVGといったWebの標準規格と親和性が高いEPUBだからこそ、これまで以上に柔軟でスムーズな開発が行えたと思っています」

電子書籍の未来

参加者からの質問に答える長谷部氏

最後に、今後電子書籍はどのようにして発展していくのかについてお話しいただきました。

「今、文部科学省や総務省が連携し、教育現場にクラウドなどの最先端のIT技術を導入する事業が進んでいます。実際、ここ5年で両省は様々な実証実験を行っています。

デジタル教科書をめぐっては、端末に専用ビューアをインストールし、専用ビューアで閲覧するか、それともどの端末にも一般的に搭載されているWebブラウザで閲覧するか、大きく二つの方向性が検討されています。こうした国の動向を見据え、デジタル教科書の今後の発展に、教科書会社としてますます寄与していきたいと考えています」