WebAppTrend

这篇文章是对以往发表在Smashing Magazine上关于响应式Web设计的文章的集合，所选出的文章都是最有用最受大家欢迎的，下面就请大家来看看吧。概览响应式Web设计的概念及用法如何应对Media Queries不受支持的情况响应式Web设计的技术、工具及策略如何使用CSS3 Media Queries来为你的网站创建一个移动端版本响应式 Web设计的概念

移动开发需要具体的设计考虑。这个所指的范围非常广，可以从“你已经习惯了并觉得容易”到“困难”（These can vary greatly from what you're used to and it's easy to trip up），所以，这里有一些开发者 Paulo Fierro 很久以前被告知的忠告。那么，你想要从事移动开发？也许你想通过应用商店就可以获得预想的上百万的收入，或

假设你正想聘用一名Node.js程序员或者外包项目给独立职业者，你将寻找怎样的人呢? 好的应聘者需具备哪些能力呢?这个简短的指南将为了你筛选Node人才提供一些建议。1）为什么选择Node?Node的logo酷毙了你必须询问自己的第一个问题便是：为什么选择Node?现在许多公司聘用Node开发者，但是他们都是必要的么？我看不见得。毫无疑问，Node是一个有力的工具，但是它像

国外知名调查分析机构Vision Mobile发布2012跨平台开发工具报告，开发者市场占有率Top 10为：1. PhoneGap 32% 2. Sencha Touch/JQ Touch 30% 3. Mono 26% 4. Appcelerator 24% 5. Adobe Flex 22% 6. Unit 3 20% 7. Corona 17% 8. AppMobi 16% 9. Ru

Facebook入场了，在MWC大会上，Facebook CTO Bret Taylor介绍了FB的一揽子Mobile Web战略并将其名为“核心移动Web平台”.其中包括：1）和合作伙伴制定Moblie Web标准，使开发者更容易高效地跨平台和浏览器开发。一款测试组件Ringmark，用于测试移动浏览器对标准的支持程度.2）最重要的是FB联合电信运营商推出针对Mobile Web的支付系

