電子書系列/直式的語法!

更新 發佈閱讀 3 分鐘
raw-image

多數的繁體中文書都是「直式」文字(日文或韓文也多有直式),在文字的走法是由右至左,橫式則是由左至右!*大量的文字書,我還是習慣讀「直式」,進到電子書的版面,我還是會選擇「直式」來閱讀。

*很早年很早年的中文橫式字是由右至左。

就紙本書來說直式的文字走向,在編輯就有不少細節,像是一到三個的英文縮寫或數字轉正(英文字母多半建議使用全形,但現在的編輯都懶得改全形?)年份、月分、日期改中文(2020=二◯二◯)⋯⋯那麼直式的電子書有什麼細節嗎?

在紙本書裡「把字轉正」這件事在indesign是用字元樣式或段落格式來設定,每設定一種,在電子書的CSS裡就要多寫一種,例如轉正字體是class=”tcy”(多數使用tcy)、明體字可能會是class=”mfont”、粗體字是class=”bold”(或呼叫字體設定)⋯⋯

比如說:

MLB球星大谷翔平本季有望達成50轟50盜前所未有的記錄。

如果你的MLB不用全形、50不用中文在語法裡會是:

<span class=”tcy”>M</span><span class=”tcy”>L</span><span class=”tcy”>B</span>球星大谷翔平本季有望達成<span class=”tcy”>50</span>轟<span class=”tcy”>50</span>盜前所未有的記錄。

除了「文字」上的編輯外(這裡就不在文字編輯贅述了。)在電子書的語法使用就會牽涉到版面邏輯思考這件事。

若要強制直式在電子書裡需要做語法的更動。在.opf的設定在這行

<meta property=”rendition:orientation”>auto</meta>

auto改成portrait

在spine改成「由右到左」的rtl

<spine page-progression-direction=”rtl”>

在xhtml碼裡的<html>中要加進class=”vrtl”。當然CSS裡也要有vrtl這個的設定。在台灣EPUB 3製作指引的範本裡都是寫好的。而上述幾個設定是各自修改的設定。

通常除非委託者要求「強制」直式,我多半不會主動設定為直式,而是把選擇權交給讀者(但目前能流暢橫直切換的閱讀器只有mooink?)

但是在內頁的語法裡,還是必須把「直式」的語法寫進CSS,以免有讀者在轉成直式時版面變成亂七八糟的。(未來的閱讀器也應該都會朝向橫直皆可的方向去更新才是。)

那麼,直式跟橫式的版面思考差別在哪呢?

以下圖為例,當我們要設定段落和前段的距離不用<br/>來空,而是用數值來空行,那在CSS裡必須把橫與直的語法都寫進去,

raw-image

橫式的是「與下方的距離」,而直式是「與左邊的距離」語法上就會有bottom與left的差異;像「永遠的君主」這一行在「永」前加了色塊,在文字加了線:

橫式的思考是永的「left(左邊)」加色塊、永遠的君主的「bottom(下方)」加線;直式的思考是永的「top(上方)」加色塊、永遠的君主的「左側(left)」加線。

「版面」的上下左右是固定的,當文字轉直時,所有版面的裝飾都必須思考它們與版面上下左右的關係去設定橫式(.hltr)與直式(.vrtl)的語法。

委託者跟我說有些電子書製作者在「直式」的設定還要另外加錢(找我不用啦XDDDD),多數的時候純文字書的確都要把「直式」的語法一起寫進去(不然讀者改直式真的會是災難),但跟紙本書一樣,有些書不適合直式閱讀,那麼也就沒有必要做直式的設定了,例如:數字非常多的、台文書(羅馬字多)都不適合直式閱讀!

至於CSS語法怎麼寫?如果你略懂略懂,寫不出來的可以問ChatGPT,不過你要有基礎概念就是了。XDDDD

圖:20240603GoToBusan,海東龍宮寺的牌匾就是左到右的橫書。


