如何让我的网站移动和平板电脑兼容?

时间:2013-01-28 16:44:59

标签: javascript mobile web android-compatibility

我想让我现有的网站在手机,平板电脑上观看时自动调整,甚至在桌面上调整屏幕时也是如此。

如果做不到,如果太难了,你有什么建议?我基本上想要一个使用相同网址的ipad和iphone(android)版本,当检测到移动浏览器时会自动指向。

非常感谢

3 个答案:

答案 0 :(得分:12)

您正在寻找响应式网页设计!从MediaQueries http://mediaqueri.es/

开始

同时检查一下以便更好地理解

http://www.slideshare.net/zomigi/building-responsive-layouts-15508821

答案 1 :(得分:8)

根据其他人的回答,对于移动网站,您有两个基本选项。

您可以拥有不同的桌面和移动网站,也可以使用适用于所有设备的响应式网站。

对于第一个选项,您可以将移动用户重定向到一个完全不同的网址,您可以在该网址中托管仅限移动版的网站。为此,您可以使用http://detectmobilebrowsers.mobi/等方法管理重定向,或者使用.htaccess文件重定向有很多变体。

Jquery Mobile是在此之后开发仅限移动网站的一种非常好的方式。

这种方法的优势在于,开发轻量级移动版本的网站更容易。一个缺点是你将有两个网站需要维护 - 桌面和移动。

另一种选择是其他人建议的响应式方法。在这里,你基本上有一个站点根据访问者浏览器的寡妇大小重新配置。 BootstrapFoundation是两个很好的选择,还有很多其他选项。

响应式网站依靠媒体查询来查找窗口大小。这在现代浏览器中得到了很好的支持,但是您可能需要解决旧版浏览器的问题。响应式站点的一些优点是您只维护一个站点,理论上它适用于所有屏幕和窗口大小,因此在释放具有不同屏幕大小的下一个移动设备时不会导致问题。

祝你好运,这是一个有趣的网页设计时间。

答案 2 :(得分:2)

您需要查看responsive design。有许多免费的开源框架可以帮助您入门,也许最受欢迎的是bootstrapfoundation