跟上時代,別讓網站 Logo 是模糊的

In 網頁設計
Scroll this

以前看一個網站有沒有跟上時代,是看它有沒有做手機版;現在看一個網站有沒有跟上時代,是看它左上角的 Logo 有沒有糊掉。

智慧型手機發展已經超過 10 年,目前已趨於穩定、普及,接下來對於網頁設計領域最具影響的因素將會是高解析度螢幕的全面普及,高解析度螢幕是指 Apple 陣營的 Retina 視網膜螢幕,或指 4K 解析度以上的螢幕,傳統 200 像素大小的照片,放在高解析度螢幕上觀看,只會有 100 像素那麼大,但是精細程度卻是原本的兩倍,因此術語上支援 Retina 螢幕(Retina Ready)這件事可以用要做「兩倍解析度」來稱之。

Retina 螢幕自從 Apple 在去年(2018 年)10 月發表新一代搭載 Retina 螢幕的 MacBook Air 之後,就已經宣告 Apple 旗下產品已經的螢幕都已經全面高解析度化了,因此,未來假如你的圖像尺寸仍然是做傳統的一倍解析度,那麼你的網站看起來,在這些高解析度裝置上都會顯得老態龍鍾。舉一些台灣尚未 Retina 化網站的例子,如 PChome、Mobile01、ETtoday,可以從他們左上角 Logo 是否銳利來快速判定。

PChome
PChome
Mobile01
Mobile01
ETtoday
ETtoday

一倍解析度與兩倍解析度的問題,特別容易發生在平面設計師做的切版型網頁上,因為傳統的平面設計師多半還在使用 Full HD 規格(1920 x 1080 像素)的 22~27 吋桌機螢幕在做圖,這些都是所謂一倍解析度的螢幕,但未來使用者使用一倍解析度瀏覽網頁的機率將會愈來愈低,手機不用說,現在一定是兩倍解析度,許多手機螢幕的解析度都是 Full HD 甚至更高了,與平面設計師的螢幕解析度相同;而平板的部分以 iPad 為首,也早就已經是兩倍解析度了;電子書閱讀器如 Kindle,也是兩倍解析度;現在就連 Apple 主打平價市場的筆電 MacBook Air 也是兩倍解析度。目前剩下的,就是 PC 筆電市場還有桌機 4K 螢幕市場的全面普及。

至於大家會關心的兩倍解析度圖檔過大,導致網頁開圖速度緩慢的問題,我想,在 5G 行動網路普及以前,可能都會是個問題,但相信 5G 行動網路在這一、兩年就會問市了,所以目前這個陣痛期還算短,畢竟一個網站做出來就是要撐 3~5 年的。假如全站支援 Retina 會是一個艱鉅的浩大工程,不妨就先從最簡單的網站 Logo 開始改吧!

 

Photo by Daniel Korpai on Unsplash

Submit a comment

發佈留言必須填寫的電子郵件地址不會公開。