Html 如何制作类似m.yahoo.com（手机版）的手机网站？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8653726/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make Mobile website like m.yahoo.com (Mobile Version)?
提问by user755278
I'm new to Mobile Site Development I want to develop a mobile website and I'm highly impressed with the (m.yahoo.com). Can any one give me any idea how can I be able to make that type of mobile website? Which technologies are highly required by that type of development for mobile website?
我是移动网站开发的新手 我想开发一个移动网站，我对 (m.yahoo.com) 印象深刻。任何人都可以给我任何想法，我怎样才能制作这种类型的移动网站？这种类型的移动网站开发需要哪些技术？
回答by testndtv
There are many ways in which you can do that. But before that, you need to consider some things;
有很多方法可以做到这一点。但在此之前，您需要考虑一些事情；
- Are you looking to have 2 separate domains for desktop and mobile (like www.yahoo.com AND m.yahoo.com)
- How is your design going to look like in each view ?
- 您是否希望拥有 2 个独立的桌面和移动域（例如 www.yahoo.com 和 m.yahoo.com）
- 您的设计在每个视图中的外观如何？
The above are important decisions to make, as there are constantly new devices (mobile/tablets,etc) which are coming up in the market. So you need to design something which can be easily extended in future.
以上是需要做出的重要决定，因为市场上不断有新设备（手机/平板电脑等）出现。所以你需要设计一些可以在未来轻松扩展的东西。
Talking of which, there is one very good approach to design mobile websites. It is called as Responsive Web Design (or fluid design) Here, you do not hard code any dimensions (width/height/padding/margin,etc) and specify everything in % (in your CSS) This ensures that the layout would adjust itself according to the screen on which it is viewed on and thus is not tied to any specific device.
说到这里，有一种非常好的设计移动网站的方法。它被称为响应式网页设计（或流体设计）在这里，您没有对任何尺寸（宽度/高度/填充/边距等）进行硬编码，并以 %（在您的 CSS 中）指定所有内容，这可确保布局会自行调整根据查看它的屏幕，因此与任何特定设备无关。
Apart from that, you would also need to know about viewport for mobile devices.
除此之外，您还需要了解移动设备的视口。
Apart from that, for Javascript, you can consider libraries like jQTouch, jQuery Mobile, Sencha Touch (for more complex sites) and even basic ones like flowplayer plugins.
除此之外，对于 Javascript，您可以考虑使用 jQTouch、jQuery Mobile、Sencha Touch（用于更复杂的站点）等库，甚至像 flowplayer 插件这样的基本库。
Please let me know if you need any additional info.
如果您需要任何其他信息，请告诉我。
回答by dheerosaur
There is one disadvantage in having a different domain for your mobile website from the desktop/tablet website. It makes sharing content on the web difficult. If you share some URL on a mobile site, all users accessing that URL will be shown the mobile version even if they open it on a desktop.
为您的移动网站与桌面/平板电脑网站使用不同的域有一个缺点。它使在网络上共享内容变得困难。如果您在移动站点上共享某个 URL，则所有访问该 URL 的用户都会看到移动版本，即使他们在桌面上打开它也是如此。
If you have used django to create the desktop version of your site, you can use something like django_mobileto serve the mobile version with the same URLs. It sniffs the user-agent from the HTTP headers and serves the appropriate version. Some people think that this is not so reliable and prefer the former method.
如果您使用 django 创建了您网站的桌面版本，您可以使用类似django_mobile 的东西来为具有相同 URL 的移动版本提供服务。它从 HTTP 标头中嗅探用户代理并提供适当的版本。有些人认为这不是那么可靠，而更喜欢前一种方法。
回答by BobDroid
you have to buy a separate domain for that....and the steps are easily followed in this link steps to create a mobile web
回答by Daniel Magnusson
Did not look at yahoo source, but look and feel reminds me of this project, http://jquerymobile.com/
没看yahoo源码，但观感让我想起了这个项目，http://jquerymobile.com/
