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

Question

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

没错,如果太难了,你有什么建议？我基本上想要一个使用相同网址的ipad和iphone(android)版本,在检测到移动浏览器时使用自动直接.

非常感谢

Answer 1

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

还要检查一下以便更好地理解

Answer 2

添加到其他人已经回答的内容,对于移动网站,您有两个基本选项.

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

对于第一个选项,您可以将移动用户重定向到一个完全不同的URL,您可以在该URL中托管仅限移动版本的站点.要做到这一点,您可以使用http://detectmobilebrowsers.mobi/之类的东西管理重定向,或者使用.htaccess文件重定向有很多变体.

在此之后,Jquery Mobile是开发移动专用网站的一种非常好的方式.

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

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

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

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

Answer 3

您需要研究响应式设计。有许多免费的开源框架可以帮助您入门，也许最流行的是bootstrap和Foundation。