该公司为其网站的桌面版和移动版都创建了注册表，但针对移动版做了一些改动。首先，移动弹出窗口不包含图像，因为图像占用了太多空间并迫使用户滚动。
相反，他们添加了与按钮匹配的彩色边框，以创造视觉效果。他们还改变了布局：在移动弹出窗口中，按钮垂直堆叠，而在桌面上，它们水平对齐。这一小变化有助于保持移动弹出设计的一致性。
花园设计
Urban Outfitters 创造了一个引人注 学生资料 目的广告，它色彩鲜艳，并用大号字体突出显示折扣。这种充满活力的设计吸引了顾客的注意力，同时按钮鼓励顾客立即采取行动。
城市服饰店
移动版本的设计略有调整：按钮已被一个简单的箭头取代，并且文本已被缩短，以确保主要信息在小屏幕上保持清晰且易于阅读。
urbanoutfitters_mob
4.Wayfair
就元素如何定位而言，该公司的移动弹出窗口的形状总体上是一个很好的例子。已通过删除图像来节省空间进行了优化。他们没有完全正确地设计关闭按钮——它在文本旁边看起来太小而且拥挤。
此外，注册表单在收集数据时会立即显示用户的接受。虽然这可以建立信任，但在移动弹出窗口中使用这么长的文本可能会让访问者不知所措，导致他们关闭它而不是阅读。
韦费尔
5. Glossier
此示例说明了布局的细微变化如何改善与弹出窗口的交互。在桌面上，弹出窗口会出现在左上角的一个小窗口，而在移动设备上，它占据了屏幕的约三分之一。这样的调整使得访问者能够舒适地阅读文本并触摸按钮。
更光彩
6. 安德玛（Under Armour）
该公司的移动弹出窗口展示了字体大小对用户感知信息方式的强大影响。为了提高移动可用性，他们优化了文本大小。虽然内容保持不变（既没有缩短也没有修改），但在移动设备上仍然易于阅读。弹出窗口占据了屏幕的三分之二，提高了可视性，同时在桌面版本中位于中央。
安德玛
7.维多利亚的秘密
对比
维多利亚的秘密使用启动器来改善移动用户体验。他们没有像桌面版那样显示弹出窗口，而是添加了一个小按钮，单击该按钮时会打开一个弹出窗口，其中包含优惠的详细信息。
在桌面版上，访问者会看到一个带有滑块的弹出窗口，其中的图像会一个接一个地旋转。然而，这个元素在移动设备上会占用太多空间并可能让用户感到厌烦，因此它已被删除。移动版本仅包含优惠和条款的文本内容。关闭按钮清晰可见且位置方便，弹出窗口不会覆盖整个屏幕，符合 Google 指南。此外，只需滑动即可关闭它，以获得更流畅的用户体验。