文章彙整

設計網站時,你是否考量過Ad Blockers的情況?

By Frank 2 years agoNo Comments
首頁  /  網頁視覺設計  /  設計網站時,你是否考量過Ad Blockers的情況?

Banner-設計網站時,你是否考量過Ad Blockers的情況?

Smashing Magazine統計指出,有75%使用者都安裝了廣告阻檔軟體(Ad Blockers) 當你網站使用廣告區塊,卻被阻擋掉時,是否考慮過畫面會變成怎麼樣呢? 嚴重的可是會讓整個網頁版面跑掉喔。

由於現今有許多提供資訊的網站,免費讓讀者接收知識,這些網站會需要藉由廣告區塊來增加收入,但由於廣告的濫用導致使用者反感度大增,讓廣告阻檔軟體安裝量不斷攀升,根據Smashing Magazine統計(截至2016年3月),目前只有25%的使用者沒有安裝廣告阻檔軟體,這表示如果你的網頁沒有考量廣告被阻擋後的畫面,有七成五的使用者將看到你網站顯示著不正確的畫面,建議在設計時應考量被阻擋後的情況。

網頁設計樣板

 

以設計的角度來看,我們可以使用留白與調整位置兩種方式來處理,簡單來說就是用網頁排版來處理這種狀況,將頁首、頁尾、最新消息、影片等,每個部份看成一個區塊,再對它做重新排列,以下兩種方式各有需要注意的地方:

留白

較適合針對廣告區塊在末端的處理方式,廣告在被阻擋後,較不會有不自然感,此種方式較不適合用於中間區塊,廣告在被阻擋後會空出一堆白色區塊,會讓網站看起來不連貫,像是網站出現錯誤一樣。

網頁設計樣板-留空

 

補位

補位的方式是在廣告被阻擋後,依序將後方區塊自動遞補上去,但要注意避免廣告放至於無法遞補的區塊之前,像是Banner之前的小區塊,因尺寸不同就無法遞補。

網頁設計樣板-填滿

 

以下提供幾個不錯的範例與大家分享,希望本篇內容對於您未來網站建置時,有所幫助。

 

範例分享

Yahoo https://tw.yahoo.com/

客戶範例一

 

數位時代 http://www.bnext.com.tw/

客戶範例二

 

國家地理雜誌 http://www.ngtaiwan.com/

客戶範例三

 

遠見雜誌 http://www.gvm.com.tw/

客戶範例四

 

ㄇㄞˋ點子靈感創意誌 http://www.mydesy.com/

客戶範例五

 

範例來源:

Yahoo https://tw.yahoo.com/

數位時代 http://www.bnext.com.tw/

國家地理雜誌 http://www.ngtaiwan.com/

遠見雜誌 http://www.gvm.com.tw/

ㄇㄞˋ點子靈感創意誌 http://www.mydesy.com/

資料來源:

A Never­Ending Story On Ad­Blockers

https://www.smashingmagazine.com/2016/03/never­ending­story­ad­blockers/

 

以上文章為歐斯瑞編寫製作,如您有任何網頁設計的需求或問題,都歡迎您聯絡歐斯瑞

以上內容由Astralweb 歐斯瑞編寫製作

 000

推薦文章

Category:
  網頁視覺設計

留下回應

你的電子郵件地址不會被公開.

取得獨家電子商務祕技

建立更好的策略靈感

跟上全球的網路趨勢

絕佳的電商解決方案

電子商務戰略全指南

每月發送電商戰略指南,只要填寫E-mail即可訂閱!

請到您的信箱確認,即可完成訂閱。