本文へ


広報とよなか4月号

epub版(抜粋)

広報誌はできるだけたくさんの市民の方に読んでいただきたい媒体ですが、アンケートなどで、年齢層によっては広報誌を全く読まないという結果も出ています。

そこで、比較的紙の媒体を読まない年齢層を視野に入れ、web、端末、スマートフォンなどで閲覧できるよう、汎用性の高いepubで、視覚的に見せている広報誌をどのように表現できるのかを、今回イーパ部の活動を通して試みる機会を得ることができましたので、チームAはそれに取り組みました。

媒体として、「広報とよなか4月号」の過去のデータを許可をいただき使用。 これはイーパ部の活動として独自に制作させていただいたものですので、豊中市の意向とは関係ありません。

制作フロー

八尋担当

  • 広報誌用に作成した
    InDesignデータを流用してepub書き出し

    …の予定でしたが、印刷用に作られたデータは複雑で、 epub書き出し用に調整するのに非常に時間を費やした 上に、エラーで書き出しすらできませんでした 断念

  • 次の工程へ
  • epub書き出し用に、
    InDesignで新規に作成

    本文中に使用されているピクトをテキスト変換や機種 依存文字の修正などのテキストの調整や、画像データ をRGBに変換、写真の代替テキストなど挿入など

  • 次の工程へ
  • epub書き出し

次の工程へ

みるく担当

  • アクセシビリティチェック
    • 写真には適切な代替テキストがあるかどうか
    • 背景色と文字色のコントラスト比は十分取れているか
    • 文章構造に基づいてマークアップされているか
  • 次の工程へ
  • XHTML&CSS修正作業&content.opfとtoc.ncxファイル作成
    • アクセシビリティチェックでひっかかった箇所の修正
    • デザイン通り表示していない箇所の修正
    • いらないタグやid,classを削除
    • content.opfには使用するファイルをすべてここに記述
    • toc.ncxは、目次を作成するファイルなので見出しを記述
  • 次の工程へ
  • EPUBコンテナを作成
    • OEBPSフォルダとMETA-INFフォルダをzip形式で圧縮
    • 圧縮したファイルの形式をepubに変更
    • Windows用の「ePubPack」というツールを使用しEPUBコンテナを作成

次の工程へ

チーム全員

  • レイアウト確認
    Adobe Digital Editions・Firefoxのアドオン・iPad・iPhone・CopperReader・Himawari
  • 次の工程へ
  • 修正
  • 次の工程へ
  • 確認
  • 次の工程へ
  • 修正
  • 次の工程へ
  • 確認
  • 次の工程へ
  • 修正
  • そして
  • 完成

目指したこと

  • アクセシブルにする
  • マルチデバイス対応
  • 上記の条件をクリアしつつ、理解しやすいく退屈しないレイアウト

レイアウトについて

文字と画像・表組をからめた場合、デバイスの幅が変わることにより、レイアウトが大きく崩れます。どのデバイスで表示させても、大きくレイアウトが崩れないよう、ある程度の遊びを考えながら制作しました。

CSSやHTMLの関係上、困難な表示方法もありましたが、できるだけ単調にならず、理解しやすいレイアウトを目指しました。 が、リーダーの解析の仕方の違いによる表示の違いや、特に禁則や約物のツメなど、気になる箇所も多いのですが、現時点で出来ることはやったと思っています。

プロフィール

八尋
グラフィックデザイナー。仕事の大半が雑誌や情報誌、広報誌などのエディトリアルデザイン。
InDesignで作業をしない日はないくらい、InDesignにはお世話になっています。
みるく
フリーのマークアップエンジニア兼ウェブバリアフリー品質保証技術者。 オープンソースのCMS Geeklogのテーマ(日本語コア開発者)、Zen Cartのテーマを作成をしています。

広報とよなか4月号無料ダウンロードはコチラから

| 印刷用ページ