三年前，前雅虎用户体验总监Luke Wroblewski首次提出了“移动优先”的设计理念，当时有很多人表示怀疑，在移动互联网日益火爆的今天，这个理念得到很多人认同，为说服少数依旧保持旧观念的人们。在这篇文章中，他列举了一组数字和分析，生动有力地再次论证了移动的重要性。(注：Mobile First（移动优先）的口号最初是由Yahoo前首席设计架构师Luke Wroblewski提出的，已经

作者简介：Byron是一个有着剧院设计和古典动画制作背景的设计者和勤奋的开发者。他在各类媒体中工作，包括纸质媒体、广播、网络以及移动媒体。他是一个富于激情的故事讲述者，一个勤奋的思考者。他一直致力于在设计、内容表现以及技术之间搭建起一座桥梁。在下面的文章中，Byron讲述了他做出的关于Mobile Web的演讲前前后后的故事。他在Over The Air上做的这次名为“重新审视Mobile W

从本周起，WebAppTrend将精选一周内（2月20日~2月25日）发表的精品文章以及若干微博，制成周刊，内容分为“微动态”、“小专题”、“前沿与评论”、“工具与框架”、“产业与案例”等栏目。如希望邮件订阅，或关于跨平台、Web App领域，希望投稿或接受采访，请发邮件到WebAppTrend@gmail.com通知我们。：）#微动态#@WebAppTrend ： Vision Mo

构建漂亮的应用一个web app的视觉设计不仅要看起来美，也要用起来让人觉得方便你的应用的美学设计将直接影响人们使用应用时的易用性。一个有着丰富视觉感受的应用既能让人用起来愉快，又不会分散人的注意力。它注重美观，使用类似于native apps设计模式的同时又不失易用性。美观的图片、颜色、字体和速度、易读性、易用性之间需要达到均衡。用户和文化背景也非常重要，因为在不同文化中，颜色、布局

译者注：本篇文章为开发者提供了零基础使用Sencha Touch的一些资料。 Sencha Touch是专门为移动设备开发应用的Javascrt框架。通过Sencha Touch你可以创建非常像native app的web app，用户界面组件和数据管理全部基于HTML5和CSS3的web标准，全面兼容Android和Apple iOS。从头开始创建一个Sencha Tou

如果缺少项目案例部分，那么很难说这是个完整的开发指南。因为只有通过一系列的案例实践，才可以帮助人们形成最佳实践，了解那些开发特性是如何体现在具体产品中的。在接下来的这一章节中，我们创建了对应当前web apps常见场景的4个样例应用，而且对每个应用的设计决策，以及功能特殊背后技术元素的使用方法都添加了具体点评。项目样例分析值得说明的是，除了Khan Academy外，其他三个Web A

译者注：Infographic就是 information+graphic的组合，透过图像的力量让生硬的数据显出趣味与生命力，也让读者可以轻松的理解并在脑海中留下印象。无论是从Infographic备受大家关注还是从信息时代需要更有效的途径处理大量信息的角度来看，Infographic的制作教程都能够使你受益匪浅。（知识储备：信息设计，图像设计  必备工具：图形设计软件（推荐Adobe Ill

从本周起，WebAppTrend将精选本周内发表的精品文章以及若干微博，制成周刊，内容分为“微动态”、“小专题”、“前沿与评论”、“工具与框架”、“产业与案例”等栏目。如希望邮件订阅，或关于跨平台、Web App领域，希望投稿或接受采访，请发邮件到WebAppTrendCA@163.com通知我们。：）#微动态#@WebAppTrend:据WebMoney报道，去年，HTML5 Tim

近日，据国外媒体报道，W3C联合主席Daniel Glazman指出，与IE相比，苹果和谷歌移动浏览器（都基于开源Webkit引擎）的主导地位对Web开放性的影响更为恶劣。因为在Web标准发展的途径。新浏览器通常会引进最终成为标准的新技术，但最初这些新技术只出现在一种浏览器中。Web编程人员在使用这些试验性的技术时，他们必须在命令前加一个前缀。例如，“-webkit”前缘表明基于WebKit的浏览

在计算机的发展过程中，目前移动设备的时代可谓是潜力最大，发展最为迅猛，也是竞争最为激烈的一个时代。硬件的发展速度几乎令所有的消费者惊叹，如果2008年给你一部主频为528MHz，内存为192M，屏幕为3.2寸，分辨率为320*480的手机，你可能会觉得非常前卫，因为CPU和分辨率足够高。而放到三年之后的今天，这部机器已经沦落到无人问津，成为古董机型的地步。不错，这就是G1的配置。而现在双核1.5G

很多PhoneGap新手总是需要一些基础问题的解答，Adobe技术布道师Andrew Trice常在其博文中回答诸如” PhoneGap是什么?”、“phonegap应用开发出来是什么样的形态?”、“如何开发phonegap?”等问题。近日他将这些问题回答整理成文以帮助开发者理解和使用PhoneGap。1. PhoneGap是什么?PhoneGap是一个基于HTML和JavaScrip

很多人向我问起学习HTML5技术的权威入门资料，我总是毫不犹豫地推荐由Google推出的HTML5rocks，这个网站就像一个宝库，包含经典的教程、文章、Demo和代码。近日 Chrome小组又推出了一个很酷的Web App电子书，讲述了Chrome开发人员对Web Apps的思考和最佳实践，推荐每个关注Web Apps的开发者阅读。Web AppTrend为方便国内开发者浏览，将全文进行翻译

当很多人都在等待观望的时候，有人已经利用HTML5做出了非常优秀的应用了。来自于国外科技媒体ReadWriteWeb发布了专栏作家Dan Rowinski的一篇文章，谈论了Lanyrd是如何应用HTML5创建出优秀的移动Web应用的 当谈到HTML5移动web应用发展的时候，很多开发者都在等待确定前景一片光明以后才愿意尝试使用它。确实，HTML5移动web应用有改变整个移动应用生态系统的潜

HTML5游戏《黎明帝国》，磊友科技打造，官网试玩正想游戏邦创始人郑金条在《程序员》杂志专栏文章中所说：“HTML5被整体市场所观望的除了技术标准和规范不够成熟外，最大的盼头就是出现一款重磅作品给市场打入强心剂，虽然磊友、Spil或Facebook在推动这个趋势，但都不如一款有说服力的游戏来得有价值。”在2月10日，国内HTML5技术先行者和推动者磊友科技（著名的HTML5研究小组的开

译者注：Appcelerator是一家提供移动平台开发框架的公司。他们的Appcelerator Titanium开发框架让网站开发者可以使用自己熟悉的语言来开发在移动设备上运行的程序。  Cocoafish为移动应用开发者们提供包括发送信息，推送提醒，照片上传，社交分享，云储存等功能在内的25项云服务。 近日， Appcelerator宣布收购移动云服务提供商Cocoafish，并透露将

为移动设备开发web页面或者web应用与为桌面浏览器开发web页面不同，会出现很多新的挑战。为了帮助你开始，下面是一系列你需要遵循的最佳实践，以便为Android和其他移动设备提供最有效的web应用。1.  将来自移动设备的请求重定向到专门为移动端设计的Web版本 有好几种方式可以让你使用服务端的重定向将请求重定向到你的web站点的移动版本上去。最常见的情况是通过“嗅探”（"sni

概览你可以使用控制台的Javascript方法调试你的web app如果是在定制的WebView中调试，你需要实现一个回调方法来处理调试信息文档内容在Android Browser中使用控制台API在WebView中使用控制台API参考调试如果你是在为Android开发web应用，那么，你可以使用控制台（console）的Javascript API

概览在你的Android应用布局中使用 WebView 来展现web页面你可以创建从Javascript到客户端Android代码的接口文档内容将 WebView 加入你的应用¨     在Webview中使用 JavaScript ¨     启用 JavaScript¨     将 JavaScript代码绑定到Android代码

概览你可以使用viewport的元数据、CSS和Javascript来为不同分辨率的屏幕设置合适的页面本文档中的技术适用于Android 2.0及以上设备，针对默认的Android Browser中及在WebView中呈现的页面如果你在为Android开发Web应用或者在为移动设备重新设计一个Web应用，你需要仔细考虑在不同设备上你的页面看起来是怎样的。因为Android设备有不同款型

开发者视角中的优秀并不意味着用户也有同样的感受。国外知名电子商务网站Lot18的高级前端开发人员Vince Allen，特别撰文讲述了采用响应式设计开发Lot18的背后故事和7条经验。全文如下：为Lot18这样迅猛发展的电子商务公司工作是件激动人心的事情。知道几个月后，在开发团队面临一项重大决择的时候，我们狂热的情绪才逐渐平复下来。我们的困扰是：是在网站的原有引擎（该引擎很有可能网站发布后

基本上有两种方式来在Android上发布一个应用：作为一个客户端应用程序（使用Android SDK开发并作为一个.apk安装在用户设备上）或者作为一个Web应用（使用Web标准开发，并通过web浏览器访问——不需要在用户设备上安装什么）。你选择以何种方式发布你的应用基于好几个因素，但是Android做出了一个决定，使得开发一个Web应用更为容易，为此，他们提供了：对viewport属

在一个很长的调研日的休息时分，我在同一个客户谈一个项目，在这个项目中，我正为一个全球经济公司开发一个iOS标准。他们的第一反应是这样的：“什么？你在开发Apple iOS以外的标准？那还要开发什么？”于是，我们就移动设备标准进行了一个很长的讨论——这些标准是什么不是什么，以及这些标准应该是什么样。比如说，Apple在解释他们的触摸交互模型以及iOS的独特的UI元素设计方面做得很好，对于这些技术的使

Dieter Rams是20世纪最重要的设计大师之一，其闻名遐迩的优秀设计应具备的10项原则侧重于工业设计。Lisbon的设计师NunoLoureiro把这10项原则运用到web设计中，并在这篇文章中，谈到了一些他的心得。“我倾心于细节，在我看来，它比整体更重要。细节必不可少，它决定一切，同时它也是质量的保证。”---Dieter Rams在大学期间，我第一次见到Dieter Rams的作

译者注：2011年8月，Twitter推出了一个名为Bootstrap的开发工具包。该工具包自发布以来，一直是GitHub上热门的开源项目。Bootstrap2.0即将面世，本文作者Scott Gilbertson，介绍了2.0版本教1.0版本中改进的一些功能。Twitter准备发布Bootstrap 2.0。Bootstrap2.0是开源前端工具包的第二大版本，这个工具包面向web开发者，并

每天世界各地的消费者都会从联网设备上下载千千万万的应用，这些联网设备的数目在不断增长，包括笔记本、平板电脑、电子阅读器、智能电视以及智能手机。现在大多数应用发布者都发现他们处于一个相似的境地中：他们已经做了决定，到底是要为每个操作系统开发native apps还是使用HTML5构建一个web app，并且他们知道需要从什么发布渠道发布产品。但是，他们仍然面临的一个最大的挑战是如何让产品拥有需求。因

Mozilla实验室启动了一个新的项目，在这个项目中，想要对以往的Web传统做一些改变，包括一直以来神圣不可侵犯的URL地址栏。这个名为Pancake的新项目，将会帮助Mozilla“更好得懂得人们在网络上做些什么、做的原因、做的方式，并帮助人们更方便更高效地完成这些事情。”据Pancake的负责人Stuart Parmenter介绍，Pancake项目的目标是采用一些“宏大的概念甚至有时还有

注：这篇报告来自LongTail VideoHTML5已经进入了在线视频市场，这是一件激动人心的事情，同时也对工业开发者提出了挑战。随着HTML5规范和各种浏览器的不断改变，LongTail Video花费了大量的时间来弄清楚这一技术的本质，并且在各种浏览器以及设备上测试了播放效果，然后针对HTML5播放效果对产品进行了优化。HTML5视频发展现状一文意在与其他的用户以及开发者分享HTML

众所周知，对许多web设计者和开发者来说，移动web世界就像一个黑洞一样。它存在许多未知的因素（Programming the Mobile Web一书中谈到了这一点），并且现有的浏览器存在各种不同的版本。这篇文章，将为大家推荐45个最实用的官方资源。不幸的是，并非虽有的浏览器都提供了官方文档，这本书所做的更多的工作是研究并测试每个功能。请记住：所有的这些指南都是不完全的，有些甚至不一定是正确

Rich Clark是一位HTML5专家，他非常了解HTML5规范中的APIs，这篇文章中，他将介绍这些APIs的用途以及最新进展情况。有关HTML5中的语法元素相信大家已经看到过不少介绍了，但是关于HTML5的APIs的介绍就不那么常见了，而HTML5规范主要就是由这些APIs构成的。相信大家都知道，HTML5的标准有两个版本，一个是由W3C发布的，另一个则是由WHATWG发布的。WHA

欢迎大家来了解联网者相关的信息。联网者很有可能是拥有平板电脑或者智能手机，并且会时常通过Facebook和他们的朋友保持联系。现在，在25~34岁的人当中，有超过60%的人拥有智能手机。有1/3的在线消费者在2014年之前会购买平板电脑。一个来自于 Zmags的新的调查报告研究了联网消费者的使用习惯。只有4%的联网消费者使用apps。87%的用户更倾向于使用websites 和 mob

身为一个移动web网站的设计师，除非你只是针对某种特定的设备设计，否则你应该会常常碰到这样的问题：如何清楚地了解网站运行设备的屏幕尺寸大小？这个问题一直困扰着移动设备上的设计师。 例如：iPhone的高度是480个像素，宽320像素。许多Nokia N系列设备的宽度为240像素，高度为320像素。许多更新款的设备支持宽度和高度颠倒的视图。旧款的Nokia（目前仍然比较流行）设备

免责声明：以下内容乃我个人观点，并不代表我公司的意见。我作为一个独立的开发人员，所开发的App属共享资源。在之前的一篇文章里，我提到过Windows8版的TrialTool。TrialTool是一款基于web的应用，这款应用充分展示了各种Javascript接口的兼容性。它就像是一个接口的容器，任凭你浏览、修改和运行示例。这个版本的TrialTool特别展示了各种Windows8接口。1.

注：本文节选自Brain Fling的Mobile Design & Development一书。我们之前已经大致讨论过了环境。现在我们已经知道了，环境是决定移动产品策略的一个重要因素，但是我们如何了解用户的环境呢？在制定移动策略时，预测用户的环境是一件非常困难的事情。它是一个实时的状态，存在许多的变数。在用户访问我们产品前，我们可以想象一下用户的哪些行为可能会影响我们的设计决定。这不是不可能

译者注：在HTML5真正变革各平台的开发模式前，定需要取得某些根本性的突破。今年的的一大突破就是“响应式设计”的发展。从根本来说，响应式设计需让内容适应任何屏幕尺寸。今年响应式设计最引人注目的案例要数Boston Globe推出BostonGlobe.com。这篇文章转述了ReadWriteWeb与BostonGlobe的开发团队Fliament之间谈话内容，其中详细介绍了开发中遇到的一些问题。希

当需要将一个web apps的核心功能迁移到移动设备（比如iPads以及其他的平板电脑）上时，网站开发人员给出的答案往往是一个更好的网站，而非移动App。现在这样的选择变得越来越常见，所以在这篇文章中将比较这两种方式各自的优缺点。Amir Shah是位于St. Louis的AgilitySpeaks.com公司的CEO，他说到“我们碰到过各式各样的客户，每当我们提到‘移动’这个概念时，他们常常

FIG 8-1一个最小公分母设计有三个元素是打造优秀的移动用户体验不可或缺的：环境，信息架构，以及视觉设计。这一章重点关注视觉设计部分。视觉设计是你的所有设计的一个最直观的表现；它关系到用户对你的应用的第一印象。好的设计能够提升用户对你的网站或是应用程序的期望值；而坏的设计将导致用户降低对你的服务的期待。用户的期望值将转化为经济效益和品牌信用。在移动领域，目录往往是“免费”的（但用

作者简介：Rey Bango，作为Microsoft的一个技术传播者，一直致力于推进客户端Web开发的实践经验，并帮助Microsoft满足社区需求。他对于HTML5可能带来的丰富的交互的Web应用有着极大的热情。同时，Rey也是jQuery JavaScript项目小组的成员之一，以及.net杂志的作者。  文档兼容性定义了一个浏览器是如何展现你的网站的。你把你的期待对浏览器告知

Grooveshark可能已经被iTunes App Store 和Android Market下架了，但这并没有阻止这个富有争议性的音乐流新公司推进它的移动策略。这个公司没有和Apple和Google纠缠不休，而是通过发布一个Web app，在HTML5的帮助下放弃使用Flash，将一切掌握在了自己手中。这个Grooveshark的HTML5应用可以在任何现代移动浏览器上播放音乐，包

用户在线数据的安全与隐私是一个越来越敏感的问题。而Mozilla在获取更多用户数据的同时，将会如何应对这一问题？国外科技媒体ReadWriteWeb对这一问题给出了解答。请看下面的文章：Mozilla在2012年有个大计划。这个非营利开源组织将在Firefox中增加一些新的特性，这对于用户数据需要更大存取权限。在一篇博文中，这个组织解释了它将如何使用这些数据。简而言之，就是：小心又小心。M

译者注：Cut the Rope 是一款人见人爱的小游戏。有一个开发团队将它改造成了HTML5版本。想看看他们在改造过程中的经验之谈吗？那就看下面由开发人员自己写的文章吧~ 启示 在IE9中作为一个HTML5应用来运行，从原始的iOS源码改写而来。 Cut the Rope 是一款人见人爱的小游戏。所以我们有了个点子，即通过使用HTML5将这款游戏放到网上以

注：本文来自读写网，作者是Dan Rowinski。2012年开发人员对HTML5都有哪些新的期望？HTML5是一个发展中的标准，在2011年里，HTML5的发展取得了许多突破性的进展，但是它还有许多方面需要进一步的提升。HTML5开发的两大主要参与者Sencha 和appMobi 都参与了2012年HTML5发展预测的讨论，下文将给出详细介绍。这些期待从简到繁，其中既包括数据缓存优化策略

出于对HTML5前景的信心，商业报刊公司Financial Times收购了为其开发移动Web App的研发公司。总部位于London的Assanka 被FT收购，但是具体的收购价格则尚未对外透露。收购Assanka以后，FT将会把它吸收到内部系统之中，这样，FT将不再以外包的形式雇佣Assanka为其打造移动Web App，而可以直接让它在内部进行开发。无论给出的收购价格究竟是多少，它都代表

注：本文先出自TechForm推荐，并做了摘要点评，WebAppTrend保留并将全文翻译如下。后PC时代的应用和HTML5之争，双方观点目前都在争论。科技源在[超级火爆]未来趋势大争论:应用 vs 网络,谁是未来?[全面详解]文中详细分析过事情的大致来龙去脉，这篇来自BI的分析报告，HTML5 短期内无法撼动移动应用为代表的应用，大约会需要3-5年的时间；HTML5 拥有更好的用户交互性和更

2011年是移动web年。移动web的工具集和资源库步入成熟，新的工具不断推出，各种丰富的插件使得基于web的移动应用程序开发变得越来越方便。下面是移动web 2011年综述，里面记录了2011年推出的最具影响力的资源和发生的大事件！Weinre Weinre在2010年12月推出了它的首个版本， 但是很快，它就占领了市场，并且成为最好的远程调试工具，和WebKit/Chrome这些桌

1. HTML5并非是一整块 你也许会问：“如果老的浏览器不支持HTML5我该如何开始呢？”这个问题本身就是具有误导性的。HTML5并不是一大块整体，而是一系列单独特性的集合。所以你是不可能去检测“HTML5支持性”的，因为根本就没有这种东西存在。但是你可以测试对某些特性的支持，比如画布功能、视频功能、地理定位功能。你可能认为HTML5是一系列标签和尖括号。这的确是HTML5中很重

面对爆发增长的移动互联网发展，以及随之而来复杂丰富的 平台设备，跨平台以及Web App开发已经成为众多开发商进军移动市场的主要选择之一。相对于Native App，无论是采用跨平台框架开发出的Hybird App，还是主要基于HTML5技术的Web App，都有着对开发商极富吸引力的诸多优势，特别是可以大大减轻繁重的设备调试和后续版本更新工作，以及学习和人力成本的降低，使得Web App、HTM

技术总是不停地在变化。设备视图在不断地改变，同时设备的类型也在推陈出新。随着中等尺寸屏幕设备（mid-screen devices）的需求日益增长，管理所有设备的分辨率和屏幕尺寸已经变得越来越困难了。因此我们将现有的针对各种屏幕分辨率的管理工具整合在了一起，供用户下载。无论是触屏的HVGA移动设备还是5路输入的高清晰电视，Punchcut的UI项目都涉及到了。我们一直致力于解决新屏幕尺寸的处理

在移动环境下设计和开发优秀的forms是一件非常有挑战性的事。在一流的浏览器中，forms能够模仿桌面版本的风格，但是对于其他的浏览器，forms往往无法达到他们期望的样子。但是一个更大的挑战是，对用户而言，forms通常很难控制，内容添加也很麻烦。所以头号规则就是：在移动环境中，要限定使用的forms。自由文本输入控件虽然在forms不可避免地需要用户输入信息，尽量避免使用文本框和文

注：本PPT来自面孔网张路在极客公园创新大会上的演讲，演讲词也附在下面，HTML5技术的成熟、Web App产业的繁荣需要更多这样的框架和工具。面孔网张路：View more presentations from yangdj.面孔演讲词View more documents from yangdj.译文来源：http://www.web

注：这篇文章发表于September 30th, 2011 ，作者是Jason Grigsby 在响应式图像Part 1中，我站在一个比较概况的层面，解释了什么是响应式图像，这其中需要解决的问题以及一些共同面临的议题。在这篇文章中，我会对于响应式图像中设计的具体技术做一个更详细的论述，并且来看看这些技术的可用性。如果你还没有读过part 1，也许你会想要先读一下以便了解我在文中用到的一些术

注：这篇文章发布于September 27th, 2011，作者是 Jason Grigsby 在我上一篇的博文“什么是移动优先的响应式Web设计”中，我提到了一个用来判别一个响应式Web设计是否是“移动优先”的标准，即这个设计是否有处理IMG标签的策略。最近在国外关于一个Web设计的网站Smashing Magazine上的一篇文章总结了一些响应式Web设计技术，其中包括几个处理IM

注： 本PPT来自Adobe董龙飞在HTML5 Open Party上的演讲，主题为关于PhoneGap的12件事，帮助大家对PhoneGap这一优秀的跨平台开发工具扫扫盲。Adobe董龙飞：关于PhoneGap的11件事View more presentations from yangdj.译文来源：http://www.webapptrend.com/ We

常常有人向我问起“我怎样将我的产品转变为一个移动产品？”而我的回答是，不要这么做。简单地将一个网站，app或是游戏转变为一个移动版本其实是一个非常大的错误。可能我们能够从其他媒体上的产品中学到不少经验，但是移动市场却非常独特，无论是在处理的问题和盈利的模式上，都与以往的媒体有所不同。所以开始移动策略的最好方法是重新创造一个产品，而不是简单地针对小屏幕修修改改。还记得早期的网站设计吗？它还是

移动场景的相关问题一直困扰着我。在2009年一月，我写过一篇“On the Go” Myth?的文章。许多非常聪明的人受到移动场景的困扰，并认为“移动场景其实被过分夸大了”，对于这一现象，我其实并不感到意外。考虑到我之前对移动场景持有怀疑的态度，你可能认为我会认同现在的“移动场景并不存在”的观点。但事实上，当我阅读了大量关于移动web并不存在的讨论文章和推文后，我发现其实我并不认同这一观点

总结：从我们上次发布的研究数据到现在，移动网站和apps的用户体验已经有了很大的提升，但是还有很长的路要走。一个专用的移动网站是很有必要的，apps具有更高的可用性。在此不用再重复“移动年”这样的噱头。如果一定要说的话，去年一年移动的发展主要体现在移动使用的增长以及移动网站和apps的可用性提升。现在是时候重新设计你的移动网站了，因为你之前设计的版本可能已经无法满足用户日益增长的需

Dropbox REST API将永久地改变商业web app的交互方式。它将允许web app从用户的桌面或移动设备上存取数据。这意味着web apps（尤其是小型商业应用）的用户再也无需面对繁琐的UI了，而开发者也不用为了针对新的交互和应用重新改造电子表格了。这真的太神奇了。你看到了吗？你是否现在就想试一试了？试想一下：你的客户能够在自己的桌面app上修改web app的数

每年都有许多新的web apps上线，而其中许多应用却没能得到应有的重视。现在就来总结一下，2011年10大值得更多关注的Web Apps。文章开篇的图片来源于 Melissa Downey.注意：虽然很多web apps可能不能记录在此，但是还是非常感谢所有为对这篇文章提供了宝贵意见的人。10. 迷你Apps在文章的开始，我们并不打算单独地列举某个特殊的app

注：本文来源于国外独立的技术博客昨天在Twitter上的一些有趣的讨论中，我发现人们对于Web应用和站点对Javascript的依赖普遍存在一种疑惑。这种疑惑一直都存在，而对我而言，这个问题随着浏览技术的飞跃发展而集中爆发了。我第一次遇到这个问题还是在DHTML盛行的时代。我们对浏览器无所不用其极，加上各种动画菜单、3D标签（我们现在已经学会不再使用这些了），但总有人告诉我们Jav

编者按：本文作者为海豚浏览器CTO 刘铁锋，HTML5的兴起让业界有了Web App和Native App之争，本文对Web App 2011年的发展状况做了超详细的盘点，并指出基于HTML 5的Web App会有新的开发模式，甚至于不同于App Store的新盈利模式出现。如有读者想和作者就此做更深入的探讨，可以在微博@百纳刘铁锋。从HTML 5开始兴起之后，在移动平台上Web Apps

HTML5为Web开发者提供了很多强大的新特性，但是它的一些特定的限制会让它无法和本地应用匹敌。HTML5整合进了很多新的特性，并且有可能提升Web编程模式。和每一个阅读技术资讯的人所知道的一样，没有任何一样东西能像HTML5对互联网造成更多改变。在代码中加入一些HTML5，网站会变得更快更炫。但是HTML5能为那些想要要网络上实现本地应用表现的人做什么可能不在此列了。在享受了HT

除非你现在正处在世外桃源，否则你不可能没有听说过web设计者间最近广泛流行的响应设计（Responsive Design）。Ethan Marcotte使用responsive design这一术语描述一种新兴的技术，它采用易变的布局和媒体查询扩展网站，使得网站能够动态适应各种尺寸大小的屏幕。如果你之前从未听说过响应设计，那么你可以好好读读Marcotte的介绍文章。简而言之，响应设计就是

在Khan Academy（Khan Academy中文名称为可汗学院，是著名的网络课程学校，在iTunes U以及Youtube上非常火爆。），将以一种新的有趣方式教授学生计算机科学。其中最有趣的部分就是可能会将JavaScript作为学科的第一语言。John Resig是Open Source的院长，他在博文中表示：我们主要是教授那些已经接受了数学和科学中心课程的学生。因此我们

谈到移动设计，并不是所有的人都有足够的资源和时间去重头开发一个全新的移动网站或是重新设计成一个移动优先的网站。Mobilizing Web Sites一书的作者Kristofer Layon将在本文中介绍，如何一步一步地将一个已有的网站改造成一个移动网站。在过去的几年中，我有幸参与了一些关于移动web设计的重要会议，如果你对移动市场感兴趣并且正在阅读这篇文章，你可能已经听过一些给人带来

在即将到来的一年，APIs仍然将是企业开发的核心工具。对一个企业来说，APIs的地位已经从‘最好能够具有’转变为‘必须具备’了。将后台的功能具体化将有助于apps与系统交互，这一趋势已经越来越明显了。到2012年，几个APIs的发展已经形成了趋势。企业APIs成为主流我看到许多关于Facebook，Twitter和其他公共APIs的讨论。然而，这些公共APIs的激烈

“Web已经死了。HTML5将统治着未来的一切。用户正在应用上花更多时间，在Web上花更少时间。”“你可以在Web上做任何你能在本地应用中做的事情。”这是我在这两年听到的泛滥了的“本地和Web”之争，我不得不对这个无聊的争论吐个槽。这不是二选一的决定我们为什么不再去争辩“打印”和“数字化存储”谁优谁劣呢？因为大多数人都已经明白了每一种介质在这个世界上都有它的位置，它们可以彼此补充，

Mozilla的技术推广人员希望在2012年能够推动web游戏的变革Mozilla技术布道师Rob Hawkes在博客中预测了在线游戏的未来，他认为在线游戏的发展方向就是能够使用web标准，并希望在2012年能够推动游戏的变革。他想将Mozilla的整体目标从封闭系统转移到免费apps上来，让开发的产品能够通过各种app stores和系统发布，并且能够在所有的设备上运行。文章

摘要：Ngix是增长最快的Web服务器。现在它拥有10%的市场份额，而今年年初的时候，它的市场份额是5.9%。俄罗斯的Web服务器nginx是Web服务器市场的新星。现在，在排名前100万的网站中，每天都有100个网站开始使用nginx。Nginx从其他各种Web服务器那里赢取阵地，其中有很多来自于Apache，这一点可以参看我们的技术变化调查报告。

Edge Testing Solutions的创始人之一，Susan Chadwick在这篇文章中总结了五大失败的web案例，并给出了一些相关的建议。2011年有一些网站出现了故障，我将它称之为‘glaunching’，其中有时故障造成了比较严重的影响。1. Olympics首先指出的是三月份推出的Olympic订票系统。虽然它之前已经给出了友情提示，建议用户不

简介：本PPT来自赶集移动事业部何知翰，从今年10月份到12月份，赶集团购开始开发移动客户端产品，其中采用了Native框架+Web View的混搭开发模式，广泛采用了HTML5技术，并积累了不少经验，特向广大开发者分享。【项目分享】赶集团购Web App开发总结View more presentations from yangdj.译文来源：http://www.we

本年度年度公司选择Evernote是因为它似乎违反了商业趋势，让用户为免费的东西付费，完全颠覆了我们以往的想法。Phil Libin 还记得他将童年落在身后的那一刻。这大概是四年前，那时候他的互联网公司集资失败。那时候的他，35岁。这个公司曾经给他带来了无数喜悦，直到集资失败的那一刻。在凌晨三点，因为资金耗尽，他已经无助地等了很久，等待一个风险投资家或者天使投资或者一个CEO或

对于浏览器上的开发者来说，2011年又是相当精彩的一年。web开发者Phil Hawksworth在这篇文章中总结了web 上经典的JavaScript用法。那些喜欢冒险体验前沿技术的开发者现在应该会非常开心。浏览器正变得越来越强大，上面有各种丰富的功能可以供开发者选择，一些在几年前几乎难以想象的功能都已经一一实现。有了这些新功能，开发者现在能够开发出更精细、更复杂、更有想象力的用户界面了

Yahoo前首席设计架构师Luke Wroblewski导读：很长时间里，Mobile Web设计领域都在呼唤一个权威的设计指南，前雅虎首席设计架构师Luke Wroblewski对于Mobile Web有着深刻的理解和丰富经验，他将自己的心得整理成《Mobile First》（http://bkaprt.com/mf）一书，值得每个移动开发者细读，本文为第四章选摘，讨论移动应用上，内

又到年末，正是做本年总结和来年计划的时候，更别提当前IT产业的汹涌变革让每个人都提起全部心神才能不被淘汰。本文作者在为客户处理web项目时感受到来自客户普遍的紧迫感。每个客户都目标普遍提出需求：提升产品可用性，树立公司的鲜明特性，缩小与竞争对手的差距。但这也正是问题所在。这些目标几乎成了大多数web创业公司的常见目标，结果却往往变成对原产品或业界成功产品的重包装。原因显而易见。这种方法是很

今年HTML5确实给我们带来了很大的冲击。HTML5 Doctors，Oli Studholme评选出了20个最佳网站，它们涵盖了语义、音频、客户端web apps、canvas以及SVG和WebGL，这些网站预示了未来web的发展方向。对HTML5和web来说，今年是收获丰富的一年。HTML5在不断成熟，今年5月HTML5进入了Last Call阶段，并计划在2014年完成标准制定。WH

Apple设计大奖（Apple Design Award，ADA）就好比电影界的奥斯卡大奖。令这些极客们魂牵梦绕的不是那尊小金人，而是开发者评选出的Apple最受欢迎新应用大奖。作者在今年的Apple’s World Wide Developer大会上获得这个奖项。作者由此开始考虑如何通过Apple的ADA评价标准敦促成千上万的开发者们开发出更加完美的移动apps。这篇文章，就是作者对这些

12月20日，PhoneGap社区推出了PhoneGap 1.3版本，这个版本对BlackBerry和Windows Phone做了很大的改进。在BlackBerry中加入了OSX支持，现在开发者可以在Mac上开发BlackBerry了。Windows Phone的用户能够使用所有的PhoneGap API了，还推出了Windows Phone Getting Started Gu

本文为图灵公司质量（QA）部主任李松峰在翻译《HTML5:The Missing Manual》一书时摘录的关于HTML5的有价值的知识点。最早在@李松峰 （新浪）微博上分享，后经过整理原发在图灵社区，在获得李老师授权后，WebAppTrend转载了此文，以供有意者学习参考。#HTML5: The Missing Manual# 如果说HTML是一部电影，那HTML5就是一次大转折。H

HTML5很棒，因为它几乎无所不能——它并不是为某种特殊的应用设计的。更重要的是，HTML5几乎是无处不在的。它就在你的PC机上、你的手机上、你的平板设备上——它甚至可能就在你的厨房电器上。正是由于HTML5具有丰富的功能并且无处不在，所以它给开发者带来了很多的灵感。俗话说得好，“一旦开发者有了灵感，他们就开始编写游戏了。”（这句话应该是作者编的O(∩_∩)O~）幸运的是，有关HT

作者简介：Malcolm Sherida是Microsoft在ASP.NET方面的awarded MVP，精通ASP和Telerik，经常在澳大利亚和新西兰的会议以及用户组中做报告。作为一个长期使用ASP.NET的人，他关注Web技术超过10年了。他喜欢使用ASP.NET MVC工作，并喜欢使用jQuery和Javascript。他也为SitePoint和其他一些网站写一些关于ASP.NET的技术

作者简介：Malcolm Sherida是Microsoft在ASP.NET方面的awarded MVP，精通ASP和Telerik，经常在澳大利亚和新西兰的会议以及用户组中做报告。作为一个长期使用ASP.NET的人，他关注Web技术超过10年了。他喜欢使用ASP.NET MVC工作，并喜欢使用jQuery和Javascript。他也为SitePoint和其他一些网站写一些关于ASP.NET的技术

就像是坚定的Web信徒一样，资深开发者Chad Austin也非常认同Google Native Client技术。他认为web就是一个编程平台——它不仅可以跨越不同的设备，还能能引发世界范围内的技术企业的竞争——Native Client能够将其他需要在硬件环境中执行的语言引进这个平台，这其中包括C、C++和其他高效的“native”语言。Native Client——一个Goo

Node.js被认为是一种很新潮的编程语言，有着和Rails、Ajax和Hadoop一样的传统，甚至在某种程度上和iPhone编程（）和HTML5一样新潮。到一个大的技术会议上，你一定能发现一些与Node.js相关的演讲。如果进入到更深的层面，你会了解到Node.js（被大多数人简称为Node）是一个服务器端的Javascript解决方案，尤其长于处理响应HTTP请求。当人们聊到如何用No

移动和Web HTML5框架及工具提供商Sencha遭受了严重的打击——公司的developer relations负责人James Pearce决定跳槽到Facebook。Sencha立刻开始寻找新的负责人，他们选定Ted Patrick 来弥补James Pearce留下的空缺。Patrick曾就职于Barnes & Noble和Adobe，推动了Flex平台的推广。他担任过咨询师

Mozilla和Firefox团队渡过了困难的一年。Firefox曾是Web的宠儿，并且成功地撼动了Microsoft和IE的市场地位。但Chrome渐渐成为Web开发者的新宠。这意味着，Firefox的投资者可能会发生变化。Firefox是否能走出困境？答案显然是肯定的。Firefox是否已经在劫难逃了？现在可能还言之过早。Google如果不再续约Firefox可能会面临财政

JavaScript一时间还无法取代Office的宏定义功能，但是Office Web apps（以及基于SharePoint的企业应用）正在逐步提升。对于用户而言，这意味着他们可以使用各种简单而实用的功能，例如Excel Web app就能够让用户选择一组表格单元，应用程序自动计算选中的单元格的和以及平均值，就像桌面版Excel的功能一样。但是新的Excel Mashup网站在Office We

虽然Web出版行业还处于探索阶段，但目前它已经取得了许多突破性的进展。提供的产品更加精明，价格更令人满意，内容也更加精彩。Web出版要成为未来的主流出版方式可能还有很长一段路要走，但是这个产业已经在朝着这个目标加速前行了。它带来了全新的阅读模式，全新的编辑方式以及全新的广告模式。出版行业逐渐变为一个高科技产业，出版工具正在影响出版的内容以及其他各个方面。传统的出版商难以迅速地调整出版方向，

注：本文作者为畅销移动Web图书作者Brian Fling，本文为其著作《Mobile Design And Development》的样章节选。移动Web无所不在移动web是目前唯一的支持各种设备访问的平台，与桌面web一样，移动web支持各种标准的协议。移动web也是唯一一个可供开发者发布移动应用的平台。它将各种移动交互与桌面任务有效地连接了起来。

上面是Brad Frost.精彩演讲内容的PPT展示。Frost的幻灯片以及演讲的主题就是：web的发展速度实在太快了，以至于我们几乎无法开发出一个永不过时的网站或是web apps。但是，我们能够考虑如何设计一个面向未来的网站。换句话说，我们可以不用顾虑现在web技术的限制，随心所欲地设计一个理想的未来网站。Frost的意思是指，我们可用使用responsive design这样的工具，创造出各

移动web是目前唯一的支持各种设备访问的平台，与桌面web一样，移动web支持各种标准的协议。移动web也是唯一一个可供开发者发布移动应用的平台。它将各种移动交互与桌面任务有效地连接了起来。移动web平台具有以下一些优点：容易学习，开发成本低、标准化、使用方便、易于发布。我将这些优点归结为无处不在原则：通常开发简单而且市场广泛的东西往往能够取得成功。“高质量”也是成功的关键因素之一

现在的web比去年看起来臃肿了将近25%。从前1000名最流行的网站上的统计看来，相比去年，每个网站上的网页平均增加了25%——从每个网页626KB增长到了784KB。单单从一年的增长情况看来，这个速度已经是非常可怕的了。众所周知，网页越大，加载的速度自然也就越慢。网页数据量的统计来自HTTP Archive，它每个月会更新网页数据量的最新统计值。不难想象，网页中最大的数据

一直以来，很多人都专注于HTML5能够实现什么（或者是如何将各种方法连接起来，实现一个更加优雅的解决方案）。而现在，也不少人想将目光投向那些HTML5无法实现的事情。MSDN上微软员工thebeebs的一篇博文回答了这个问题：1:HTML5无法实现DRM如果你有一家多媒体公司，你需要控制或者限制你的视频内容——通常是在多媒体内容中添加数字版权加密技术（DRM）。不幸的是，HTML5

口水话题，但来自一线开发者和创业者的回答还是有价值的。以下部分来自知乎部分来自CSDN或微博等其它媒体。1）连长王江我是公司的CEO，但同时也是航班管家的产品经理，让我用这个目前市场上占有率最大的手机商旅应用来做个例子，说明一下我们是如何考虑web app和native app的：1）两大核心功能：机票查询和航班动态，全部是native app，主要是为了保证速度和稳定性，

导读：很长时间里，Mobile Web设计领域都在呼唤一个权威的设计指南，前雅虎首席设计架构师Luke Wroblewski对于Mobile Web有着深刻的理解和丰富经验，他将自己的心得整理成《Mobile First》（http://bkaprt.com/mf）一书，值得每个移动开发者细读，本文为第四章选摘，讨论移动应用上，内容和功能的组织之道。CSDN总编刘江 注：Mobile

注：本文作者为畅销移动Web图书作者Brian Fling，本文为其著作《Mobile Design And Development》的样章节选。移动Web无所不在移动web是目前唯一的支持各种设备访问的平台，与桌面web一样，移动web支持各种标准的协议。移动web也是唯一一个可供开发者发布移动应用的平台。它将各种移动交互与桌面任务有效地连接了起来。移动web平台具有以下一些优点

前言：一旦你了解了HTML5,你就会改变审视web的方式。by Brett McLaughlinHTML5:每个人都使用HTML5，但是没有人知道HTML5到底是什么。我知道这听起来像在说一个脱节的电影—也许是Waiting for Godot或者是Sartre的电影剧本—而不是关于HTML5的声明。但是这的确是事实，大多数人把HTML5当成是HTML4+，或者更糟，HTML4（其中的一些