給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

蘋果中國:

你好。我是一名設計師,有點強迫癥,來信是為蘋果中國的網站提一些建議。

看完蘋果發布會的直播后,我瀏覽了下英文網站的介紹,準備睡覺。臨睡時看了一眼微博,發現一堆人都在驚呼蘋果中國的網站太丑了。于是我上了一下國內網站,問題真的夸張。

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

之前還有兩篇很火的文,右戳感受強迫癥:
1、《給老羅的公開信!一個設計師關于錘子官網的吐槽》
給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽
2、《給李楠的公開信!一個設計師關于魅族官網的吐槽》
給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽
問題頁

http://www.apple.com/cn/iphone-6/ 及其子頁面

除了蘋果中國那“除卻英文還不是中文”的神翻譯,最大的問題無非就是字體。涉及字體問題的頁面是“iPhone 介紹”全局的,我只截取了兩個比較典型的圖片。

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

以下是英文網站對照:

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

可以看到中文網站的問題是無論中文還是英文字體的設計都沒有堅持英文網站字體的細度。而且因為這樣的字體選擇導致一些地方文字居然“撐破了”圖片的布局,更無所謂“構圖”了。

于是我通過檢查器查看了相關字體的設置是這樣寫的:

font-family:"PingHei","Helvetica Neue”,"Helvetica","Arial","Verdana","sans-serif";

看上去沒什么大問題,排在第一順位的是“PingHei”,但我發現網頁中調用的中文并不是“PingHei”。

PingHei 也叫“平黑”,是蘋果中國委托“常州華文”制作的一款具有標志性意義的字體,也是蘋果“御用”黑體,通常會用在蘋果的網站或包裝設計當中。因為這款字體的特殊性,它并沒有授權任何第三方機構使用更沒有預裝到任何系統當中。

因為用戶電腦里沒有預裝,想要保證最終還能以平黑字體來顯示的話,則需要使用 Webfont (網頁字體)技術來告訴瀏覽器從網絡上的某個地址下載調用該字體。

我查看了蘋果中國網站是否在對應的地方提供了地址,找到了下面的設置:

<link rel="stylesheet" target="_blank"  type="text/css" media=“all">

<link rel="stylesheet" target="_blank" href=“//uat2.iapps.apple.com/wss/fonts?family=PingHei&amp;weights=200&amp;v=1">

可以看到下面的一行是,網站對平黑字體網絡地址的聲明,而上面那行則是在個別地方有用到的蘋果英文御用字體“Myriad Set Pro”的聲明。

但我通過瀏覽器檢驗:

http://www.apple.com/uat2.iapps.apple.com/wss/fonts?family=Myriad+Set+Pro&amp;weights=100&amp;v=1

以及

http://www.apple.com/uat2.iapps.apple.com/wss/fonts?family=PingHei&amp;weights=200&amp;v=1

卻沒有返回任何信息。

于是我在英文網站中找到了對應的聲明地址是這個:

http://www.apple.com/wss/fonts?family=Myriad+Set+Pro&v=1

所以我懷疑蘋果中文網站應該是因為網站更新時間準備不足,而把字體的映射目錄弄錯了,根據找到這個英文字體的地址,我推測了平黑的地址應該為:

http://www.apple.com/wss/fonts?family=PingHei&amp;weights=200&amp;v=1

所以我用下面的兩段代碼替換了網頁中原有的聲明地址:

<link rel="stylesheet" target="_blank"  type="text/css" media=“all">

<link rel="stylesheet" target="_blank" href=“/wss/fonts?family=PingHei&amp;weights=200&amp;v=1">

然后世界太平了。

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

▲ 這是之前

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

▲ 這是之后

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

▲ 這是之前

 

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

▲ 這是之后

希望蘋果中國能盡快修復這一 Bug,并且在下次上線前讓相關設計“檢查”一下。

同時想通過截圖報道蘋果中國網站的媒體或者有強迫癥的設計師,也可以先通過自己手動修改的方式來獲取這樣的顯示效果。

“公開信”會是我文章寫作基本方式,本文是這個系列的第三篇文章,以后我還將繼續寫作類似文章,如果你希望,不妨掃描下方的二維碼關注我吧。

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

如果作者是甲方,不想改改改的設計師趕緊來學這些!

怕甲方山寨?就得這樣干!
《職場好經驗!如何應對客戶想看效果圖的要求》

設計師必備技能之讀懂甲方:
《設計師必讀!如何從甲方抽象的概念里提煉LOGO創意》

教你跟設計師明確需求!
《奔走相告!甲方如何與設計師明確需求?》

作者:強迫癥設計詩
uisdc.com"是國內人氣最高的網頁設計師學習平臺,專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書:史上最全的設計師圖書導航:http://hao.uisdc.com/book/
設計微博:擁有粉絲量77萬的人氣微博@優秀網頁設計 ,歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航:全球頂尖設計網站推薦,設計師必備導航:http://hao.uisdc.com
———————————————————–
想在手機上、被窩里獲取設計教程、經驗分享和各種意想不到的"福利"嗎?
添加 優秀網頁設計 微信號:【youshege】優設哥的全拼
您也可以通過掃描下方二維碼快速添加:

給蘋果中國的公開信!一個設計師對蘋果官網的微吐槽

收藏 1
點贊 1

復制本文鏈接 文章為作者獨立觀點不代表優設網立場,未經允許不得轉載。