-1

即将创建我的第一个移动网站，我不知道从哪里开始。这是一个简单的 html/css 网站，所以我希望我能够快速组合起来。

如何根据访问者是否是移动设备来告诉浏览器使用哪个样式表？

我习惯于使用我的文本编辑器和 firebug 来构建基本站点。我还需要其他工具吗？

我将利用我的直觉创建一个大小可变的移动站点，尽管可能具有固定的字体大小。

有没有人可以按照我的方式提供指南或一些指示？有什么我需要特别注意的吗？清单？我试图让它尽可能简单。

什么是移动网站 ABC？

4

3 回答 3

2

您可以使用@media-queries 构建站点，这样您就可以根据屏幕尺寸等定位不同的设备。您可以查看http://mediaqueri.es，例如使用@media-queries 的站点。我发现一个很好的测试站点是http://www.responsinator.com/，因为您仍然可以在 Chrome、Safari 或 Firefox 中使用开发人员工具。

如果你决定走这条路，还可以看看 Ethan Marcotte 的书 Responsive Web Design http://www.abookapart.com/products/responsive-web-design 。

于 2012-05-05T18:23:27.600 回答
1

在理想情况下，您可以通过定义“手持”媒体样式表来告诉移动浏览器使用移动样式表，如下所示：

<link rel="stylesheet" href="handheld.css" media="handheld"/>

不幸的是，这不适用于许多移动浏览器。为什么？提供配备浏览器的手机的手机供应商不希望被视为提供“贫民区”的移动互联网——只有桌面内容就足够了。这意味着大多数制造商构建浏览器时故意忽略媒体类型。

相反，您必须根据用户代理嗅探来提供样式表（或使用移动 UA 字符串将用户重定向到移动子域）。您必须在服务器级别执行此操作。

至于构建和调试——那里有移动模拟器，但它们的行为是不完整的，而且那里有很多设备。您可能不得不满足于仅测试少数常见平台并尝试围绕最低公分母进行设计。这意味着假设设备可能不够智能，无法下载不相关 CSS 中指定的图像（所以不要尝试使用 CSS 媒体查询来限制大图像），或者设备可能不执行 javascript（大多数设备的 JS 处理能力很差） .

哦，还有一件事：如果您要使用 javascript，请尝试将您的方法包装在伪命名空间中。许多移动提供商拦截 Web 请求并插入自己的 JS 来替换需要大量带宽的图像和其他元素。通常，这些方法使用诸如“main”之类的通用名称，并且由于 Javascript 缺少命名空间而与作者定义的方法发生冲突。

除此之外，看看这篇文章（http://www.smashingmagazine.com/2010/11/03/how-to-build-a-mobile-website/），祝你好运！

于 2012-05-05T17:38:32.037 回答
0

您可以使用元标记 [code] viewport [/code] 根据屏幕宽度更改 CSS 表。

于 2012-05-05T20:32:13.950 回答