当前位置:重庆网站建设 > 网站建设资讯 > 网站设计

网站设计师怎样做好网站页面设计

来源:网站建设服务商引序科技 点击: 发布时间:2015-10-07 03:07:20
网站设计师怎样做好网站页面设计 网页设计是网站是企业向用户和网民提供信息(包括产品和服务)的一种方式,是企业开展电子商务的基础设施和信息平台,离开网站(或者只是利用第三方网站)去谈电子商务是不可能的。 企业的网址被称为“网络商标”,也是企业无形资产的组成部分,而网站是INTERNET上宣传和反映企业形象和文化的重要窗口。 1 基本简介 什么是网页设计?...

网页设计是网站是企业向用户和网民提供信息(包括产品和服务)的一种方式,是企业开展电子商务的基础设施和信息平台,离开网站(或者只是利用第三方网站)去谈电子商务是不可能的。

企业的网址被称为“网络商标”,也是企业无形资产的组成部分,而网站是INTERNET上宣传和反映企业形象和文化的重要窗口。

 

网站设计师怎样做好网站页面设计 

1 基本简介

什么是网页设计?

网站的分类、格式,如何做好网页设计?

网页设计网页设计的建站包含:企业网站、集团网站、门户网站、社区论坛、电子商务网站、网站优化技术等,如中华网库,在行业中各自有各自的作用。

网页设计是一个广义的术语,涵盖了许多不同的技能和学科中所使用的生产和维护的网站。

不同领域的网页设计,网页图形设计,界面设计,创作,其中包括标准化的代码和专有软件,用户体验设计和搜索引擎优化。

许多人常常会以工作小组负责不同方面的设计过程中,虽然有些设计师将他们所有的网页设计是设计过程的前端(客户端)的设计用于描述一个网站,包括写标记。

但是这是一个灰色地带,因为这还覆盖了网络的发展。

网页设计师预计将有意识的可用性,如果他们的作用,需要创建标记,那么它们也有望成为最新的网页易读性指引。



2 注意事项

明确建立网站的目标和用户需求

Web站点的设计是展现企业形象、介绍产品和服务、体现企业发展战略的重要途径,因此我们必须明确设计站点的目的和用户需求,从而做出切实可行的设计计划。

我们会根据消费者的需求、市场的状况、企业自身的情况等进行综合分析,以“消费者”为中心,而不是以“美术”为中心进行设计规划。

在设计规划时我们会考虑:

1.什么是网页设计?

2.网站的分类、格式,如何做好网页设计?

3.外国网页设计建设网站的目的是什么?

4.为谁提供服务和产品?
5.企业能提供什么样的产品和服务?
6.网站的目的消费者和受众的特点是什么?
7.企业产品和服务适合什么样的表现方式(风格)?
网页设计总体方案主题鲜明
在目标明确的基础上,完成网站的构思创意即总体设计方案。对网站的整体风格和特色作出定位,规划网站的组织结构。

Web站点应针对所服务对象(机构或人)的不同而具有不同的形式。

有些站点只提供简洁文本信息;有些则采用多媒体表现手法,提供华丽的图像、闪烁的灯光、复杂的页面布置,甚至可以下载声音和录像片段。

好的Web站点把图形表现手法和有效的组织与通信结合起来。

为了做到主题鲜明突出,要点明确,我们将按照客户的要求,以简单明确的语言和画面体现站点的主题;

调动一切手段充分表现网站点的个性和情趣,办出网站的特点。

Web站点主页应具备的基本成分包括: 页头:准确无误地标识你的站点和企业标志; 

Email地址:用来接收用户垂询; 联系信息:如普通邮件地址或电话; 版权信息:声明版权所有者等。

充分利用已有信息,如客户手册.公共关系文档.技术手册和数据库等。
网站的版式设计
网页设计作为一种视觉语言,特别讲究编排和布局,虽然主页的设计不等同于平面设计,但它们有许多相近之处。
版式设计通过文字图形的空间组合,表达出和谐与美。

多页面站点页面的编排设计要求把页面之间的有机联系反映出来,特别要处理好页面之间和页面内的秩序与内容的关系。

