Mon, May 24

23:02 #vjlive2010 次はUstreamでやった方が良いかもしれない....
22:59 おっ、うまくいきましたか。よかった。 RT @shin_634 Stanzaでもバッチリ（http://bit.ly/ayCmrO） RT @commonstyle #vjlive2010 Adobe Digital Editionsでも読めるEPUBです（直接、EPUBファイル
22:56 #vjlive2010 ←今日のEPUB電子書籍オーサリングで使った素材（text, xhtml, svgなど）です。ZIPファイルにリンクしています。 http://admn.mobi/dmy/ebook/20100524_ebook_set.zip
22:50 @nakagawakun オーサリングの環境も良くなりそうですし、アイデアを持っている人はすぐに具現化できて、面白くなりそうですね。Ustreamで中継しながら、ソーシャルストリームに向けて電子書籍を配信するとか... [in reply to nakagawakun]
22:45 #vjlive2010 サンプルの文字量が足りないので空いてますが、2段組みと3段組み。ADEだと、段組みの設定ができますので、大きなディスプレイで読む人のために調整しておきます。 http://twitpic.com/1qmp3w
22:34 #vjlive2010 PCとiPhoneで確認。読者のデバイスに（テキストも図版も）自動的に最適化されるのが、リフロー系の利点。このサイズをPNGにするとデータサイズが、3倍になります。こういう図版なら、SVGで。 http://twitpic.com/1qmm44
22:27 #vjlive2010 Adobe Digital Editionsでも読めるEPUBです（直接、EPUBファイルにリンクしています）。 http://admn.mobi/dmy/ebook/20100524_ebook.epub
22:24 #vjlive2010 Adobe Digital Editions対策で、lang="ja" xml:lang="ja"を追加。この作業は、Windowsで（拡張子を変えるだけ）。Macだと、かなり面倒ですよね？ http://twitpic.com/1qmjoz
21:52 #vjlive2010 EPUBのファイルをアップデート（上書き）しましたので、iPhone Stanzaでダウンロードできます。図版が切れることはありませんが、意図せぬ空きができたりします（リフロー処理）。 http://twitpic.com/1qmb8m
21:38 #vjlive2010 EPUBファイルにSVGを挿入して、CSSファイルに「img { max-width: 100%; }」を記述。iPhoneとAdobe Digital Editionsの画面、両方に最適化できるよう http://twitpic.com/1qm7bn
21:27 #vjlive2010 SVGファイルのリンクです（多分、ほとんどのブラウザでそのまま表示されると思います）データサイズは82KBで、PNGの半分以下になりました。： http://admn.mobi/dmy/ebook/vol13_04.svg
21:22 #vjlive2010 日本語フォント埋め込みについては、諸々クリアしなければいけないことが多い.... ので、ここではアウトライン化。
21:20 #vjlive2010 SVGは、オープンソースのInkscapeが良いと思うのですが、Illustratorで作成した図版を使うので、AIから変換します。 http://twitpic.com/1qm3cq
21:10 #vjlive2010 オーサリングの作業に戻って、次は図版を配置していきます。写真以外の図版は、データサイズを小さくするためSVGフォーマットです。
21:07 #vjlive2010 縦書きビューワでも確認。同じEPUBの本なのに、縦書きで表示されると別物に見えてしまいますね... http://twitpic.com/1qm0iy
21:04 #vjlive2010 Androidでも問題なし。Aldikoでもブックカバーが反映されます。可読性は、iPhoneのStanzaと同じくらい（iPhoneの方がちょっと上かな...）。 http://twitpic.com/1qlztz
20:21 #vjlive2010 ...ということで、iPhone, iPod touch, iPadでは問題なさそうなので、Androidでもチェックしておきます。AndroidはUSBでコピーしないといけない....面倒..
20:17 #vjlive2010 オーサリングソフトのTOC Editorで設定したものが、リーダーアプリの目次にそのまま反映されます。ページの見出しと目次の項目名を変えたい場合は、title属性を使います。 http://twitpic.com/1qloyv
20:13 #vjlive2010 iPhone Stanzaでダウンロードすると、ブックカバーが反映されます。iTunesでブックカバーを表示するには、EPUB内にiTunesArtworkファイルを入れますが、後ほど。 http://twitpic.com/1qlntb
19:57 #vjlive2010 iPhoneのStanzaに「http://design-zero.tv/2010/mailmagazine/iphone/」を入力すると、ダウンロードできます。Stanzaの本棚には、先ほど挿入したブックカバーが表示されています
19:55 #vjlive2010 「lang="ja" xml:lang="ja"」を記述してませんので、Adobe Digital Editionsでは文字化けします。iPhoneもしくは、iPad専用ということで。最後に、パソコンでも読みやすいように修正します
19:52 #vjlive2010 作業途中のEPUBのダウンロードURLをこの後ツイートします。iPhoneで、ダウンロードする方法はここをご参考に。 http://tinyurl.com/ydjpyln
19:42 #vjlive2010 では、ここまでを保存して、iPhoneで確認してみます。iPhoneのStanzaをお持ちの方はこの後のツイートで... http://twitpic.com/1qli3i
19:37 連載記事の方ではわかりやすくまとめますので.. RT @shin_634 準備OKです！ RT @commonstyle #vjlive2010 それでは執筆開始します。時間のある方は、Sigilをダウンロード　http://code.google.com/p/sigil/
19:31 #vjlive2010 書籍のメタデータを入力。TOCとメタデータを忘れると、電子書籍ではなく、Webページになってしまうのでご注意.... http://twitpic.com/1qlfy9
19:25 #vjlive2010 章ごとにチャプターブレイクを挿入（※前の章の"最終行の後"に挿入です）。TOC Editorのエントリー数と一致します http://twitpic.com/1qldxc
19:22 只今、実践中です（笑 RT @melemanna @commonstyle 音声文章同時にoutput= 超ヤバイ脳活性化な感じがします(^^)
19:15 #vjlive2010 ページを分割したい箇所でチャプターブレイクを挿入していきます。XHTMLファイルは自動的に分割されていきます。1つの長いXHTMLファイルだとリーダー上で重たくなるので.. http://twitpic.com/1qlccp
19:03 #vjlive2010 ブックカバーの右側にカーソルが点滅しているのを確認して、チャプターブレイク！（InsertメニューのChapter Break） http://twitpic.com/1qla4e
18:54 #vjlive2010 1行目を改行して、ブックカバー画像を挿入（InsertメニューのImage）。 http://twitpic.com/1ql88y
18:49 #vjlive2010 ブックカバーは、とりあえずこれで。 http://tinyurl.com/26fhtnc iPhone StanzaやiBooksの本棚に表示されるので、ブックカバーは軽視できません！ 今回はサンプルなので...
18:44 #vjlive2010 Sigilの画面をブックビューに切り替えて、いよいよ電子書籍のオーサリング。先ほどのCSSスタイルの指定が反映されてます（見出しが小さくなってます）。 http://twitpic.com/1ql6gh
18:39 #vjlive2010 ToolsメニューのTOC Editorを選び、構造化されているか確認。これが、iPhone StanzaやiPad iBooksの目次になります。 http://twitpic.com/1ql5je
18:33 #vjlive2010 XHTMLのタブをクリックして切り替え、body要素内に先ほどのマークアップファイルの内容をコピー＆ペースト。 http://twitpic.com/1ql4g5
18:29 #vjlive2010 CSSファイルをダブルクリックして、基本的なスタイルだけ記述。1行目のpageの記述は、Adobe Digital Editionで読みやすくするため。 http://twitpic.com/1ql3nb
18:20 #vjlive2010 先にCSSファイルを作っておきました。 http://twitpic.com/1ql261
18:14 #vjlive2010 続けて、左の「Styles」フォルダを右クリックして「Add New Item」を選択。CSSファイルを作成しておきます。 http://twitpic.com/1ql0tl/full
18:12 #vjlive2010 head要素内に <link rel="stylesheet" href="../Styles/Style0001.css" type="text/css" /> を記述しておく。 http://twitpic.com/1ql0tl/full
18:06 #vjlive2010 それでは、EPUBの作業に進みます。Sigilを起動してコードビューに画面を切り替えます。まず、CSSのリンクを記述した方がいいね...多分。 http://twitpic.com/1qkzzp
18:00 #vjlive2010 ジェネリックフォーマットにしました。EPUBの電子書籍なので、XHTML 1.1でマークアップしたファイルを汎用フォーマットとして扱います。 http://tinyurl.com/25ndlog
17:46 #vjlive2010 サブミッションフォーマットは、プレーンテキストです。これから、本の構造化。Webメディアの連載記事なので、書籍の構造をあてはめるのは少々強引ですが...
17:43 #vjlive2010 まずは、サブミッションフォーマット、つまり原稿ファイル。前回の記事原稿を使います（※編集担当さんの修正が入っていない一番最初の原稿）。 http://tinyurl.com/23893fw
17:29 #vjlive2010 それでは執筆開始します。時間のある方は、Sigilをダウンロードしておいてください。　http://code.google.com/p/sigil/
17:21 執筆しながら収録すればいいのか....
17:20 今日のPodcastでも、EPUB電子書籍のワークフローについてお話しますが（雨が降ったら中止になるかも...）、音声で解説できないことも多いので、連載記事の方をあわせてご覧ください。
17:14 iPad発売記念...として、高校生向けのEPUB電子書籍オーサリングのカリキュラムをさらにわかりやすく執筆中（今週中にアップされます→ http://tinyurl.com/ybltsah ）作業のUstreamも配信中
02:31 iPhoneのビデオ編集アプリでは最強ですね。1,200円。スマートフォンでここまで可能になったか... "1st Video Consumer" http://www.youtube.com/watch?v=J88WDferv3s
02:03 #Podcast #vjlive2010 第554回 配信しました。［file-554］電子書籍は複数のフォーマットで提供 | Vol.005 電子書籍オーサリングダイアリー - 新しい書籍のカタチ（125）: http://tinyurl.com/24z8l9a
Powered by twtr2src <http://twtr2src.ogaoga.org/>