1 网页设计的原则

在web上，点击链接、提交表单或者按下按钮时，你并不知道会发生什么。要由设计者为每一个动作设定相应的期望，并且清晰的显示这些动作的结果。下面介绍网页设计的原则，希望对您有帮助。

原则一：标示导引设计

用户在网站上浏览的时候，不同于物理世界，可以依靠方位感来定位，设计师需要为用户提供标示导引。

1 告诉访问者他们身在何处，就像公园里的地图标记“你在这里”一样

Logo图标，提醒用户正在访问哪个网站;

面包屑轨迹或者一个视觉标志，告诉访问者处在系统的什么位置，例如;中国>陕西>西安

简明的页面标题，指出访问者正在浏览什么页面。

2 告诉访问者他们寻找的东西在哪里

设计导航系统可以先问问自己：“用户访问网站的目的是什么”，另外进一步考虑下面这个问题“我希望访问者能够轻松看到什么”。一旦明确了这些问题，就应当保证访问者浏览网站的时候这些内容能够呈现在他们面前。

3 访问者如何得到寻求的东西

“如何到那里”是通过巧妙的导航设计来实现的。在好的导航设计中，链接看上去是可以点击的。他们有着清晰的文字标签，可以清楚的指出其含义。而且类似的链接会分组放在一起，这样可以通过上下文得出其含义。

4 他们已经搜寻过哪些地方

“要清楚的区分链接‘过去’ 和‘现在’的状态”

原则二：设定期望并提供反馈

在web上，点击链接、提交表单或者按下按钮时，你并不知道会发生什么。要由设计者为每一个动作设定相应的期望，并且清晰的显示这些动作的结果。有很多方法可以保证访问者随时掌握最新情况。

1 动作真正发生之前要让用户知道动作尚未发生

2 提醒用户正处于过程中的哪个阶段

原则三：基于人机工程学设计

数字空间中完成设计时，要考虑到用户的身体，最与之相关的就是手、眼睛和耳朵。

1.手

针对手进行设计时，应该考虑滚动距离和滚动频率，类似的在移动设备上也有费茨定律

τ=D/S D是距离，S是点击面积

2. 眼睛

贴心的设计，比如为用户提供护眼模式

字体的选用上也要考虑到易读、清晰。

3. 耳朵

默认情况下，不要主动播放音乐，为用户提供一个播放的开关。

原则四：保持一致，考虑标准

设计时，一定要明确你的网站有哪些约定，打破这些常规一定要慎之又慎。另外还需要不断用样式指南来约束自己的决定，来确保设计风格保持一致。

原则五：提供纠错支持——预防、保护和通知

人生并不完美，人们总会犯错误，因此有些人认为自己很愚蠢。为了避免给用户造成这种悲伤情感，需要考虑保护性设计。只需做到以下几点就可以吧错误减到最少。

1 预防

在用法说明和对话使用清晰简洁和惯用的语言，减少用户理解出现问题。

2 保护

保存用户输入的信息

3 通知

如果出现一个错误，要以一种客观的语气明确地告诉用户发生了什么情况

原则六：要靠辨识，而不要仅凭记忆

用户原本就很匮乏的记忆力往往记忆力负担过重，如果把这个重担转嫁给计算机，客户就会认为你网站更甚一筹。

原则七：考虑到不同水平的用户

网站用户作为新手的时间往往很短，只需要网站大概三次，用户就能达到“中等”水平。在这个水平上他们可能会保持相当长的时间，也许永远不会成为专家水平(因为完全没有必要)。中等水平的用户意味着他们可以几乎完成需要的所有工作，不过我们的做法通常是为新手设计简单的网站，再为专家构建快捷途径和特殊属性。

原则八：提供上下文帮助和文档

人们在完成某个可能很复杂的任务时都不可避免的需要提供帮助，作为设计者，我们需要在合适的时间以最简练的方式提供适当的帮助。应当把信息放在有明显标注的位置，而不要统统归入过于泛化的HELP之下。

用户在首次登录的时候，往往需要一些指导，这样可以帮助用户快速上手。

---

 2 有效网页设计的主要原则

1.目的

伟大的网页设计总是考虑到用户的要求。您的网络客户是否在搜索娱乐，信息或某些互动?您的网站页面需要有一个明确的目的，并以最有吸引力的方式满足您的网站访问者的特定要求。

2.沟通

网络上的个人需要快速的信息，所以有必要清楚沟通，使您的信息简单阅读和消化。将一些有效的策略纳入您的网页设计中，包括：使用标题和小标题整理信息，使用子弹点而不是漫长的句子，切割华夫饼。

