网页设计原则理念以及实战经验技巧

  什么是好的网页设计,网页设计原则理念

  (1)内容和功能决定表现形式和界面设计

  常常有人凭借电话的几句交流或者QQ上的几句聊天,甚至是一张句话的小纸条,就开始做一个网站设计。我决的这都是敷衍了事的通用设计,很不专业不成熟的设计。做一个良好的网页设计,你需要了解客户的东西很多,比如:

  1、建站目的(是主推产品还是平品牌,是主要注重SEO还是用户交互等)

  2、网站类型

  3、栏目规划及每个栏目的表现形式及功能要求

  4、主色调、客户性别喜好、联系方式、旧版网址、偏好网址

  5、根据行业和客户要求,那些要着重表现

  6、是否分期建设、考虑后期的兼容性、是否要开发其他语言版本

  7、客户是否有强烈的建站欲望

  8、你是否能在精神意识上控制住客户

  9、面对你未接触的技术知识,你有底吗?

  等等…

  当你把这些内容都了解清除了时候,你的大脑中就已经给这个网站有个全面而形象的定位了,这时才是有的放矢去做界面设计的时候了。

  (2)界面弱化

  一个好的界面设计它的界面是弱化的,它突出的是功能,着重体现的是网站业提供给使用者是主要什么。这就涉及到浏览顺序、功能分区等等。

  要让访客在0.5秒内就能把握网站的行业性质,1秒内就知道该从哪个地方开始使用这个网站,能点一次的,绝不点第二次。当然上面说的是大多数功能性网站,对于宣传展示性网站,诸如加特效的或Flash网站,可能就不得不花哨一些,但不能太过分。网站不是动画片,在效率越来越高,社会心理越来越浮躁的中国,人们的耐心越来越小,心理承受能力越来越低。效果可以体现意境,点到为止。

  (3)模块化和可修改性强

  模块化不仅可以提高重用性,也能统一网站风格,还可以降低程序开发的强度。这里就设计一些尺寸、模数、宽容度、命名规范等等知识了,不再冗述。

  无论是架构还是模块或图片,都要考虑可修改性强。举个简单的例子,logo、按钮等,很多人喜欢制作图片,N个按钮就是N张图片。如果只做3-5类按钮的背景图片,然后用在网页代码里打上文字,那么修改起来就简单了,让程序员自己改字就可以了。然而网页显示的字体是带有锯齿的,一般即能清晰又保证美观的字体字号有几类:

  宋体12px 宋体12px粗体宋体14px 宋体14px粗体黑体20px verdana 9px Arial Black 12px+

  (4)创意是可耻的,分析能力远比创意来的重要

  设计界动辄就大谈什么“创意”,我要说的是,还没有搞清目的意义和内容,还没在技术制作上臻于完善的基础上,用创艺和特效来迷惑客户和访客是可耻的。一个网也设计者的分析能力远比创艺来的重要。

  网页设计的实战经验技巧

  (一)网页配色基本概念

  (1)白纸黑字是永远的主题,谁都说不出不好来。

  (2)网页最常用流行色

  兰色——蓝天白云,沉静整洁的颜色。

  绿色——绿白相间,雅致而有生气。

  橙色——活泼热烈,标准商业色调。

  暗红——宁重、严肃、高贵,需要配黑和灰来压制刺激的红色。

  (3)颜色的忌讳

  忌脏——背景与文字内容对比不强烈,灰暗的背景令人沮丧!

  忌纯——艳丽的纯色对人的刺激太强烈抗议,缺乏内涵。

  忌跳——再好看的颜色,也不能脱离整体。脱离群众是自取其辱!

  忌花——要有一种主色贯穿其中,主色并不时面积最大的颜色,而是最重要,最能揭示和反映主题的颜色,就象领导者一样,虽然在人数上居少数,但起决定作用。

  忌粉——颜色浅固然显的干净,但如果对比过弱,整得苍白无力了,就象病夫一样无可救药。

  蓝色忌纯,绿色忌黄,红色忌艳。

  (4)几种固定搭配

  蓝白橙——蓝为主调。白底,蓝标题栏,橙色按钮或ICON做点缀。

  绿白兰——绿为主调。白底,绿标题栏,兰色或橙色按钮或ICON做点缀。

  橙白红——橙为主调。白底,橙标题栏,暗红或桔红色按钮或ICON做点缀。

  暗红黑——暗红主调。黑或灰底,暗红标题栏,文字内容背景为浅灰色。

  (二)网页设计理念

  (1)内容决定形式

  先把内容充实上,再分区块,再定色调,再处理细节。

  (2)先整体,后局部,最后回归到整体。

  全局考虑,把能填上的都填上,占位置。然后定基调,分模块设计。最后调整不满意的几个局部细节。

  (3)功能决定设计方向

  看网站的用途,决定设计思路。商业性的就要突出赢利目的;政府型的就要突出形象和权威性的文章;教育性的,就要突出师资和课程。

  来源:读者投稿,原文链接。

时间: 2024-10-18 17:43:06

网页设计原则理念以及实战经验技巧的相关文章

网页设计中的图标的使用技巧与资源合集

  提到图标设计,似乎每个设计师都有话说,但是要做好图标设计真的那么容易么?今天这篇文章针对网页设计领域的图标设计进行了相对全面的梳理,从设计技巧到设计资源一应俱全,但愿能帮上你! 图标是每一个现代UI中不可或缺的组成部分,它们不仅能协助UI布局组织内容,而且轻量级的图标融入界面也不会喧宾夺主.不仅手机和平板的APP UI中会大量用到各种图标,而且iPod和智能手表的界面中也是如此,这正是因为图标具备快速直观传达信息的能力. 在网页设计刚刚兴起的时代,小图标就已经被早期的网页设计师和开发者投入使

