菜单

支付三个 Web App 必须明白的那个事

2019年2月18日 - 金沙前端

用户体验(UX)

表单:当提交三个表单后,用户应收取提交后的举报。假诺提交后不向用户发送3个例外的页面,那么就相应有弹框或
alert 一些新闻,以便让用户通晓这一次提交是不是中标。

登录重定向:倘诺用户打算在你的网站打开二个页面,但并不曾登录,那么她们应当首先接受到2个能登录的页面,并在签到后重定向到一个他们原来想打开的贰个页面(当然,前提是已收获授权)。

假设他们尝试登录,但提供了二个张冠李戴的密码,那时,用户有或然是忘记了密码,那我们就相应提供三个视觉线索来指示他们,要有一个重置密码的选项。

 用户体验:带宽

  移动端的带宽比台式电脑的带宽特别难能可贵,那也是举手投足应用的一大话题。因而,你应当寻找一切机遇来收缩请求的多寡,尽大概选用异步,减小被呼吁能源的轻重缓急。

  JS与CSS:你应当讲应用上一定的JavaScript和CSS集中停放1个文件中(三个存JS、3个存CSS),并尽量减弱它们的高低。你的爱侣在此处 Grunt-contrib-concat , Grunt-contrib-cssmin 和  Grunt-contrib-uglify 。

  为保有能源–使用CDN:使用CDN主要有两个便宜。第二个适用于拥有托管的能源即是定位,CDN能够确保您的财富在某些区域,然后用户访问的时候可以就近访问财富,那样裁减了财富加载时间。

  第贰个是接纳于你的Web应用的依赖文件(比如:非特定于应用的体裁和JS代码)。对web应用所依赖的文书使用CDN,可透过用户的缓存来极大地减小加载时间。举个例子,很多网站都依赖Angular.js,使用CDN来链接到宗旨角代码将会触发1个缓存命中,移动装备用户将会从缓存中收到它,而不是发起另三个HTTP请求。

  CSS-减小本子大小:半数以上开发者刚初叶的时候或然会使用某种UI框架(如Bootstrap、Foundation等)。那几个框架或然那多少个大,寻常在一大半CDN上都可用它们的精简版样式,你也不能够必要利用它们所蕴藏的一体体制。日常,像类似 uncss 的工具(经常与类似 processhtml 的工具搭配)在帮您移除那一个用不着的体裁有存疑的意思。

  需求强调的是,uncss解析器不只怕解析动态样式。所以你在检测的时候,必须审慎,确保别删错了那三个实在被运用在你的利用中的样式。

  CSS-将首要的代码放置到head:在采纳加载完从前,关键样式应该已经可用,它们应该放权Head中。次要的体制可用稍后再加载。

  JS-减小本子大小:由于在你的制品中JavaScript代码不要求任何内部变量对芸芸众生易精通,将变量user.email重命名为u.e只怕会推进减小你的台本文件。幸运的是,有个工具得以帮您做这一个工作-前边提到的 uglify ,它可以将您的JS代码变得难以读懂,可是JS文件会更小。

 用户体验

  表单:当提交表单时,用户应该赢得一些有关提交的反馈新闻。如若提交后页面没跳转到其余页面,那么就活该有一个弹出类型的唤醒来让用户知道她们是交给成功了大概战败了。

  登陆重定向:假诺一个用户正想访问你网址上的某部页面,可是她并未登陆,那么用户应该率先被导向登陆页面,用户登陆之后又会跳转到他以前试着去做客的页面。
就算她们在登陆时输入了错误的密码,应该给予提醒,提醒他们只要忘记密码了可以接纳重复设置新密。

电子邮件

订阅设置:你发送给各个用户的邮件,至少要含有三个链接到你的施用的一个页面,在那个页面上用户可以修改他们的信箱设置;还应有一个单身链接供用户来撤销订阅。
别让他们发邮件给您来裁撤订阅。

关于小编:刘健超-J.c

图片 1

前端,在路上…
个人主页 ·
作者的文章 ·
19 ·
    

图片 2

 用户体验

  表单:当提交表单时,用户应该取得部分关于提交的上报新闻。如若提交后页面没跳转到别的页面,那么就活该有2个弹出类型的提醒来让用户精晓他们是提交成功了仍然败诉了。

  登陆重定向:如果五个用户正想访问你网址上的某部页面,不过她从没登陆,那么用户应该率先被导向登陆页面,用户登陆之后又会跳转到他此前试着去做客的页面。
