如何將橫幅廣告合併到移動優化網站（使用移動CSS覆蓋）？

Question

我目前在移動優化的網站工作使用移動CSS樣式表（其中負荷，能夠適應現有的頁面結構和用於該樣式的手機瀏覽器）。客戶希望整合廣告橫幅或廣告空間。它如何從前端和後端工作？任何建議/建議都很好推薦？

謝謝。

Answer 1

從媒體查詢驅動的CSS方面，你無能爲力（除非你想加載所有可能的廣告尺寸，然後顯示：沒有那些不符合給定尺寸的佈局，但這可能不是（a）表現的原因和（b）它會惹惱廣告商）。

談談你的客戶的廣告代理公司 - 隨着越來越多的網站切換到自適應佈局很符合他們的利益提供與檢測屏幕尺寸和負荷大小合適的廣告代碼的網站。理想情況下，我們可以這樣做：

<div id="ad_slot_1"></div> 
.... 
<div id="ad_slot_2"></div> 
.... 
<div id="ad_slot_3"></div> 
.... 
<script src="http://www.example.com/adverts.js"></script> 

其中腳本將檢測屏幕大小並加載不同的廣告。可能是2號插槽中的MPU和桌面3號插槽中的排行榜，但移動設備上的插槽1和2中的迷你橫幅。

如果廣告公司不能提供（並考慮到低質量的javascript他們已經祭出了多年這也並不令人意外），你的客戶不會貨比三家一個更好的機構，那麼你可能有在服務器上使用類似Wurfl的東西來檢測用戶的設備，並最好地猜測它是否是移動設備，然後將不同的廣告抓取腳本寫入頁面。這將無法完美工作，並且不會自適應 - 旋轉手機或平板電腦或調整桌面窗口大小，佈局會改變，但廣告不會。

最後，我打算原型在新的一年的想法基本上是想什麼，我看到的廣告網絡供應DIY版。使用JavaScript動態創建一個iframe，它可以檢測屏幕大小，並將其傳遞迴加載iframe中不同廣告獲取代碼的服務器。與自適應一樣，這也可以使廣告異步加載，與廣告網絡提供的大多數代碼不同。對於某些廣告網絡，可能會跳過iframe並直接通過JavaScript加載不同的廣告獲取代碼。我有興趣聽到任何已經嘗試過的人。