“...所有的元素都是正方體。但是從二十世紀(jì)開(kāi)始使用標(biāo)點(diǎn)後,到了現(xiàn)代桌上出版時(shí)代,許多排版工具軟體都直接套用來(lái)自日本的「禁則處理」—即避頭尾點(diǎn);加上與西方文字混排的狀況越來(lái)越多,以至於無(wú)法做到縱橫對(duì)齊的基礎(chǔ)。但是至少段落的頭尾還是需要對(duì)齊。這就是為什麼對(duì)齊對(duì)電子書(shū)與長(zhǎng)文章來(lái)說(shuō)十分重要的原因。”
——董福興《簡(jiǎn)單做好中文排版》
在英文的段落排版中,通常是左側(cè)對(duì)齊,而讓右側(cè)自然形成起伏邊(rag)。對(duì)中文排版與閱讀習(xí)慣而言則相反,段落的頭尾對(duì)齊尤其重要。
先來(lái)看一個(gè)反例:
這是Zaker的新聞?wù)牡谋憩F(xiàn),在夾雜了數(shù)字或英文字母字符的情況下,原本中文的整齊排列被打亂了,右側(cè)嚴(yán)重參差不齊,非常難看。
看看同一篇文章其它App是怎么處理的:?
左邊是網(wǎng)易云閱讀,右邊是網(wǎng)易新聞。兩者的處理方式類(lèi)似,都是通過(guò)程序的設(shè)置,微調(diào)文字的間距以補(bǔ)足右邊存大的空白,區(qū)別是當(dāng)標(biāo)點(diǎn)出現(xiàn)在行末時(shí),網(wǎng)易云閱讀將標(biāo)點(diǎn)外置,而網(wǎng)易新聞將標(biāo)點(diǎn)放在了內(nèi)部。
文字的對(duì)齊方式,可以用簡(jiǎn)單的代碼實(shí)現(xiàn):
Web App中,使用CSS類(lèi)中指定justify屬性值控制即可,以下為兼容性較佳的方案
.space-betw { -webkit-box-pack: justify; -moz-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between;}
原生iOS中,需為字符串對(duì)象設(shè)置NSTextAlignmentJustified值
- (NSDictionary *)demoTextAttributes { NSMutableParagraphStyle *ps = [NSMutableParagraphStyle new]; ps.alignment = NSTextAlignmentJustified; // here, NSBaselineOffsetAttributeName must be set though the default value is 0 to make the justified work. return @{NSParagraphStyleAttributeName :ps, NSBaselineOffsetAttributeName : @0.0f};}
這個(gè)方法,結(jié)合之前我們通過(guò)柵格系統(tǒng)對(duì)字號(hào)和文本容器寬度的規(guī)范定義,終于可以避免App中常見(jiàn)的段落文字對(duì)不齊,對(duì)不準(zhǔn)的老問(wèn)題。
更多建議: