前端工程师-高级web网站前端开发设计注意因素.docx

当谈到设计和创建网站时,似乎从来都感觉不够快。考虑到快节奏,很多小的细节经常会脱离设计过程。虽然这些细节可能微不足道,但是可能将网站从漂亮带到真正的优秀。AD:这些细节往往容易错过,因为他们不会影响网站的整体外观和感觉。问题是,这些细节往往会如影随形。而她恰恰是对用户体验忠诚度的体现。下面列出10个关键元素,记住它,你将避免走回头路。1、链接(link)设置链接状态的不同风格,这是基础也是必须。你可能吃惊细节被忽略的次数。包括下面列举的页面上所有链接的状态。Normal(常态)这是链接的默认状态。鼠标还没有悬停、点击,或是转向向URL的时候,这个链接格式大部分的设计师会考虑到。Visited(已访问)这个链接是鼠标没有悬停或是点击,但是已经被用户访问过。Active(活跃)这是正在被用户点击的状态。绝大部分开发者会复制Hover(悬停)状态到这里。Hover(悬停)Hover状态是鼠标经过、并未点击。你忽略它了吗?最常被忽略的情况是,链接的各种状态没有计划到网站的所有地方。比如很多网站针对浅色背景会有深色的主体(body),但是在页脚却恰恰相反。在FullMoonBBQ,我们看到基本的红色链接在内容区域,基本的白色链接在下面的页脚处。非常小的细节,但是毫无疑问很重要。(Forms)对于很多开发者,表单的配置是重要的,不可能被忽略的。然而,还有许多开发者在事后才想到。上述后者认为表单仅是代表将用户转为客户的路径,并且没有适当的计划和设计,这些表单的实用性将大大降低。准备好这些元素是重要的,即使被看来要比颜色、图片、品牌等更小的紧迫性。下面的2个元素,要做重点考量。Formlabel(表单标签)表单是收集用户数据的途径,而且用户是自愿提交个人数据的。准确的目的,适当的提醒用户,是聪明的做法。Inputfieldsandlabels(输入域和标签)其次,页面表单输入域的布局,标签样式及导向性。当使用默认值,表单会看起来很糗。但是进行恰当的准备,网站会看起来会非常有效果。从好的规划开始,一起看看下面的例子吧。Awesome上的商业型表单很清晰。整个页面的目的和使命被充分考虑到。从标题和介绍,到每个域的布局,标签和控制风格,可以说是模板。(Buttonbehavior)按钮可用户实现各种目的,贯穿整个网站。但是他们的各种状态,还是容易被忽略。Default(默认)按钮的默认状态,等待被点击。多数设计师记得住这个,忘记了其他。Hover(悬停)悬停状态,当用户鼠标经过按钮时的状态。该状态提示用户按钮是可触发的,这一点很有帮助。Click(点击)当用户点击按钮,状态来进行提示。这样的视觉提示可以帮助降低用户的困惑。Disabled(失效)按钮的失效状态,可能是最少被使用的。但是对于开发者却是很有帮助,除非你已经为按钮准备好了验证过程。它非常像链接的各种状态,一定要考虑整站的按钮状态的运用。从弹出框(pop-up)、登陆框(log-in),到搜索域、报名表单等,所有的按钮需要有一致性的风格。(Formvalidation)网站与用户的要求或错误的沟通形式,也是非常重要。下面的三个核心问题需要考虑。Requiredfields(请求域)所有的请求域应该被提示,一般会有星号标记。Real-timevalidation(实时验证)用户完成表