网页设计中文字颜色的搭配技巧

技巧|设计|网页|网页设计|中文 对于做网页的初学者可能更习惯于使用一些漂亮的图片作为自己网页的背景,但浏览一下大型的商业网站,你会发现他们更多运用的是白色.蓝色.黄色等,使得网页显得典雅,大方和温馨.更重要的是,这样可以大大加快浏览者打开网页的速度. 一般来说,网页的背景色应该柔和一些.素一些.淡一些,再配上深色的文字,使人看起来自然.舒畅.而为了追求醒目的视觉效果,可以为标题使用较深的颜色.下面是我做网页和浏览别人的网页时,对网页背景色和文字色彩搭配积累的经验,这些颜色可以做正文的底色,也可

CSS标准网页设计UL和DIV使用的技巧总结

css|标准|技巧|设计|网页|网页设计 了解结构化CSS设计内容,首先看下面两个例子: <div id="nav"> <ul>  <li></li>  <li></li>  ...... </ul></div> 很多人,包括许多业界大牛,都建议你这样写即可: <ul id="nav"> <li></li> <li><

网页设计中制作Flash站点的技巧

技巧|设计|网页|网页设计|站点 根据Macromedia 顶级Flash设计者,开发者以及可用性专家的建议,我们收集了创建一个具备可用性的Macromedia Flash站点的十大技巧. 这些技巧只是一个开始,我们将继续提供更多的研究,学习与技巧. 1.记住用户的目标 用户往往带着目的访问一个站点,每个链接,每次点击都要合乎他们的经验并且引导他们通向他们的目标.当传输你的页面时,应该让关键的导航链接首先装载--万一用户想转到网站其它的区域.模仿通常的用户图形界面往往可以增加可用性. 2. 记住

网页设计中透明效果的使用技巧

运用好透明效果是提高网页设计水准的重要方法之一.如同使用其他方法一样,设计师们有很多种手段将透明效果运用到网页中,今天这篇文章就来好好和您分享一下关于"透明"的实用小技巧哟:) 在网页设计中使用透明效果是件既美观又冒险的事儿.透明效果的使用是把色块,文本或图像"变薄"或者降低饱和度,使颜色变浅透明,这样下个图层的内容就能穿透显示出来.这种方法如果用好了,效果将会特别棒--能突出显示文本或者在图像的特定区域形成焦点.但设计者在运用透明效果时要特别小心,因为这么做可能会

网站设计分析:网页设计中透明效果的使用技巧

运用好透明效果是提高网页设计水准的重要方法之一.如同使用其他方法一样,设计师们有很多种手段将透明效果运用到网页中,今天这篇文章就来好好和您分享一下关于"透明"的实用小技巧哟:) 在网页设计中使用透明效果是件既美观又冒险的事儿.透明效果的使用是把色块,文本或图像"变薄"或者降低饱和度,使颜色变浅透明,这样下个图层的内容就能穿透显示出来.这种方法如果用好了,效果将会特别棒--能突出显示文本或者在图像的特定区域形成焦点.但设计者在运用透明效果时要特别小心,因为这么做可能会

交互网页设计原则:整洁清晰明确

  在网页交互设计中,我们提出:信息获取和传达的过程必须是简洁清晰,自然易懂.这样用户才能够有效的获取这些信息,并迅速作出决定. 1.什么是"简洁自然,清晰易懂"? 简洁清晰:使信息最简化 "少即是多".提倡使用最少的元素来表达最多的信息.如果信息繁杂,将使用户承担大量的信息负担,造成信息过载,影响效率,不能帮助用户解决问题. 自然易懂:使用用户语言 用户获取信息的方式多样,并且对信息的理解程度也各有不同,所以使用用户平时使用和理解的表达方式去传递信息,更可以被用户

高手传经 网页设计中的几个小技巧

技巧|设计|网页|网页设计 如上图是Relen的个人主页Relen.com,2004版的首页发布信息,尤其是过年前后,利用雪花来点缀页面是非常合适的.注意这里面的雪花的摆设位置是有些技巧的,你可以考虑用黄金分割来支配你的设计思路,以达到合理.舒适的效果. 先排列文字,运用两到三种不同的字体,绝大多数文字对齐左侧,而其中一行突出,形成错落有致的感觉.文字的大小需要调整,主要信息文字大写,字体突出.而其他根据信息主次和平面设计的要求等多种因素进行排列.个别地方使用斜体加强,或用加粗的形式明示. 字体

手机网页设计原则:移动网页中的基础元素

文章描述:移动网页设计应该包含的5个基本元素. 大部分人都认为手机网页设计与电脑网页设计有很大不同,其实不是,手机网页除了小且可以触摸外,很多设计原则与电脑网页设计是共通的.这里有 5 个基本的元素,希望对设计师有所帮助. 1. 有意义的导航 在移动设备上获取信息实际上是有趣的体验,因此,令用户在使用过程中感到愉快很有必要,简单地删除屏幕上的链接(或taps)并不能达到用户友好体验的目的.导航应该包含用户需要的内容,并提供明确的路径.如果用户知道跳转的具体页面,就会进行点击. 首先,确保导航在用