若是他们在登陆时输入了不当的密码,应该予以提醒,指示他们只要忘记密码了足以采纳重复设置新密。

 工程

  单页面应用:近期单页面应用(SPA)是主流,它的重点优势:SPA只须求更少的加载,只要求加载你所急需的能源,而且不必要重新三回又五次的加载。若是您碰巧准备做3个新的web应用,你应当选取SPA。

用户体验:表单

确保您的表单和劳作流程省略,总体上而言那是多个很好的提出。倘若您还选用了针对移动端进行陈设,那么这或多或少更是首要,没有人乐意在她们的无绳电话机上填入具有多少个页面的表单。

自家盼望以此列表可以对那些正准备开发你的首先个web
app、或是这多少个已经先导在付出、或对前者设计优化技术并不熟习的爱侣有扶持。假诺你入手开发从此发现了有个别任何被遗失的技术或技术,请记下来并告诉小编,我会考虑把它添加在那些列表中。

原稿地址:

初稿地址(英文):

 

 

移动端

即便你不用支付活动端…但不管您是或不是做,你都应有保险那是1个积极性的支配,因为那会对您的应用程序设计和工程有实质性影响。

上边的注意事项是只要你已摘取移动端作为你的阳台之一。小编正好选择 Grunt
作为作者的打造工具,所以自身得使用部分 Grunt-specific
插件,但您或者应用类似的 JavaScript 打造工具。

 用户体验:表单

  确保您的表单和行事流程简单,总体上而言那是二个很好的提议。假诺您还增选了针对性移动端举办布置,那么这或多或少尤为重点,没有人乐于在他们的手机上填写具有五个页面的表单。

  小编盼望以此列表可以对那多少个正准备开发你的首先个web app、或是那么些早已起头在支付、或对前者设计优化技术并面生的敌人有帮忙。要是您入手开发从此发现了一些其余被遗失的技术或技术,请记下来并告知小编,作者会考虑把它添加在那个列表中。

  如若你也喜欢那篇作品,或觉得它对您有帮助,请分享到社区,让更加多的敌人收益于它吗!

  由程序员的资料库–小柯同学翻译,有翻译不得法的地点,请匡助考订,多谢协助。

  英文原文: Things to Know When Making a Web Application in
2015 翻译:codecloud.net

 用户界面

  分辨率:在您付出你的MVP时,你只怕不必要保险您的UI可以在具有设施上优雅地工作,但是,但您应当有限支持它能适用于手机和平板总结机分辨率的骨干范围。

移动端

你并不一定要为你的采纳开发活动客户端。不过,开发或不开发,你不可以不驾驭它是壹个不行重大的控制。因为那将对开发你的采纳的设计师和工程师发生首要影响。

以下假定你曾经采用某一定移动端作为你的阳台之一。我正要使用了Grunt来作为小编的打造工具,所以,我一度拥有一些有关Grunt的插件可以用。然而,大概存在有的与您正在采纳的JavaScript工具类似的事物。

安全性

肯定邮件:当用户注册时,应向他们发送带有点击确认邮箱的链接的邮件。假如用户更新他们的邮箱地址,则要再度重新那么些工作流程。

地点管理:当存储密码时,首先对它们举行加盐和散列操作,然后再用前几日周边利用的
crypto 库。尽管您不这么做的话,把地点管理转由给 脸谱 / GitHub /
 推特(Twitter) / 等,用 OAuth 就能不负众望。

加密:全数证件难题,还有啥比 SSL
更好。使用它吗。还足以动用 HSTS。

证据:不要把服务器身份音信(API
密钥、数据库密码等)放到版本控制里,否则就泄密了。

  那一个清单大概在好几方面不尽详细,若是您是一个人经验充裕的开发者,小编难以置信那里将不会有怎样东西会让您感到惊叹。不过,作者梦想它对那多少个可能有失了有的东西的人有支持。

 电子邮件

  订阅设置:你发送给每一个用户的邮件,至少要含有一个链接到您的采用的1个页面,在那几个页面上用户可以修改他们的邮箱设置;还相应二个单身链接供用户来撤消订阅。
别让他俩发邮件给您来废除订阅。

用户界面

分辨率:在你付出你的MVP时,你可能不需求有限支撑您的UI可以在拥有装备上优雅地劳作,可是,但你应有有限支持它能适用于手机和机械电脑分辨率的宗旨范围。

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图