留言
avatar-img
換日線的沙龍
24.1K會員
946內容數
自由工作者、上班族究竟要用什麼樣的心態去面對呢?來看線線怎麼說;業餘的時候,也來跟線線一起看劇看電影及看書;有空的話一起來學做出版、編輯和電子書吧!
換日線的沙龍的其他內容
2025/02/24
看到一個推理故事用一本書來講這種關於版面與閱讀之間的關係,雖然故事我沒有特別喜歡,我也會力薦所有做書的人都應該讀這本書!
Thumbnail
2025/02/24
看到一個推理故事用一本書來講這種關於版面與閱讀之間的關係,雖然故事我沒有特別喜歡,我也會力薦所有做書的人都應該讀這本書!
Thumbnail
2025/01/06
自出版,是一件非常有意思的事!做書也是。但完全的先決條件就是「你想做,你去找方法做,你去學習怎麼做,你要非常的積極!」自己做不來,找人做,找人做之前,把「你該做的部分做好!」積極的!沒有人應該為了你想做的事替你積極,如果你都意興闌珊了,誰在意你呢!
Thumbnail
2025/01/06
自出版,是一件非常有意思的事!做書也是。但完全的先決條件就是「你想做,你去找方法做,你去學習怎麼做,你要非常的積極!」自己做不來,找人做,找人做之前,把「你該做的部分做好!」積極的!沒有人應該為了你想做的事替你積極,如果你都意興闌珊了,誰在意你呢!
Thumbnail
2024/09/28
不要邊抱怨自己工作要死要活、加班加得昏天暗地,老闆還在那邊靠北自己的產值不夠,又邊用蠢方法工作,然後覺得自己社畜得要死,好像全天下只有自己忙得要死要活還沒人感謝。嗯,有時候只得說:用錯的方法工作,加班,真的是,自找的!
Thumbnail
2024/09/28
不要邊抱怨自己工作要死要活、加班加得昏天暗地,老闆還在那邊靠北自己的產值不夠,又邊用蠢方法工作,然後覺得自己社畜得要死,好像全天下只有自己忙得要死要活還沒人感謝。嗯,有時候只得說:用錯的方法工作,加班,真的是,自找的!
Thumbnail
看更多
你可能也想看
Thumbnail
在 vocus 與你一起探索內容、發掘靈感的路上,我們又將啟動新的冒險——vocus App 正式推出! 現在起,你可以在 iOS App Store 下載全新上架的 vocus App。 無論是在通勤路上、日常空檔,或一天結束後的放鬆時刻,都能自在沈浸在內容宇宙中。
Thumbnail
在 vocus 與你一起探索內容、發掘靈感的路上,我們又將啟動新的冒險——vocus App 正式推出! 現在起,你可以在 iOS App Store 下載全新上架的 vocus App。 無論是在通勤路上、日常空檔,或一天結束後的放鬆時刻,都能自在沈浸在內容宇宙中。
Thumbnail
vocus 慶祝推出 App,舉辦 2026 全站慶。推出精選內容與數位商品折扣,訂單免費與紅包抽獎、新註冊會員專屬活動、Boba Boost 贊助抽紅包,以及全站徵文,並邀請你一起來回顧過去的一年, vocus 與創作者共同留下了哪些精彩創作。
Thumbnail
vocus 慶祝推出 App,舉辦 2026 全站慶。推出精選內容與數位商品折扣,訂單免費與紅包抽獎、新註冊會員專屬活動、Boba Boost 贊助抽紅包,以及全站徵文,並邀請你一起來回顧過去的一年, vocus 與創作者共同留下了哪些精彩創作。
Thumbnail
高中中學主題練習—兩點求直線
Thumbnail
高中中學主題練習—兩點求直線
Thumbnail
高中中學主題練習—兩點求直線
Thumbnail
高中中學主題練習—兩點求直線
Thumbnail
高中中學主題練習—點斜式
Thumbnail
高中中學主題練習—點斜式
Thumbnail
高中中學主題練習—點斜式
Thumbnail
高中中學主題練習—點斜式
Thumbnail
文字創作 題目:〈 正向 〉 如若能觸動您的心 歡迎追蹤分享。
Thumbnail
文字創作 題目:〈 正向 〉 如若能觸動您的心 歡迎追蹤分享。
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News