蘋果中國:
你好。我是一名設計師,有點強迫症,來信是為蘋果中國的網站提一些建議。
看完蘋果發布會的直播後,我瀏覽了下英文網站的介紹,準備睡覺。臨睡時看了一眼微博,發現一堆人都在驚呼蘋果中國的網站太醜了。於是我上了一下國內網站,問題真的誇張。
問題頁 http://www.apple.com/cn/iphone-6/ 及其子頁面
除了蘋果中國那「除卻英文還不是中文」的神翻譯,最大的問題無非就是字體。涉及字體問題的頁面是「iPhone 介紹」全局的,我只截取了兩個比較典型的圖片。
以下是英文網站對照:
可以看到中文網站的問題是無論中文還是英文字體的設計都沒有堅持英文網站字體的細度。而且因為這樣的字體選擇導致一些地方文字居然「撐破了」圖片的布局,更無所謂「構圖」了。
於是我通過檢查器查看了相關字體的設置是這樣寫的:
font-family:"PingHei","Helvetica Neue」,"Helvetica","Arial","Verdana","sans-serif";
看上去沒什麼大問題,排在第一順位的是「PingHei」,但我發現網頁中調用的中文並不是「PingHei」。
PingHei 也叫「平黑」,是蘋果中國委託「常州華文」製作的一款具有標誌性意義的字體,也是蘋果「御用」黑體,通常會用在蘋果的網站或包裝設計當中。因為這款字體的特殊性,它並沒有授權任何第三方機構使用更沒有預裝到任何系統當中。
因為用戶電腦裡沒有預裝,想要保證最終還能以平黑字體來顯示的話,則需要使用 Webfont(網頁字體)技術來告訴瀏覽器從網絡上的某個地址下載調用該字體。
我查看了蘋果中國網站是否在對應的地方提供了地址,找到了下面的設置:
可以看到下面的一行是,網站對平黑字體網絡地址的聲明,而上面那行則是在個別地方有用到的蘋果英文御用字體「Myriad Set Pro」的聲明。
但我通過瀏覽器檢驗: http://www.apple.com/uat2.iapps.apple.com/wss/fonts?family=Myriad+Set+Pro&weights=100&v=1 和 http://www.apple.com/uat2.iapps.apple.com/wss/fonts?family=PingHei&weights=200&v=1 卻沒有返回任何信息。
於是我在英文網站中找到了對應的聲明地址是這個: http://www.apple.com/wss/fonts?family=Myriad+Set+Pro&v=1 所以我懷疑蘋果中文網站應該是因為網站更新時間準備不足,而把字體的映射目錄弄錯了,根據找到這個英文字體的地址,我推測了平黑的地址應該為: http://www.apple.com/wss/fonts?family=PingHei&weights=200&v=1 所以我用下面的兩段代碼替換了網頁中原有的聲明地址:
然後世界太平了。
▲ 這是之前
▲ 這是之後
▲ 這是之前
▲ 這是之後
希望蘋果中國能儘快修復這一 Bug,並且在下次上線前讓相關設計「檢查」一下。
同時想通過截圖報導蘋果中國網站的媒體或者有強迫症的設計師,也可以先通過自己手動修改的方式來獲取這樣的顯示效果。
感謝各位關注我的微信公眾帳號:「強迫症設計詩」,ID 是 OCDesigner。
「公開信」會是我文章寫作基本方式,本文是這個系列的第三篇文章,以後我還將繼續寫作類似文章,如果你希望,不妨掃描下方的二維碼關注我吧。