使用HTML和CSS擁抱本地化和多語(yǔ)言內(nèi)容 展為網(wǎng)絡(luò) 13933871221
隨著Shopify擴(kuò)展到更多國(guó)家/地區(qū)，我們有時(shí)會(huì)遇到設(shè)計(jì)和開發(fā)文化上的差異。UI（用戶界面）的國(guó)際化使目標(biāo)受眾更容易進(jìn)行本地化，而HTML和CSS也可以成為強(qiáng)大的工具，使我們能夠同時(shí)實(shí)現(xiàn)本地化和國(guó)際化。
對(duì)于設(shè)計(jì)師而言，挑戰(zhàn)在于設(shè)計(jì)內(nèi)容時(shí)要考慮本地化，同時(shí)要考慮諸如文本方向或本地語(yǔ)言字符等方面。對(duì)于開發(fā)人員而言，挑戰(zhàn)在于以最少的代碼輸入實(shí)現(xiàn)這些方面。
在本文中，我們著眼于六個(gè)注意事項(xiàng)，它們將幫助您在構(gòu)建本地化產(chǎn)品時(shí)達(dá)到這兩個(gè)要求。
另外，一定要檢查一下偽本地化如何幫助您為國(guó)際化構(gòu)建。
通過Shopify合作伙伴計(jì)劃發(fā)展您的業(yè)務(wù)
無論您提供市場(chǎng)營(yíng)銷，定制服務(wù)還是網(wǎng)站設(shè)計(jì)和開發(fā)服務(wù)，Shopify合作伙伴計(jì)劃都將助您成功。免費(fèi)加入并獲得收益分享機(jī)會(huì)，發(fā)展業(yè)務(wù)的工具以及充滿激情的商業(yè)社區(qū)。
1.寫作模式
html本地化：垂直
垂直顯示字符的中國(guó)旅游區(qū)標(biāo)志。
writing-mode: vertical-lr;
該writing-mode屬性設(shè)置內(nèi)容的書寫方向，例如，水平或垂直。
當(dāng)設(shè)計(jì)通過應(yīng)用垂直放置的內(nèi)容時(shí)，writing-mode: vertical-lr與拉丁語(yǔ)腳本（包括阿拉伯?dāng)?shù)字和表示法）相反，東方語(yǔ)言腳本中的字符不會(huì)旋轉(zhuǎn)。在日本的Shopify合作伙伴特權(quán)頁(yè)面上，從更改transform: rotate(90deg)為writing-mode: vertical-lr，為日語(yǔ)用戶創(chuàng)建正確的顯示，并且仍然保持英語(yǔ)語(yǔ)言環(huán)境不變。
html本地化：旋轉(zhuǎn)
使用transform旋轉(zhuǎn)日語(yǔ)字符：transform: rotate(90deg)。
html本地化：lr
使用垂直書寫模式旋轉(zhuǎn)日語(yǔ)字符：writing-mode: vertical-lr;。
出于純裝飾目的，writing-mode仍然提供sideways-lr和sideways-rl，其結(jié)果與transform: rotate(90deg)和相同transform: rotate(-90deg)。當(dāng)前僅在Firefox中支持側(cè)寫模式。
日語(yǔ)和漢語(yǔ)的傳統(tǒng)內(nèi)容應(yīng)從右到左排列。陳慧晶展示了中國(guó)字體在傳統(tǒng)垂直布局和現(xiàn)代水平布局之間的轉(zhuǎn)換，以突顯它們之間的差異。寫作模式旨在處理內(nèi)容顯示中的文化差異，這對(duì)于本地化很重要。
您可能還會(huì)喜歡： 創(chuàng)建多語(yǔ)言數(shù)字產(chǎn)品的技巧。
2. ch長(zhǎng)度單位
max-width: 20ch;
的chCSS長(zhǎng)度單位表示字形“0”的1米半角形式字符寬度。由于東方語(yǔ)言的特性，字符始終具有固定的寬度，包括注解，這被稱為全角形式。當(dāng)ch應(yīng)用于文本寬度時(shí)，全角字符占2ch一個(gè)字符，而拉丁字符半角形式的兩個(gè)字符則占兩個(gè)字符。
html本地化：字符
中國(guó)傳統(tǒng)詩(shī)歌，以豎向從右到左的方式寫成，每列最多包含10個(gè)漢字。
在典型的英語(yǔ)排版中，每行少于60個(gè)字符為佳，這對(duì)于東部語(yǔ)言而言，全寬度形式則意味著每行30個(gè)字符。比較像素值時(shí)，該ch單位適用于所有字體大小，對(duì)于在斷點(diǎn)之間更改字體大小的響應(yīng)式布局很有用。為了排版目的，控制字符數(shù)也更加容易。
3.引號(hào)和多語(yǔ)種內(nèi)容
こんにちは世界
的HTML元素指示在短直列形式報(bào)價(jià)。引號(hào)根據(jù)語(yǔ)言具有不同的外觀。例如，我們使用“”英語(yǔ)