为了达到最佳的视觉表现效果,我们将反复推敲整体布局的合理性,使浏览者有一个流畅的视觉体验。

色彩在网页设计中的作用

色彩是艺术表现的要素之一

在网页设计中,我们的设计师根据和谐、均衡和重点突出的原则,将不同的色彩进行组合.搭配来构成美丽的页面。

 根据色彩对人们心理的影响,合理地加以运用。如果您的企业有CIS(企业形象识别系统),我们将按照其中的VI进行色彩运用。

网页设计形式与内容相统一
为了将丰富的意义和多样的形式组织成统一的页面结构,形式语言必须符合页面的内容,体现内容的丰富含义。
灵活运用对比与调和、对称与平衡、节奏与韵律以及留白等手段,通过空间、文字、图形之间的相互关系建立整体的均衡状态,产生和谐的美感。如对称原则在页面设计中, 它的均衡有时会使页面显得呆板,但如果加入一些富有动感的文字、图案,或采用夸张的手法来表现内容往往会达到比较好的效果。 点、线、面作为视觉语言中的基本元素,巧妙地互相穿插、互相衬托、互相补充构成最佳的页面效果,充分表达完美的设计意境。
三维空间的构成和虚拟现实
网络上的三维空间是一个假想空间,这种空间关系需借助动静变化.图像的比例关系等空间因素表现出来。 在页面中,图片、文字位置前后叠压,或页面位置变化所产生的视觉效果都各不相同。通过图片、文字前后叠压所构成的空间层次不太适合网页设计,根据现有浏览器的特点,网页设计适合比较规范、简明的页面,尽管这种叠压排列能产生强节奏的空间层次,视觉效果强烈。 网页上常见的是页面上、下、左、右、中位置所产生的空间关系,以及疏密的位置关系所产生的空间层次,这两种位置关系使产生的空间层次富有弹性,同时也让人产生轻松或紧迫的心理感受。 现在,人们已不满足于HTML语言编制的二维Web页面,三维世界的诱惑开始吸引更多的人,虚拟现实要在Web网上展示其迷人的风采,于是VRML语言出现了。VRML是一种面向对象的语言,它类似Web超级链接所使用的HTML语言,也是一种基于文本的语言,并可以运行在多种平台之上,只不过能够更多地为虚拟现实环境服务。
网页设计中多媒体功能的利用
网络资源的优势之一是多媒体功能。要吸引浏览者注意力,网页的内容可以用三维动画、FLASH等来表现。但要由于网络宽带的限制,在使用多媒体的形式表现网页的内容时不得不考虑客户端的传输速度。
结构清晰并且便于使用

如果人们看不懂或很难看懂您的网站,那么,他如何了解你的企业和服务呢?

使用一些醒目的标题或文字来突出您的产品与服务。并且即使您拥有最棒的产品,如果客户从您的网站上不清楚您在介绍什么或不清楚如何受益的话,

他们是不会喜欢您的网站的,这就是网页设计的失败。

导向清晰

网页设计中导航使用超文本链接或图片链接,使人们能够在您的网站上自由前进或后退,而不会让他们使用浏览器上的前进或后退。

我们在所有的图片上使用“ALT”标识符注明图片名称或解释,以便那些不愿意自动加载图片的观众能够了解图片的含义。

快速的下载时间

很多的浏览者不会进入需要等待5分钟下载时间才能进入的网站,在互联网上30秒的等待时间与我们平常10分钟等待时间的感觉相同。

因此,我们会建议您在网页设计中尽量避免使用过多的图片及体积过大的图片。

我们通常会与客户合作,将主要页面的容量控制在50K以内,平均30K左右,确保普通浏览者页面等待时间不超过10秒。

非图形的内容

我们在必要时适当使用动态“Gif”图片,为减少动画容量,应用巧妙设计的Java动画可以用很小的容量使图形或文字产生动态的效果。

但是,由于在互联网浏览的大多是一些寻找信息的人们,我们仍然建议您要确定您的网站将为他们提供的是有价值的内容,而不是过度的装饰。

方便的反馈及订购程序

让客户明确您所能提供的产品或服务并让他们非常方便地订购是您获得成功的重要因素。

如果客户在您的网站上产生了购买产品或服务的欲望,您是否能够让他们尽快实现吗?是在线还是离线?

