设计网页的注意事项

设计网页时，点击按钮以及信息需要放在显眼的位置，这就是为什么导航和菜 单栏往往处于页面的顶部。下面介绍设计网页的注意事项，希望可以帮助到大家。

1.缺乏文字和图片都需要具备较高的可读性

网页上的文字和图片都需要具备较高的可读性，最简单的方法就是让它们具有高对比度。但是许多设计师却经常忽视这条规则。图片背景与文字对比 度太差，导致文字模糊不清无法阅读，用户不仅错过这段话也错过了你要传达的重要内容。你必须保证每一个元素都与它周围的其他元素区别开来，记住这些基本方 法，色彩、空间、尺寸。合理地运用它们让你的每个元素都清晰可见。

2.糟糕的导航和操作流程

当我登陆了网页的第一眼，你就得让我明白接下来我该做哪个操作。点击按钮以及信息需要放在显眼的位置——这就是为什么导航和菜 单栏往往处于页面的顶部。导航的标签内容和运行效果必须清晰直观，当你尝试使用水平方向的滚动条或者其他一些不太寻常的动效设计的时候，给用户一些暗示让 他们知道你的网页如何工作吧。过于复杂的设计会让用户感到无所适从并放弃你的网站

3.糟糕的图片搭配处理

没有什么比一个优秀的图片被其他设计掩盖更糟糕了。如果你花了时间为你的网站搭配了一张优秀的图片，为什么要让它被其他的设计元素所覆盖呢?加上简单的一行字就可以了，这也是为什么透明按钮成为了新的流行趋势。成都网页设计师再追逐潮流的时候，经常会落入这样的误区。顶栏很有趣，滚 动也很棒，可是当你为它们搭配上文字，一切就容易变得不那么和谐了。页面上的每个图片都需要与文本搭配，让每个文字都可读，图片上的每个设计元素都清晰可 见。不要用文本或者按钮覆盖图片上任何重要的部分。当你觉得你的页面设计出现了这样的情况，最好更换一个更加简洁的背景并在其他地方放上你的这张图片吧。 当第一眼看到上面这张图的时候你会被吸引是因为它的素描风格。但仔细看看，人物面部被文字遮盖了，那段褒奖之辞也让整体显得杂乱无章。

4.不使用网格在网页设计

在网页设计中，有些“杂乱”也能让人赏心悦目，不对称是其中的一种，不使用网格绝对不是，是否使用网格是区分设计好坏的专业指标之一。网格 让一切变得清晰有组织性，让你的元素之间保持一致的适当的间距，你知道应当把你的元素放在哪儿、怎么放。帮助你确定元素的尺寸、文本的尺寸和空间，通过比 例展现内容的侧重点。

5.不采用响应式设计

使用响应式设计框架，使用响应式设计框架，使用响应式设计框架，重要的事情说三遍，你的网页或许需要在手机上运行，它必须要和在电 脑上运行一样流畅。我总能遇到一些网站，在手机上加载出的是一整个页面。这些网站并不是响应式设计，至少没有手机版的视图，以至于用户无法使用。

6.链接丢失崩溃的链接

链接是网页上最让人恼火的事之一。养成每年都去审核你的网页上链接是否畅通的习惯吧，你可以手动检查或是使用某些工具，如果你的logo并不能链接到你的网站首页，我也会感到奇怪。Logo都是要链接到网站首页的。(以及当处于首页 的时候，不要禁用返回按钮。)考虑链接的可用性。保证你的链接，特别是那些文本中的链接足够明显并且易于点击而不造成误操作。不要在你的文本中添加很多文 字链接，特别是在小的移动设备屏幕上，用户很难点击到正确的链接。

制定合理的title标签

对于搜索引擎而言，在分析网页结构时对于title标签的重要性是不容忽视的，搜索引擎通过title标签来提取以及分析页面的主题，即关键词定位。我们在设置title标签的时候一定要结合关键词，并且一定要做到通顺，相关、吸引。在制定title标签时需要注重许多细节，过长的title标签不仅无法在搜索结果页面完全展现，用户体验度不好。同时也容易分散权重，优化难度加大，尤其主页更加需要简短扼要。title标签中关键词一定要合理，不能够出现堆砌以及也页面不相关。在我们优化过程中，其实最容易出现的是网页title标签无意间重复出现。为什么这么说呢?很多站长朋友们忽略了列表页的title标签，出现几十页、甚至上百页的重复title标签，列表页的title标签应该合理设置。

内容采集模式

