网页制作有必要留意的10个元素

下面介绍的这10个元素或许很简单被你忽视，当然关于整体要过影响也不大，可是作为细心的人会发现，留意他们会给用户带来更好的体验。

　　1、链接(link)

　　设置链接状况的不同风格，这是根底也是有必要。你或许吃惊细节被疏忽的次数。包含下面列举的页面上一切链接的状况。

　　Normal(常态)

　　这是链接的默许状况。鼠标还没有悬停、点击，或是转向向URL的时候，这个链接格局大部分的规划师会考虑到。

　　Visited(已拜访)

　　这个链接是鼠标没有悬停或是点击，可是现已被用户拜访过。

　　Active(活泼)

　　这是正在被用户点击的状况。绝大部分开发者会仿制Hover(悬停)状况到这儿。

　　Hover(悬停)

　　Hover状况是鼠标通过、并未点击。你疏忽它了吗?

　　最常被疏忽的情况是，链接的各种状况没有方案到网站的一切地方。比方许多网站针对淡色布景会有深色的主体(body)，可是在页脚却恰恰相反。

　　在Full Moon BBQ，我们看到根本的红色链接在内容区域，根本的白色链接鄙人面的页脚处。十分小的细节，可是毫无疑问很重要。

　　2. 表单(Forms)

　　关于许多开发者，表单的配置是重要的，不或许被疏忽的。可是，还有许多开发者在事后才想到。

　　上述后者以为表单仅是代表将用户转为客户的途径，而且没有恰当的方案和规划，这些表单的实用性将大大下降。预备好这些元素是重要的，即使被看来要比色彩、图片、品牌等更小的紧迫性。

　　下面的2个元素，要做重点考量。

　　Form label(表单标签)

　　表单是收集用户数据的途径，而且用户是自愿提交个人数据的。精确的意图，恰当的提醒用户，是聪明的做法。

　　Input fields and labels(输入域和标签)

　　其次，页面表单输入域的布局，标签款式及导向性。

　　当运用默许值，表单会看起来很糗。可是进行恰当的预备，网站会看起来会十分有作用。从好的规划开端，一起看看下面的例子吧。

　　Awesome 上的商业型表单很清晰。整个页面的意图和任务被充分考虑到。从标题和介绍，到每个域的布局，标签和控制风格，能够说是模板。

　　3. 按钮行为(Button behavior)

　　按钮可用户实现各种意图，贯穿整个网站。可是他们的各种状况，仍是简单被疏忽。

　　Default(默许)

　　按钮的默许状况，等候被点击。多数规划师记得住这个，忘记了其他。

　　Hover(悬停)

　　悬停状况，当用户鼠标通过按钮时的状况。该状况提示用户按钮是可触发的，这一点很有协助。

　　Click(点击)

　　当用户点击按钮，状况来进行提示。这样的视觉提示能够协助下降用户的困惑。

　　Disabled(失效)

　　按钮的失效状况，或许是最少被运用的。可是关于开发者却是很有协助，除非你现已为按钮预备好了验证进程。

　　它十分像链接的各种状况，一定要考虑整站的按钮状况的运用。从弹出框(pop-up)、登陆框(log-in)，到搜索域、报名表单等，一切的按钮需求有一致性的风格。

　　4. 表单验证(Form validation)

　　网站与用户的要求或错误的沟通形式，也是十分重要。下面的三个核心问题需求考虑。

　　Required fields(请求域)

　　一切的请求域应该被提示，一般会有星号标记。

　　Real-time validation(实时验证)

　　用户完结表单就会有验证，这种类型的验证要将各种数据处理信息赶快告诉用户。你能够借助jQuery验证插件:

　　Post-back validation(回发验证)

　　该类型验证发作在用户现已提交表单，与实时验证的风格可重复，可是别的一个选项是将一切问题归于一条信息，就像Moo：

　　5. 状况音讯(错误、警告、承认等)

　　用户在网站上执行一些动作，一般需求一些类型的反馈。这很像提交表单后的场景。可是许多其他的事情也会发作。规划好你站点的音讯机制，是杰出的交互性的需求。

　　在Life Today上，我看到一些验证音讯，可作为错误音讯，风格契合全球各地。对色彩和图标进行少数更改，也能够用作警告，真是承认音讯。

6. 拓宽布景到更大的屏幕

　　根据网站风格的不同，布景元素可有更好的运用。绝大部分布景很简单，不需求更多的预备，可是也存在凌乱的需求(梯度、图案和意象)。

　　考虑到大的显示器现已十分普及，大部分规划师仅规划960像素宽度，疏忽了许多的显示器。假如你的布景凌乱，你理应拓宽至更大的屏幕。

　　7. HTML根本元素

　　HTML根本元素是根底，而且不能被疏忽。可是在许多商场为导向的网站上，凌乱的布局，悬殊的视觉风格，根本元素都被遗忘。

　　标准网页模板规划好，很重要，根本元素包含：段落，标题1至6，规整的列表，列表数据，表单域，粗体文本，斜体文本。

　　我在许多网站作业过，总结款式如下，以助开发者。

　　8. 网站邮件(Website emails)

　　我从未见任何规划师规划网站邮件，它很简单被疏忽是因为它不是网站核心焦点。可是邮件是提升和拓宽服务的强大东西。

　　我的主张是在规划阶段，仔细查看站点内容。

　　邮件列表注册承认。

　　登记承认。

　　表单完结承认(比方一联系表单)

　　购买后的订单验证

　　假如你真想做好网站邮件，那么还要预备好邮件营销模板。

　　9. 页面拉伸

　　页面拉伸以适应内容的改动，很少用，可是也很重要。例子如下：

　　网站Full Moon BBQ有个紧凑的主页，每个元素都有特定的尺度和方位。那么假如决定加长欢迎信息或者添加图片，将会发作什么?走运的是，他们考虑了这一点。看明白了嘛?能够登录网站一试。

　　预备很多内容的布局的版别，你疏忽了吗?

　　10. 动画：弹出框、东西提示、转化等

　　标准的HTML/CSS网站，动画和转化很简单被疏忽。一旦疏忽，作用会很不适宜。

　　列举如下，请谨记。

　　Tooltips(东西提示)

　　当鼠标通过某元素时的提示。

　　Image rotators(图片旋转)

　　首页幻灯片至今仍很盛行，关于转化与风格可有更多的选项。

　　Lightbox(灯箱)

　　规划的风格，不只灯箱，还有转化。

　　每个动画元素都有明显的视觉风格，比方合适它本身。

　　为什么很在乎?

　　这儿列出的大部分的元素，关于开发者比规划师更有用。假如你提前预备好这些元素，开发者会对规划师的作业另眼相看。假如你是开发者，相同做到这一点，那么老板对你也会是刮目相看。

　　记住并做到这些，意味着你至少享用到了web规划作业一半的乐