从哪里开始智能手机 Web 开发? [英] Where to begin with Smartphone Web Development?
问题描述
哈，
所以我一直致力于为我们的房地产门户网站开发智能手机网站，我做的第一件事就是看看其他人必须在网上讲述什么经验教训，但我发现的很少.
我不是在构建一个应用程序，我在构建一个网站，我正在寻找关于 html、css、宽度/高度方法、javascript(jquery 是否会在所有方面都很好)平台?)以及与此类平台相关的任何其他内容.
环顾四周，我非常喜欢http://mobile.whistlerblackcomb.com/.>
问候，丹尼斯
更新:
虽然下面的大部分文字仍然适用，但我现在要说 jQuery Mobile 在提供一组设计良好且可用的 UI 组件，同时还减轻了我过去使用 WURFL 解决的许多设备测试和检测问题.它仍处于测试阶段，但似乎运行良好.我建议检查一下.
<小时>开始时要考虑的两个最重要的问题是:
1) 设备检测
2) 移动端 UI 设计
对于问题 1，我强烈建议查看 WURFL 设备数据集:
使用此功能，您可以使用其用户代理字符串检索访问您站点的设备的(某些)功能.测试移动 Web 应用程序有点像地狱中的浏览器测试——设备和浏览器的组合如此之多，这是一项艰巨的任务.如果您可以专注于为相当强大的手机开发一两个版本，请说:
1) 最小 300 像素宽度，声称支持网络"和触摸屏2) 同上，但没有触摸屏
您可以创建一个适用于大多数智能手机"或应用手机"的非常有用的网站，如David Pogue 更准确地命名了它们.对于实际测试，您可以尝试:
1) 列出您所有的朋友以及他们拥有的手机类型2) 前往手机店并使用这些手机测试您的网站
而且，无论您做什么，当您收到不可避免的用户关于设备上损坏/缓慢内容的反馈时，您都必须保持敏捷.
关于 UI 设计，有几个问题.最简单的就是漂亮的 CSS.在这里，看看你喜欢的一些移动网站并窃取他们的 CSS.完成此操作后，您基本上就是在小屏幕上进行常规的旧 Web 开发.ul's 将成为不错的 iPhone-y 桌子等.
更大的问题是移动网络的可用性.在很多方面，我们都处于移动 Web 开发的 90 年代 Web 状态.我的意思是我们在没有完善的设计模式的情况下工作.这让移动 Web 开发变得非常有趣，但这也意味着随着更好的想法的发展，您必须准备好调整丑陋/损坏的 UI.当前的一个示例是您在许多移动网站上看到的全局导航/面包屑导航.数量惊人的人试图通过在移动应用程序中提供持久导航工具(后退按钮)来模仿原生 iPhone 应用程序的行为.虽然这有点漂亮，但它有一些问题:
1) 这是多余的，因为浏览器带有用户非常熟悉的后退按钮.这些全局导航存在于原生应用中的原因是它们没有提供免费的导航工具.
2) 网络很棒.您可以在其结构中的任何点进入、离开和重新进入应用程序".假设用户采用线性路径浏览您的应用，您会降低其网络性，使其相对于网络的其余部分更加粗糙.
3)它坏了.您可能会遇到应用程序导航和浏览器导航指向相反方向的情况(点击应用程序中的后退按钮向前浏览应用程序历史记录)，或者您使用 javascript 伪造后退按钮，如果不这样做就会中断'不要从应用程序的开头(电子邮件链接、书签)开始，或者您设置会话，这对于免费复制您从浏览器获得的内容来说可能是一个很大的痛苦.会话也容易受到破坏(电子邮件链接、书签)，而您实际上并没有获得太多收益.
我想我的主要观点是:
1) 不要忘记您在上网.网络很酷，浏览器也很酷，好好利用它.
2) 不要害怕玩耍.这里没有很多完善的模式，因此您可能需要尝试一些自己的模式.
Ha all,
So I've been taksed with developing a smartphone website for our property portal and first thing I did was see what lessons others had to tell online but I've found very little.
I'm not building an app, I'm building a website and I'm looking for do's and don't with regards to html, css, widths/heights approaches, javascript (is jquery going to play nice on all platforms?) and anything else that relvant to this kind of platform.
Looking around at others I like http://mobile.whistlerblackcomb.com/ very much.
Regards, Denis
UPDATE:
While most of the text below still applies, I would now say that jQuery Mobile does a great job of providing a well-designed and usable set of UI components, while also alleviating a lot of the device testing and detection issues that I've used WURFL for in the past. It's still in beta, but seems to be working pretty well. I recommend checking it out.
The two most important issues to consider when getting started are:
1) Device detection
2) Mobile UI design
For issue number 1, I strongly recommend looking at the WURFL device dataset:
Using this, you can retrieve (some) capabilities of devices that are accessing your site, using their User Agent string. Testing mobile web apps is kind of like browser testing from hell--there are so many different combinations of devices and browsers, that it's a difficult task. If you can focus on developing one or two versions for fairly capable phones, say:
1) minimum 300px width with claimed "web" support and a touch screen 2) The same as above, but without a touch screen
you can create a very usable site that will work for most "smartphones," or "app phones" as David Pogue has more accurately named them. For the actual testing, you can try:
1) Making a list of all of your friends and what kind of phones they have 2) Going to a phone store and using those phones to test your site
and, regardless of what you do, you'll have to be agile when you receive the inevitable user feedback about broken/slow content on their device.
Regarding UI design, there are a couple of issues. The simplest one is nice looking CSS. Here, just look at some mobile sites you like and steal their CSS. Once you've done this, you're basically doing regular old web development, just on a small screen. ul's will become nice iPhone-y tables, etc.
The bigger problem is mobile web usability. In a lot of ways, we're in a 90s-web situation with mobile web development. What I mean is that we working without well-established design patterns. This makes doing mobile web development really fun, but it also means that you have to be ready to adjust your ugly/broken UI as better ideas evolve. One current example are the global nav/breadcrumbs you see on a lot of mobile sites. A surprising number of folks out there are trying to mimic the behavior of native iPhone apps by providing a persistent navigation tool (back button) within the mobile app. While this is kind of pretty, it has a few problems:
1) It is redundant, given that the browser comes with a back button that users are very familiar with. The reason these global navs exist in native apps is that they don't come with a free navigation tool.
2) The web is great. You can enter, leave and re-enter "apps" at any point in their structure. By assuming that a user takes a linear path through your app, you are decreasing its webiness, making it a lot more crude relative to the rest of the web.
3) It breaks. Either you can get in a situation where the app nav and the browser nav point in opposite directions (hitting the back button in your app steps forward through the app history), or you fake a back button with javascript, which breaks if they don't start at the beginning of an app (emailed link, bookmark), or you set up sessions, which can be a big pain just to replicate what you get from the browser for free. Sessions are also vulnerable to brokenness (emailed links, bookmarks), and you're really not gaining much.
I guess my main points here are:
1) Don't forget you're on the web. The web is cool, browsers are cool, make use of that.
2) Don't be afraid to play around. There aren't many well-established patterns here, so you may have to try out some of your own.
这篇关于从哪里开始智能手机 Web 开发?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