对于新网站而言，当前最为缺少的是丰富多彩的内容，然而，很多站长朋友们忽略了内容不仅仅再多，更加需要质的体现。注重站长站长朋友以“无时间”、“需要快”等理由进行内容采集，在当下搜索引擎加强内容审核的状况下，可想而知，网站后期的表现不佳，甚至可能出现负面效果，导致网站降权被关进“小黑屋”。故对于新网站而言，应具备足够高质量的内容时方可开放，即让搜索引擎蜘蛛能够爬行和抓取。鉴于此，我们前期可利用主机服务商所提供的三级域名或者二级域名进行测试并且更新内容，保证主要页面不再空洞，即可绑定解析准备好的二级域名。新网站上线，就具备丰富高质量的内容，故能够获得搜索引擎更多的信任。

服务器的监控

服务器对于网站而言非常重要，服务器的购买需要根据网站的CMS以及规模而定，良好的服务器是作为营销力网站的必备条件之一。当然，我们无法保证服务器不会出现任何问题，但是我们必须对服务器进行合理的监控，即出现服务器故障时，我们能够第一时间进行妥善的处理，将损失降到最低。服务器出现故障时，直接会影响到蜘蛛的爬行效率，若返回http状态码404过多时，直接性影响到搜索引擎排名效果。故一定要利用互联网监控工具对服务器性能随时掌握。当然，若服务器性能有限，影响到网页加载速度时，可以利用压缩技术或者CDN加速等进行改善。

网站基本功能的完善

对于新站而言想要更好的获得搜索引擎的信赖，必须前期做好网站优化的基础功能。网站基本功能的完善主要包含了301设置、404页面制作、robots.txt文件、xml地图、nofollow以及canonical等标签的合理制定。网站在301设置过程中一定要注意是IIS服务器还是Apache，不同的服务器类型设置方法有所不同，同时设置后应该进行抽样测试，检查301设置是否正确。而robots.txt文件设置更是非常重要，一定要充分了解网站结构，防止屏蔽网站主要结构与链接，需要阶段性通过网站日志进行观察。至于网站xml地图，对于搜索引擎而言是快速了解网站更新情况的重要方法，新站而言更应该及早提交给搜索引擎。

图形元素的存在大大美化了网页设计，它拥有强烈的艺术美感和视觉冲击力，是文字之后最早被引入到网页设计中的元素，它所传递信息的直观性远胜于文字。图形设计中的色彩搭配、元素构成、版式布局都要符合浏览者的审美心理，才能使得网页在短时间内给受众留下深刻的印象。

一、图形元素

网页设计中的图片提供导向和链接的功能。根据人机心理学研究，人们的视线在浏览网页时，会首先垂直的落在屏幕中心，然后向四周游动。决定了设计师要将重要的信息安排在注视点高的区域，所以设计师要根据视觉流程来合理安排图片的适度位置。网页设计中的图片是要经过网络下载才可以最后看到，受到宽带的限制，所以要求图形文件量尽可能的小。在图片大小固定的情况下，文件量越低说明图片分辨率要越低。对于显示器上的图片而言，分辨率为72dpi是大多数图片的最佳选择。

二、色彩元素

色彩的配色设计直接影响网站的整体定位、风格。作为设计中不可缺少的元素，它建立在文字图形的基础上，依靠眼睛的功能，通过感觉的视觉冲击力对心理起作用。每一种颜色都有不同的心理暗示。冷色中的蓝色代表平静，暖色中的红色代表激动;黑色给人沉重感，浅色则让物体轻盈;色彩从色调、饱和度、明度三个方面影响着网页，我们可以找到很多运用广泛的色彩配色方案，来作为实际学习和工作中的向导。

网页设计中的色彩元素需要符合国际色彩的标准，因为互联网络是建立在国际互联网统一的平台上的。最简单的说就是采用网页安全色，不能毫无节制的运用太多颜色，一般情况下先根据总体风格的要求定出主色调和辅助色进行色彩的搭配。网页色彩模式一般采取RGB模式。网页设计是通过显示器来进行展示的，目前显示器大都采用RGB颜色标准，这与RGB颜色模式的原理分不开。RGB是从颜色发光的原理来设计定的，通俗点说它的颜色混合方式就好像有红、绿、蓝三盏灯，当它们的光相互叠合的时候，色彩相混，而亮度却等于两者亮度之总和，越混合亮度越高，即加法混合。在显示器上，通过电子枪打在屏幕的红、绿、蓝三色发光极上来产生色彩的。

三、版式设计

用户界面展现在浏览者面前的数字化物化界面，组成元素是与传统物化界面相同的图文信息、版面设计、色彩布局。界面设计普遍遵循了平面设计的视觉传达方式。版式设计就是在有限的空间中遵循视觉设计原则，把各种多媒体元素进行合理的组合。不同的主题网站有着不同的设计思路，引起思想、情感、形式等各方面的不同。有些网页直接对视觉元素进行堆砌，欠缺规划，缺乏审美意识。各种文字、动画、色块等杂乱无章，令消费者厌烦。网站设计首先要对企业、产品、受众信息等进行全面的调研和综合分析，指定网站合适的整体风格，以合适的版式设计表达形式营造出相适应的氛围。

