使网站移动兼容的最佳策略

Question

我正在维护一个遗留网站，这些网站多年来已经成为一个破碎的错误，过时的html，iframe，脚本标签到处都是丛林，数以千计的分析代码片段，内联css样式，硬编码像素调整等等。 p>

然而，事实是该网站在桌面环境中看起来非常好。 （它不会破坏1360 * 768分辨率及以上）。它在谷歌的页面排名很好。现在谷歌正在改变其页面排名，我需要让这个网站移动兼容。我尝试使用bootstrap和媒体查询，但我认为这是一个噩梦，试图转换当前的HTML。

我想检查的是 - 我还有其他方法吗？我正在考虑当用户使用移动设备访问它时，如何在同一URL中显示完全不同的页面。

任何指针都非常感激。

Answer 1

从现有的糟糕桌面设计中制作出色的响应式设计是不可能的。使用移动优先方法开始新手更容易。

但如果你不能，并且不想破坏桌面设计，你绝对可以通过JavaScript将移动用户转移到不同的网站（如m.domain.com）。

以下是一些信息：http://blog.woorank.com/2014/06/how-to-redirect-mobile-users-on-your-website/

Answer 2

您可以基于USER-AGENT呈现不同的移动兼容HTML页面。 对于例如您可以使用预请求处理器来检查USER-AGENT的请求标头，如果模式与任何移动模式匹配，

1. 您可以将用户重定向到另一个网址，例如m.yourwebsite.com，
2. 您可以替换要渲染的基础HTML页面（例如，将网址映射到/path/to/templates，它会更改为/path/to/mobile templates/。文件名相同）

3. 您可以根据请求设置变量，并在HTML文件本身内做出决策。例如。在模板中，您可以

   {% if request.is_mobile %} /url/to/mobile.css {% else %} /url/to/desktop.css {% endif %}

选项1是很多工作，选项3是最少量的工作。我们选择了选项2.不建议使用选项3，因为它可以制作一个HTML页面错误（我们为较小的，大多数是静态的页面，如关于我们的隐私等）。

似乎Google赞成使用响应式网页设计在子域名中使用相同的域名，尽管陪审团仍在其中。这是google必须说的。因此，使用相同的URL是所有设备的首选方式。