3.字体

一般来说，Sans Serif文字字体(如Arial和Verdana)在线阅读更为简单。在线阅读的基本字体大小为16px，最大为3个字体，最多为3个点，以保持您的设计合理化。

4.颜色

一个好的网页设计和一个很好的调色板可以提升用户体验。互补色彩创造和谐与平衡。使用对比色的内容和背景将使阅读更加简单。充满活力的色彩创造情感，应谨慎使用。为了包装起来，白色空间/负面空间是有效的给您的网站一个现代和整洁的外观。

5.图像

一张照片画了一千个字，为您的网站挑选正确的图片可以帮助您与目标受众进行品牌连接和定位。如果您手头上没有专业照片，请考虑购买图片以提升网站的外观。同样，考虑使用信息图表，图形和视频，因为这些在传达时可能比书写文字大。

6.您的网站导航

引导人们关注个人采取行动和移动您的网站的简单性。一些有效导航的策略包括智能页面层次结构，使用面包屑，设计可点击按钮，并遵循“三点一击”，这意味着用户将有能力在树状点击中发现他们正在搜索的信息。

7.网格布局

将内容随机放置在您的网页上可能会导致无关紧要的外观。基于网格的布局将内容整理到按照排列和调整的区域，部分和框中，从而提示网站设计更加美观。

8.“F”图案设计

眼睛跟踪研究的特点在于个人以“F”模式扫描计算机屏幕。人们看到的大部分是屏幕的顶部和左侧，通常屏幕的右侧很少见到。而不是试图驱动观众的视觉流动，有效设计的网站将与阅读者的自然行为一起工作，并显示信息的重要性。

9.加载时间

每个人都讨厌需要加载时间的网站。使页面加载时间更加活跃的提示包括简化图片尺寸(大小和尺寸)，将代码整合到基本的CSS或JavaScript文档中，并将HTML，CSS和JavaScript缩小。

10.手机友好

目前来看，通常有许多具有不同屏幕尺寸的设备可以访问网站，因此您必须考虑您的网站是否适合移动设备。但是，如果您的网站不适合移动设备，您可以在响应式布局中进行重建，也可以构建一个承诺的便携式网站。

创建一个令人愉快的功能的网站很容易，基本上记住了这些设计元素。这些有效的网页设计原则可以为您的网站提供一些帮助，为访客提供更多迷人，有用的和至关重要的。

---

 3 404页面设计的技巧

网站建设对于站长，尤其是新站长来说，有很多细节的问题需要注意，这些细节可以帮助用户提升使用体验，当然，如果没有做好的话，也会让用户体验大打折扣，其中404页面的设计就是一个被很多站长忽略了的问题。那网站建设时404页面设计的技巧有什么呢?

HTTP 404错误是由于链接指向的网页不存在，也就是说原始网页的URL失效引起的，这种情况极难避免，是每个网站都会遇到的问题。因为在网站发展的过程中，本身架构会不断革新，页面的内容和设计也会不断进行更改并重新定向。这样的工作是网站优化中不可避免的，但也导致了一些内容不再能呈现在用户面前，当用户试图浏览这些内容时，看到的就只能是404页面。

所以404页面本身就不是一个讨喜的内容，用户看不到想要的内容也是一个会让体验下降的事情，但如果能细心地设计404页面，可以让这个问题给网站带来的影响尽可能的降低，甚至给网站带来新的流量。

一、在页面中向用户推荐其他优质内容

我们不能改变用户看到404页面，以及没有顺利的找到他们想要的信息的结果，但这并不意味着用户本次在网站中的浏览就要以404页面作为终点。如果你对自身网站的其他内容比较自信，可以在404页面中添加跳向其他有效页面的链接。

一般来讲，在面对一个空空如也的404页面时，用户能够做的唯一一件事就是关闭网页。但事实上，由于网站的建设一般都基于某一中心进行，这也代表了网站内大部分内容都有着互相的关联性。所以如果你在404页面中向用户推荐了其他内容，有很大概率会引起用户的注意并点击，从而将跳出率转化为流量。

二、在404页面中添加联系方式

虽然用户没有能够从404页面中获取他们想要得到的信息，但很多网站还是选择在404页面加入了设计师或者负责运营、团队的联系方式。这些联系方式可以帮助用户直接联系到网站的运营者，即使他们没有从网页里得到信息，也可以直接联系运营者来获取更多的信息。