网站与人的互动设计就好比是一场互联网设计革命，它是人类在视觉、听觉和触觉等方面的要求和提高，是人类对于世界的审美的提高。一个成功的网站设计，除了对于网站内容是硬件要求之外，对于网页和浏览者的互动设计则是重要的软件要求。浏览者和网站的互动性与参与性，决定了该网站对于大众的吸引力和点击率。任何一家网站都有一定的互动性,而好的动画语言添加在这种互动性的体验中就为网站增添了更多的趣味性。

一、动画元素在网页设计中的具体体现

(一)主页互动主页中的动画展示是最关键的一部分，也是大多企业投入设计费用最多的一部分。形象展示动画如同网站的形象广告,起着不可忽视的作用。它的强烈的动态效果,给浏览者的内心留下一个最初且深刻的印象，将浏览者轻易的引导入该企业文化中。一般情况下，企业会将自己的企业理念或者是企业的产品做成宣传片置于首页的动画中，抑或是做一个关于企业产品的小游戏，来与浏览者进行互动。这样，在用户打开网站时，便会被一种包裹式的试听效果和形象展示所吸引。

(二)鼠标显示目前鼠标的动态效果千奇百怪,如浏览者将鼠标移上导航栏时和点击后出现的动画效果,可以给浏览者带来一种新奇感。目前有很多网站开始以动画的特效鼠标来吸引浏览者的眼球,或展现其网站的特色。例如卖蔬菜的网站往往会将鼠标做成胡萝卜的效果。当然,除了鼠标动画设计中需要的语言编程。设计师在做鼠标动画效果时,还要注意另外两个方面：一种是关于色彩的动画，通过色彩的明暗度或者饱和度等等方面的变化，进行动画效果。另一种就是在鼠标滑过或者点击的过程中，鼠标周围出现例如小范围的闪亮或者光晕的动画效果，这类效果无形中为网站添加了许多梦幻效果。这些设计主要还是要和网站整体设计风格进行搭配设计。

(三)进度条设计目前网站中的进度条设计是应用动画元素最多和最普遍的地方了。由于网速的限制，导致在浏览者打开网站或者下载时中间会出现卡壳或空挡，这时候大多会跳出一个进度条来显示其运行速度。各大网站对于进度条的设计真可谓是百花齐放各显神通。进度条设计虽然是一个很不起眼的小FLASH动画，但不小觑这些细节设计，进度条的设计精致与否，也关系到整个网站的设计成败，乃至企业文化的精髓。

二、动漫元素在新媒介上的未来发展

交互式导航不仅仅是在主页加一个FLASH动画那么简单，最主要的是它能够带给人互动时的新鲜感和愉快感,更优越于只注重于使用性的交互式导航功能,如使用者的参与是交互式导航的必需条件,在这种情况下,必须要有诱导使用者互动的设计。对于现在网络媒体飞速发展的今天来说,不仅是网站设计需要动画元素，连手机等便携设备的出现，也是用户交互界面的全新市场。如何设计出新颖的界面,让浏览者在不同的媒体界面上获取信息的同时得到愉悦的审美体验是很重要的。说到用户交互界面设计中的动画元素，也就是用动态的视觉因素来传播信息,与观看者沟通交流。

除了网页设计,现在还包括媒体游戏，聊天软件，购物软件等等。它们的互动设计中除了图片、文字、色彩以外的静态传达,还包括点击链接时画面变化的动态交互效果的动态视觉传达。除了游戏界面基本是由动画语言组成之外，其他交互设计最重要的是交互性的体现,在互动中融入动画元素，无论是从视觉审美上来说,网页交互性设计是要让人们点击链接以后在能获取信息的同时,达到视觉上的享受,;还是在这些包括不同色彩之间的动态变化上来说,图片之间切换的效果,声音的转换,文字出现的效果等等都是给上网浏览的人一种愉悦的心情。网络信息传播是具有视觉、听觉、触觉互动的视觉传达全球化的交互信息。网站设计师将动画元素融入网络设计中，这是在未来的新媒体交互设计大战中胜利的关键，这代表着一种新文化的诞生。

三、结语

把网络上的信息重新设计出幽默诙谐的界面,争夺了更多的眼球注意力，给浏览者以强烈的视觉冲击力和吸引力。互联网新媒体将是设计界的新的舞台,其信息资源无限、图文互动、高速高效的特点对传统设计媒体有着巨大的冲击,动画元素也对设计行业带来相辅相成的里程碑式的影响。