为移动设备设计Web界面

时间:2009-10-05 00:12:54

标签: html css layout mobile

如何使您的网站在标准浏览器和各种可用移动设备上看起来都很好?

目前,在尝试使我的布局可调整大小以使其适用于小型设备或为移动设备提供单独的CSS之间,我尚未决定。 我的用例是国际象棋游戏,我希望整个棋盘都可用,而不需要向下滚动。

你会推荐什么?

5 个答案:

答案 0 :(得分:1)

在这种特殊情况下,听起来最佳观看可能值得专门针对移动设备。

答案 1 :(得分:1)

我会推荐CSS方法。否则,我担心你会有一个只在两者看起来都足够的界面而且只有平庸。

您不希望自己的网站看起来像是为一个受众或另一个受众而受到损害。

答案 2 :(得分:1)

我不知道你是否意识到你问的问题有多大 - “各种移动设备”?这是一个很多设备,很多分辨率和很多错误和限制,从iPhone可以处理普通浏览器可以处理的任何东西,到微小的黑白屏幕。

理论上,您可以编写单独的CSS来定位手持设备

<LINK REL="stylesheet" TYPE="text/css" MEDIA="handheld" HREF="handheld.css">

但就个人而言,如果您尝试支持大量设备,我认为检测设备并尝试提供代码,它可以处理它是唯一真正的解决方案。

您可以通过获取WURLF来查看问题有多大,这是一个13MB的XML文件,其中包含有关不同设备及其功能的详细信息。

答案 3 :(得分:1)

基本上没有简单的方法可以做到这一点,你可以在大多数现代手机上使用CSS来控制输出,但你需要在手机上显示之前调整图像大小,因为所有手机都有不同的屏幕尺寸。

我在移动设计中遇到的最佳网站是:http://patterns.littlespringsdesign.com/index.php/Main_Page

答案 4 :(得分:0)

尝试使用Google的新Mobile friendly test 工具评估您的网站1