如何将横幅广告合并到移动优化网站（使用移动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加载不同的广告获取代码。我有兴趣听到任何已经尝试过的人。