从哪里开始智能手机Web开发?

问题描述 投票:14回答:11

全部,

因此,我一直很乐意为我们的房地产门户网站开发一个智能手机网站,而我所做的第一件事就是看到其他人必须在网上讲的课,但我发现的很少。

[我不是在构建应用程序,我正在构建网站,我正在寻找关于,不赞成html,css,宽度/高度方法,javascript的(不是jquery在所有平台上都能很好地发挥作用?)以及其他与此类平台相关的内容。

环顾四周,我非常喜欢http://mobile.whistlerblackcomb.com/

关于,丹尼斯

javascript html css mobile smartphone
11个回答
15
投票

UPDATE

虽然下面的大部分文本仍然适用,但我现在要说jQuery Mobile在提供一组设计良好且可用的UI组件方面做得很好,同时还减轻了许多设备测试和检测问题,过去曾使用WURFL。它仍处于测试阶段,但似乎运行良好。我建议将其签出。


入门时要考虑的两个最重要的问题是:

1)设备检测

2)移动用户界面设计

对于问题1,我强烈建议您查看WURFL设备数据集:

http://wurfl.sourceforge.net/

使用此功能,您可以使用用户代理字符串检索正在访问您站点的设备的(某些)功能。测试移动Web应用程序就像从地狱进行浏览器测试一样,设备和浏览器的组合种类繁多,这是一项艰巨的任务。如果您可以专注于为功能强大的手机开发一个或两个版本,请说:

1)最小300px宽度,带有“ web”支持和触摸屏2)与上述相同,但没有触摸屏

您可以创建一个非常有用的网站,该网站适用于大多数“智能手机”或“应用手机”,因为David Pogue更准确地为其命名。对于实际测试,您可以尝试:

1)列出所有朋友以及他们拥有的手机类型2)前往手机店并使用这些手机测试您的网站

而且,无论您做什么,当收到不可避免的用户反馈有关设备上的内容损坏/速度慢时,您都必须保持敏捷。

关于UI设计,有两个问题。最简单的一种是外观漂亮的CSS。在这里,只需查看您喜欢的一些移动网站并窃取其CSS。完成此操作后,基本上就是在一个小屏幕上进行常规的旧Web开发。 ul会变成漂亮的iPhone-y桌子,等等。

更大的问题是移动网络的可用性。从很多方面来说,我们处于90年代的Web开发环境中。我的意思是我们在没有完善的设计模式的情况下工作。这使进行移动Web开发真的很有趣,但这也意味着您必须准备好随着更好的想法的发展而调整丑陋/破碎的UI。当前的一个例子是您在很多移动网站上看到的全球导航/面包屑。数量惊人的人们试图通过在移动应用程序中提供持久的导航工具(后退按钮)来模仿本地iPhone应用程序的行为。虽然这很漂亮,但是它有一些问题:

1)这是多余的,因为浏览器带有用户非常熟悉的后退按钮。这些全局导航在本机应用程序中存在的原因是,它们没有免费的导航工具。

2)网络很棒。您可以在结构的任何位置输入,离开和重新输入“应用程序”。通过假设用户在您的应用程序中采用了一条线性路径,您正在降低其网络状态,使其相对于网络其余部分而言更加粗糙。

3)坏了。您可能会遇到以下情况:应用程序导航和浏览器导航指向相反的方向(在应用程序中单击后退按钮可逐步浏览应用程序历史记录),或者使用javascript伪造后退按钮,如果它们不起作用,则会中断不能从应用程序的开头(通过电子邮件发送的链接,书签)开始,或者您要设置会话,而要免费复制从浏览器中获得的内容可能会很麻烦。会话也容易受到破坏(通过电子邮件发送的链接,书签)的破坏,您实际上并没有收获太多。

我想我的主要观点是:

1)不要忘记您正在上网。网络很酷,浏览器很酷,可以利用它。

2)不要害怕玩耍。这里没有很多完善的模式,因此您可能必须尝试一些自己的模式。


0
投票

还有这个三部分,Cameron Moll的“ Mobile Web Design”:


-5
投票

非常好的文章,很棒的帖子!对网站设计的一些深刻见解正在寻找Web开发/网站开发,SEO,Digital Marketing Company in Ghaziabad和Web设计/ Website Designing Company in India现在单击此处。A Leading Digital Marketing Company in Ghaziabad, India


1
投票

列表管理员可以帮助您入门:"Put Your Content in My Pocket"by CRAIG HOCKENBERRY


1
投票

[这是一个提供用于网络的智能手机应用程序的网站,我尚未测试,使用后我会发表评论!http://www.makeuseof.com/dir/appsbar-build-your-own-smartphone-app/


0
投票

[使用现代智能手机,开发常规网页和专用网站实际上没有区别。

但是您可以尝试苹果,RIM,摩托罗拉和诺基亚等主要厂商提供的仿真器,以查看它们的外观。


0
投票

我建议您看看其他一些移动网站。我在下面发布了一些。

  • m.reddit.com
  • diggriver.com
  • mobile.washingtonpost.com

0
投票

由于现代移动浏览器的工作方式与台式机浏览器非常相似,因此“最小化JS和CSS,优化图像”这句老话应该成为您的主要考虑,因为带宽在移动设备上更有价值。

此外,请考虑以下事项:

  • 请考虑是否需要所有图像,并且它们对于小屏幕来说太大了。考虑删除或减小大图像的大小。
  • 检查您的JavaScript-如果没有它,您的网站是否可以正常工作?禁用它的某些部分可能是有益的,因为它很容易降低移动浏览器的速度
  • 您通常可以通过在您的主要站点中包含为小屏幕设备量身定制的专用CSS样式来获得]
  • 您可能还会发现此帮助:Why your mobile site probably sucks


0
投票

移动网站通常用于常规电话,通常访问m.example.com,而不是www.example.com。这些网站几乎没有/没有javascript或css兼容性。当您询问移动网站时,请记住,有两种类型的移动网站。


0
投票

如果您要专门为iPhone或iTouch进行开发,请使用此条件语句。


0
投票

Meagan Fisher关于Designing Effective Mobile Interfaces的演讲提供了很好的概述。她推荐了Cameron Moll的《移动Web设计》一书。从技术角度来说,如果您还不熟悉XHTML Mobile Profile,那么我将首先开始。

就设计而言,请慎重考虑。抓住一本印刷精美的书,看看是否可以使用CSS复制页面布局。 “应用于Web的印刷样式元素”是一个很好的起点。电话网站是关于滚动而不是复杂的导航。节奏和间距很重要。保持图像较小,使文本具有高对比度,您最终会得到一些加载速度快且看起来不错的东西。

© www.soinside.com 2019 - 2024. All rights reserved.