网站测试和改进
测试实际上是模拟用户询问网站的过程,用以发现问题并改进网页设计。我们通常与用户共同安排网站测试。


3 网站分类

 
3.1 标准网站


品牌展示力:针对企业独立开发,品牌展示力强
用户体验值:结合品牌实际情况个性化布局、用户体验强
网站运行速度:网站的运行速度较快
网站的排名效果:百度排名效果良
后续维护:代码由零开始开发,后续维护和修改很方便
网站漏洞:几乎没有
个性化:网站的个性化强
建站时间:长
建站费用:高


3.2 模版网站


品牌展示力:模板样式套用,用即有的格式,品牌展示力弱
用户体验值:可以简单的调动,无法保证用户体验质量
网站运行速度:网站的运行速度较慢
网站的排名效果:百度排名的效果较弱
后续维护:固有的代码框架,后续修改麻烦
网站漏洞:容易出错
个性化:网站的个性化弱
建站时间:短
建站费用:低


4 设计要素


确定网站的整体风格
在这里,我提供给大家一些参考经验:
1.将你的标志logo,尽可能的放在每个页面上最突出的位置。
2.突出你的标准色彩。
3.总结一句能反映贵站精髓的宣传标语!
4.相同类型的图像采用相同效果,比如说标题字都采用阴影效果,那么在网站中出现的所有标题字的阴影效果的设置应该是完全一致的!
网页色彩的搭配
1.用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,这样的页面看起来色彩统一,有层次感。
2.用两种色彩。先选定一种色彩,然后选择它的对比色。
3.用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。
在网页配色中,还要切记一些误区:
1.不要将所有颜色都用到,尽量控制在三至五种色彩以内。
2.背景和前文的对比尽量要大(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容。
网页设计的工具
1.Dreamweaver,用于编辑HTML、ASP、JSP、PHP、CSS、XML、JS的页面制作工具;
2.Frontpage,跟Dreamweaver一样,不过个人感觉还是Dreamweaver好;
3.Flash,网页需要画面流动时的首选择;
4. Photoshop,图像处理软件,一般网页都需要有图片相搭配,Photoshop是款很强大的工具。
5.Fireworks,跟Photoshop一样都是图像处理软件,但Fireworks偏向与对网页的处理。


5 设计技巧


当你在INTERNET这个信息的海洋中尽情遨游时,会发现许许多多内容丰富、创意新颖、设计独特的个人网页,不知道你见到这样漂亮可人的网页是否有点心动。一旦你具备了上网的条件,又萌发了制作主页的念头,那么就应该注意网页设计时应考虑哪些方面的问题,包括网站功能和以及访问者需要什么。你的整个设计都应该围绕这些方面来进行。下面笔者就自己在实践操作中的使用体会来谈谈网页设计时应该考虑哪些问题,希望能给初建网站的用户带来一定的作用。
1、页面内容要新颖
网页内容的选择要不落俗套,要重点突出一个“新”字,这个原则要求我们在设计网站内容时不能照抄别人的内容,要结合自身的实际情况创作出一个独一无二的网站。 放眼望去,网上的许多个人主页简直就是"杂货店",内容包罗万象,题材千篇一律,人人都是"软件下载",个个都有"网络导航",从头到尾找不出一丝“鲜”意。所以,我们在设计网页时,要把功夫下在选材上。选材要尽量做到“少”而“精”,又必须突出“新”,如能坚持天天更新的话,我相信这样的网页一定会受到大家的欢迎。
2、网页命名要简洁
由于一个网站不可能就是由一个网页组成,它有许多子页面,为了能使这些页面有效地被连接起来,用户最后能给这些页面起一些有代表性的而且简洁易记的网页名称。这样既会有助于你以后方便管理网页,在向搜索引擎提交你的网页时更容易被别人索引到。在给网页命名时,最好使用自己常用的或符合页面内容的小写英文字母,这直接关系到页面上的连接。
3、要及时更新网页
网页制作好后,不能说万事大吉了,其实事后的工作量更大。因为网页制作是一时的,而维护更新的工作是每天都要做的。要及时把网页上已经作废的连接应该立即删除掉,比如用户无意中点击了页面中的一个连接,在苦苦的等待之后,换来的是无法访问的结果,那么他们会对你的网页大失所望,可能以后再也不会光顾你的网页了。若不能及时更新,也最好在主页上发布信息,告诉前来访问的朋友,因有特殊情况需要离开一段时间,未能及时更新主页,希望各位见谅,这样就能给人一种对别人负责的感觉,同时能得到网友的信任。
4、注意视觉效果
设计Web页面时,一定要用1024*768的分辨率来 分别观察。许多浏览器使用1024*768的分辨率,尽管在1280*1024高分辨率下一 些Web页面看上去很具吸引力,但在1024*768的模式下可能会黯然失色。作一点小小的努力,设计一个在不同分辨率下都能正常显示的网页
5、随时注意网站升级
时刻注意网站的运行状况。性能很好的主机随着访问人数的增加,可能会运行缓慢。但是,如果你不想失去访问者的话,一定要仔细计划好你的升级计划。
6、 网页内容要易读
网站设计最重要的诀窍,恐怕就是你的网页要易读 。这就意味着,你必须花点心思来规划文字与背景颜色的搭配方案。 注意不要使背景的颜色冲淡了文字的视觉效果,别用花里胡哨的色彩组合,让人看起来你的网页来很费劲。一般来说,浅色背景下的深色文字为佳 。这个要点要求你最好别把文字的规格设得太小、也不能太大。文字太小,人家读起来难受;文字太大,或者文字视觉效果变化频繁,像是冲着人大喊大叫,看起来不舒服。另外,最好让文本左对齐,而不是居中。


6 网站格式


静态网页
静态网页多数为单一的超文本标记语言档案。现今不少网站建设皆倾向把动态网页静态化,从而令搜寻引擎最佳化。
动态网页
动态网页的内容随着用户的输入和互动而有所不同,或者随着用户、时间、数据修正等而改变。网页上的内容也可以由用户通过使用客户端描述语言(JavaScript、JScript、Actionscript)来改变。


7 网页布局


什么是网页设计?网站的分类、格式,如何做好网页设计?网页设计 网页可以说是网站构成的基本元素。当我们轻点鼠标,在网海中遨游,一副副精彩的网页会呈现在我们面前,那么,网页的精彩与否的因素是什么呢?色彩的搭配、文字的变化、图片的处理等,这些当然是不可忽略的因素,除了这些,还有一个非常重要的因素——网页的布局。下面,我们就有关网页布局谈论一下。
1、“国”字型
也可以称为“同”字型,是一些大型网站所喜欢的类型,即最上面是网站的标题以及横幅广告条,接下来就是网站的主要内容,左右分列一些两小条内容,中间是主要部分,与左右一起罗列到底,最下面是网站的一些基本信息、联系方式、版权声明等。这种结构是我们在网上见到的差不多最多的一种结构类型。
2、拐角型
这种结构与上一种其实只是形式上的区别,其实是很相近的,上面是标题及广告横幅,接下来的左侧是一窄列链接等,右列是很宽的正文,下面也是一些网站的辅助信息。在这种类型中,一种很常见的类型是最上面是标题及广告,左侧是导航链接。
3、标题正文型
这种类型即最上面是标题或类似的一些东西,下面是正文,比如一些文章页面或注册页面等就是这种类。
4、封面型
这种类型基本上是出一些网站的首页,大部分为一些精美的平面设计结合一些小的动画,放上几个简单的链接或者仅是一个“进入”的链接甚至直接在首页的图片上做链接而没有任何提示。这种类型大部分是企业网站和个人主页,如果说处理的好,会给人带来赏心悦目的感觉。
5、“T”结构布局
所谓“T”结构布局,就是指网页上边和左边相结合,页面顶部为横条网站标志和广告条,左下方为主菜单,右面显示内容,这是网页设计中用得最广泛的一种布局方式。在实际设计中还可以改变“T”结构布局的形式,如左右两栏式布局,一半是正文,另一半是形象的图片、导航。或正文不等两栏式布置,通过背景色区分,分别放置图片和文字等。
这样的布局有其固有的优点,因为人的注意力主要在右下角,所以企业想要发布给用户的信,大都能被用户以最大可能性获取,而且很方便,其次是页面结构清晰,主次分明、易于使用。缺点是规矩呆板,如果细节色彩上不注意,很容易让人“看之无味”。
6、“口”型布局
这是一个形象的说法,指页面上下各有一个广告条,左边是主菜单,右边是友情链接等,中间是主要内容。

这种布局的优点是页面充实、内容丰富、信息量大,是综合性网站常用的版式,特别之处是顶部中央的一排小图标起到了活跃气氛的作用。缺点是页面拥挤,不够灵活。

也有将四边空出,只用中间的窗口型设计,例如网易壁纸站使用多帧形式,只有页面中央部分可以滚动,界面类似游戏界面。使用此类版式的有多维游戏娱乐性网站。

7、“三”型布局
这种布局多用于国外网站,国内用得不多。其特点是页面上横向两条色块,将页面整体分割为4个部分,色块中大多放广告条。
8、 对称对比布局
顾名思义,它指采取左右或者上下对称的布局,一半深色,一半浅色,一般用于设计型网站。其优点是视觉冲击力强,缺点是将两部分有机地结合比较困难。
9、POP布局
POP源自广告术语,指页面布局像一张宣传海报,以一张精美图片作为页面的设计中心。常用于时尚类网站,优点显而易见:漂亮吸引人,缺点是速度慢。


8 布局错误


1、导航菜单使用图片、flash....
2、不恰当地使用图片
3、内容里特殊字体的运用
4、新窗口打开
5、无实际意义的特效
6、内容滚动
7、用户难以获取自己想要的内容
8、文件名命名不规范
9、长篇文章未设置分页
10、颜色搭配错误,网页难于阅读
11、没有返回指向
12、显眼的点击计数器
13、使用框架
14、不恰当地使用声音
15、兼容性不佳
17、急于发布网站。


9 排版问题



1、字间距太挤或太宽
2、行距太小或太大
3、段距太少或太多
4、每行字数太多或太少


10 提高效率


最好的方法莫过于模块化,此前国内少有真正优秀的网页模板,PSD吧专注设计多年,拥有一批高水准的设计师,PSD吧公开下载顶尖设计档次的模板,并授权用于商业,可大大提高网页设计的效率。
另外,像来自美国,风靡亚洲的怪兽模板网站,其网站上的网站模板设计具有很高的水平。怪兽模板开发了很多CMS网站模板包括joomla,WordPress,magento,drupal,mambo等,以及设计精美的ZenCart,magento,oscommerce网店系统等目前市场上最流行各种类型各种行业的网站模板。


 



一、不重视域名和空间
不少企业在进行网页设计时的时候,不注重域名和空间的稳定性,随便找个域名和空间来注册。一个空间可以存放很多网站,一旦其中一个网站被降权或被K那将影响到其他的网站,选择好的、有保障的供应商非常重要。
二、注重外观不注重实用
很多企业在进行网页设计时,网站注重网站外观是否漂亮,有的网页为追求漂亮,用了大量的flash,实际上flash不利于百度蜘蛛的抓取,不利于企业开展网络营销,建议企业在进行网页设计时的时候,不仅要重视它的外观是否漂亮,还要注意网页是否迎合搜索引擎的喜好。
三、网站维护的缺乏
很多企业把网页建好以后就不管不问了,有的网页成年累月没有更新内容,这样百度就无法收录对于企业来说,必须找一些专业人士进行网页内容更新。

服务项目推荐

网站建设

网站建设

通过搜索引擎优化技术,提供更多的展示和推广机会,带来大量精准流量和询盘,每月意向客户增长20%。

手机网站建设

手机网站建设

手机网站的时代强势来袭,赢在全网营销时代,手机+电脑双剑合璧,把握商机滴水不漏。

微信营销

微信营销

集成微网站,微支付,微活动多种系统模块,通过微信公众平台迅速将您的产品和服务展现推广给海量移动端客户。

整合网络营销

整合营销

关键词2-48小时实现快速排名,覆盖6大主流搜索引擎,不让同搜索习惯的潜在客户都能找到您!

x
花费10秒填写资料,免费获取同行成功秘诀!今日剩余名额:16