同时，这些联系方式也是让用户帮助运营者排除BUG的一个途径，这些内容可以帮助用户上传错误信息，只需要几个选项和一个提交按钮，在大部分情况下还是有很多的用户愿意多花几秒钟去进行这项工作，但前提是你的网页设计能够让用户产生足够的好感。

三、在404页面中添加搜索框

与新网站不同的是，很多时间比较长的网页的老页面并没有消失，而是因为在重新设计后被定位到了另一个位置。在这种情况下，在404页面中添加一个搜索框不失为一个很好的选择，用户可以通过搜索框继续在站内直接搜索自己想要了解的信息或是其他咨询。即使原始链接已经不复存在，但还是可以通过搜索框来直接对内容、主题甚至是重新定位过的内容进行搜索。这个办法可以有效的减缓404页面给用户带来的困难，甚至可以进一步提升网站的流量。在这一点上，Twitter就是一个典型的例子。

四、不要出现不合时宜的幽默

虽然很多网站将404页面打造成一些可爱或是好玩的样子，但这并不意味着所有人都有能力去模仿。因为这种讨巧的行为存在弄巧成拙的风险，并不是所有用户的幽默感都能保持一致，并且404页面的出现在多数时候都是一件令人烦躁的事，一些网站得益于精巧的设计可能刚好迎合了一些用户的胃口，但这并不能保证所有用户都买账。想要让用户会心一笑的出发点本身是好的，但比起可能起到反作用的幽默元素，为用户提供实际可行的解决方案往往来得更实在些。

上述的几点技巧的出发点都是让本身作为浏览终结点的404页面通过一系列设计成为浏览的中转点。当用户的浏览进入404这个看似是死胡同的页面时，给用户提供更多的帮助和选择，可以有效的提升网站的流量。希望可以帮助到站长们解决一些问题。

---

 4 网站建设时文字该如何设计

一个网站中最重要的部分无疑是由文字组成的内容，所以在字体的选择方面也有很多要求。采用合理的字体可以让用户在浏览的过程中得到更好的体验，所以怎样合理的使用字体是在网站的建设中需要重点去研究的问题。下面，我们就来为大家分析一下，在不同的网站中选择什么样的字体。那网站建设时文字该如何设计?

英文类网站的字体选择

英文网站的主要受众人群是国外网民，而国外的网站或者其他英文网站的字体大小很多为10像素或者12像素，这在中国人的使用习惯中已经是非常影响阅读的、过小的字体，但是很多国外的网民已经养成了这种大小字体的习惯。所以作为折中设计，对于英文网站的字体，14像素是一个很好的选择。

同时英文的字体也有很多稀有字体，或是一些需要收费的字体。虽然很多英文网站选择的字体比较花哨，但还是尽量不要去选择过于个性和稀有的字体，因为这些字体必须要用户的浏览器中具备才能够正常显示，而如果用户没有安装这些字体，就会出现错误。

中文类网站的字体选择

如上文所述，中国网民的使用习惯是阅读较大的字体，所以中文网站中的字体也要大于英文网站。同时，中国用户并不太习惯阅读花式字体，所以默认字体往往是更好的选择。

并且，绝大多数的中国用户并不会去安装系统自带以外的字体，所以如果使用了一些特殊字体的话，也容易造成显示错误。一般来说，中国网站中绝大多数都采用了系统自带的宋体或微软雅黑。通过多年来养成的阅读习惯，中国用户也对这些字体更为熟悉。并且在统一网站中，不同字体的数量应该少于3种。

网站字体的颜色选择

在决定了字体的样式以及大小之后，就要开始考虑字体的颜色了。当然，字体的颜色脱离网站来单说也是不正确的，一般来说，字体使用何种颜色都是根据网站的整体风格来进行选择的，比如与背景取反色、在有色背景上使用白色或黑色，或者与背景和图片相互呼应等。

不过，还是有一些“百搭”的颜色可以让站长选择，比如深灰色和黑色，这些颜色几乎可以用在任何地方——除了深色的背景上。

另外，超链接的文本一般为蓝色，而警示类文本的字体大多为红色，这些符合用户使用习惯的颜色也要在设计时多留心。

作为一个网站内最重要的部分，文字能够体现出网站最高的价值，但文字的字体、大小和颜色也往往成为站长们在建站是所忽略的问题。其实，网站无论选择什么样的文字样式和风格，都是要围绕网站的内容和风格来决定的。让文字的样式与网站的风格更好的搭配起来，才能够带给用户的使用体验。