导航:首页 > 万维百科 > 网页设计过程

网页设计过程

发布时间:2020-08-09 19:36:36

1、描述网页设计的一般步骤

一、网站结构设计
网站结构设计包含网站栏目设计和网站模块设计以来确定网站提供服务的一种逻辑表现形式,也是网页之间的层次关系。
1.网站栏目能起到提纲挈领额作用
2.网站栏目具有清晰导航的功能
3.网站模块要做到顺序清晰且紧密结合

二、网站主题设计
网站主题设计实际就是网站视觉呈现风格的设计。网站的主题风格要能充分吸引用户的注意力,为用户提供愉快的访问体验。
1.设计能反映网站内容的logo,并且将logo放在网站的醒目位置。
2.网站的颜色要统一,要突出网站的主调色彩。
3.相同类型的图像要有相同的效果。
4.网站要有一句明晰的宣传标语。

 
三、网站布局类型
1. 国字型布局
这种布局类型分为上边栏、左边栏、中间内容区、右边栏和底部的页脚区域,其形状酷似一个“国”字。国字型结构是目前比较常用的一个网页布局结构,它适用于信息分类繁多、需要良好组织的网站。
2. T字型布局
这种布局类型由上边栏、左边栏、内容区、下边栏组成,其形状有点像一个英文字母写的“T”字。T字型结构网站目前在一些权威机构、企事业单位的公司网站出现得比较多。
3. 左右框架型布局
这类网站主要由左边栏和内容区组成,组成比较简洁,主要用于精彩内容的呈现,主要是很多个人站点、博客的首选。
4. 上下框架型布局
这类网站由上下边栏组成,上边栏用来放置logo和链接等信息,下边栏用来放置网页的内容。上下型网站经常用来进行个性化展示,在企业门户网站的公司展示中也比较常用。
5. 标题正文型布局
这类网站的布局结构由上边栏和内容区组成,上边栏用于显示文章的标题。主要用于显示文章的标题,内容区放置文章的内容,这类布局在一些论文、学术网站的设计中比较常用。
网站设计都不会单独使用以上列出的某一种布局结构,而是通过混合使用多种布局结构来实现自己想要的效果,这类布局通常称为“综合性布局”。

四、网站页面设计
网站页面是网站的最终表现形式。网站页面由页面内容的质量度和页面的美观度来决定。页面设计应该遵循的原则如下:
1.符合企业的行业属性和企业特点。客户打开网站能直观感受企业所传递的理念和特征。
2.符合用户的浏览习惯。根据网站内容的重要性进行排序,让用户花最短的时间能够找到自己需要的信息。
3.符合用户的使用习惯。将用户经常使用的功能放在网站的醒目位置。
4.图文搭配。
5.利于搜索引擎优化。减少图片和动画,多使用文字描述,以便于搜索引擎收录,让客户更容易找到你。格子网络解答。

2、网络方案设计过程主要分哪几个步骤

步骤如下:

1,需求调研

2,需求分析

3,概要设计

4,详细设计

设计方案内容包括:网络拓扑、IP地址规划、网络设备选型等等。

(2)网页设计过程扩展资料:

网络工程设计原则

网络信息工程建设目标关系到现在和今后的几年内用户方网络信息化水平和网上应用系统的成败。在工程设计前对主要设计原则进行选择和平衡,并排定其在方案设计中的优先级,对网络工程设计和实施将具有指导意义。

1,实用、好用与够用性原则

计算机与外设、服务器和网络通信等设备在技术性能逐步提升的同时,其价格却在逐年或逐季下降,不可能也没必要实现所谓“一步到位”。所以,网络方案设计中应采用成熟可靠的技术和设备,充分体现“够用”、“好用”、“实用”建网原则,切不可用“今天”的钱,买“明、后天”才可用得上的设备。
2,开放性原则

网络系统应采用开放的标准和技术,资源系统建设要采用国家标准,有些还要遵循国际标准(如:财务管理系统、电子商务系统)。其目的包括两个方面:第一,有利于网络工程系统的后期扩充;第二,有利于与外部网络互连互通,切不可“闭门造车”形成信息化孤岛。

3,可靠性原则

无论是企业还是事业,也无论网络规模大小,网络系统的可靠性是一个工程的生命线。比如,一个网络系统中的关键设备和应用系统,偶尔出现的死锁,对于政府、教育、企业、税务、证券、金融、铁路、民航等行业产生的将是灾难性的事故。因此,应确保网络系统很高的平均无故障时间和尽可能低的平均无故障率。

4, 安全性原则

网络的安全主要是指网络系统防病毒、防黑客等破坏系统、数据可用性、一致性、高效性、可信赖性及可靠性等安全问题。为了网络系统安全,在方案设计时,应考虑用户方在网络安全方面可投入的资金,建议用户方选用网络防火墙、网络防杀毒系统等网络安全设施;网络信息中心对外的服务器要与对内的服务器隔离。

5, 先进性原则

网络系统应采用国际先进、主流、成熟的技术。比如,局域网可采用千兆以太网和全交换以太网技术。视网络规模的大小(比如网络中连接机器的台数在250台以上时),选用多层交换技术,支持多层干道传输、生成树等协议。

6,易用性原则

网络系统的硬件设备和软件程序应易于安装、管理和维护。各种主要网络设备,比如核心交换机、汇聚交换机、接入交换机、服务器、大功率长延时UPS等设备均要支持流行的网管系统,以方便用户管理、配置网络系统。

7,可扩展性原则

网络总体设计不仅要考虑到近期目标,也要为网络的进一步发展留有扩展的余地,因此要选用主流产品和技术。若有可能,最好选用同一品牌的产品,或兼容性好的产品。在一个系统中切不可选用技术和性能不兼容的产品。

3、网页设计制作详细流程

分析如下:

1、首先下载安装Dreamweaver,打开后,新建一个网页,一般选择“HTML”建立网页。选择“经典”界面,有助于我们更便捷使用这个软件。

2、下面选择这三个界面,代码、拆分、设计,一般默认设计界面,对于新手这个功能具有可视化,能更好的制作网页。

3、下面我们来制作网站站点,在电脑上建一个文件作为根目录。我们所建网站的所有文件和网页都保存在这个文件中。站点的作用就是使你的网站网页之间框架清晰。同时给站点起个名字。

4、然后再在站点根目录下建立一个专门储存网站图片的文件,并设置默认。这样你添加到这个网站的所有图片都自动保存到这个文件,不会丢失。注意文件命名要用英文。下面我用我建立的(篮球资讯网)来介绍,点击右下方篮球资讯网——下拉点击管理站点——点击高级设置——设置默认图像文件夹为刚建立的images。保存。

5、下面我们来制作这个网站首页,先学习添加图片。插入——图像——选择素材添加。点击图片,下面属性可以编辑修改图片大小,添加超链接等等。下面我修改图片大小做示范。

6、下面学习添加文本。编辑“篮球资讯网”,下面属性可以设置文本字体、添加超链接等等,点击页面属性,可以详细编辑文本属性。

7、网页基本就是文字和图片的组合,添加视频还需要学习者好好搜索Dreamweaver 的使用视频加以学习。最后制作完一个网页要记得保存。左上角文件——保存。

8、最后我们学习添加超链接。我用建立的第二个网页来做示范。选中篮球资讯网文本,点击页面下方属性——链接——点文件小按钮——选中第一个网页,这样篮球资讯网文本变成蓝色。这是网站内部链接,相反就有外部链接。添加如图,一定要写http://......就可以了。

9、最后我们浏览网页。左上角文件——在浏览器中浏览网页,点击网页中两个链接都能到达指定网页。

(3)网页设计过程扩展资料:

网页设计

设计网站要注意两个要点:整体风格和色彩搭配。

风格

网站的整体风格及其创意设计是最难以学习的。难就难在没有一个固定的模式可以参照和模仿。给你一个主题,任何两人都不可能设计出完全一样的网站。

风格(Style)是抽象的。是指站点的整体形象给浏览者的综合感受。这个“整体形象”包括站点的CI(标志、色彩、字体、标语)、版面布局、浏览方式、交互性、文字、语气、内容价值、存在意义、站点荣誉等等诸多因素。

色彩搭配

无论是平面设计,还是网页设计,色彩永远是最重要的一环。当我们距离显示屏较远的时候,我们看到的不是优美的版式或者是美丽的图片,而是网页的色彩。

网页配色小技巧:

1.用一种色彩:这里是指先选定一种色彩,然后调整透明度或者饱和度,这样的页面看起来色彩统一,有层次感;

2.用两种色彩:先选定一种色彩,然后选择它的对比色;

3.用一个色系:简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。

在网页配色中,还要切记一些误区:

1.不要将所有颜色都用到,尽量控制在三至五种色彩以内;

2.背景和前文的对比尽量要大(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容。

4、网页设计流程

网页设计的两大要点是:整体风格和色彩搭配。

确定网站整体风格

在这里,我提供给大家一些参考经验:

1.将你的标志logo,尽可能的放在每个页面上最突出的位置。

2.突出你的标准色彩。

3.总结一句能反映贵站精髓的宣传标语!

4.相同类型的图像采用相同效果,比如说标题字都采用阴影效果,那么在网站中出现的所有标题字的阴影效果的设置应该是完全一致的!

网站的整体风格及其创意设计是最难以学习的,难就难在没有一个固定的模式可以参照和模仿。给你一个主题,任何两人都不可能设计出完全一样的网站。

R、G、B就是Red、Green、Blue(红,绿,蓝)三种颜色,RGB模式就是由这三种颜色为基色进行叠加而模拟出大自然色彩的色彩组合模式。我们日常用的彩色电脑显示器、彩色电视机等的色彩都使用这种模式。

1、 矢量图

矢量图又叫做向量图,是用一系列计算机指令来描述和记录一幅图,一幅图可以解为一系列由点、线、面等到组成的子图,它所记录的是对象的几何形状、线条粗细和色彩等。生成的矢量图文件存储量很小,特别适用于文字设计、图案设计、版式设计、标志设计、计算机辅助设计(CAD)、工艺美术设计、插图等。矢量图只能表示有规律的线条组成的图形,如工程图、三维造型或艺术字等; 常见的矢量图处理软件有CoreIDRAW、AutoCAD、Illustrator和FreeHand等。

2、位图

位图又叫点阵图或像素图,计算机屏幕上的图你是由屏幕上的发光点(即像素)构成的,每个点用二进制数据来描述其颜色与亮度等信息,这些点是离散的,类似于点阵。 位图在放大到一定限度时会发现它是由一个个小方格组成的,这些小方格被称为像素点,一个像素是图像中最小的图像元素。也就是我们俗称的马赛克。

bmp:是未经过压缩的用点阵来表示的真彩图片,占用磁盘空间较大

gif:是经过压缩的,只能表示256种颜色,占用磁盘空间小,常用来演示色彩单一的成块的卡通图案,GIF还有一种可以表示连续的动画。

png:是fireworks的图片格式

jpg:也称为jpeg,是有损压缩格式但是它表示的颜色比较丰富,一般用来显示真彩的照片或图案。

作为设计者和客户(这里指各站长),如果事先没有明文协议的话设计者有权不提供源文件。

VI是Visual Identity的缩写,中文译为“企业视觉识别”。VI是CI计划的静态识别符号,是企业理念视觉化传达的载体,因此它项目最多,效果最为直接。VI作为视觉识别,它是外在表现,固然需要具有美感,但VI必须是MI的体现,直接反映企业的理念。因此VI设计包含这样一些原则:即充分传达企业理念、人性原则、民族性原则、简洁抽象及动态原则、员工参与原则、法律原则、艺术性原则和个性原则。

CI是Corporate Identity的缩写,中文译为“企业形象”。CI计划,是指企业有目的、有计划、战略性地创造出所希望的自身形象,由此提高企业的社会知名度,最终得到自己最适合的经营环境。

而logo只是网站或企业一个标志。

网页色彩搭配

1.用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,这样的页面看起来色彩统一,有层次感。

2.用两种色彩。先选定一种色彩,然后选择它的对比色。

3.用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。

在网页配色中,还要切记一些误区:

1.不要将所有颜色都用到,尽量控制在三至五种色彩以内。

2.背景和前文的对比尽量要大(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容。

网页设计工具

图像处理设计:

adobe PhotoShop(外语简称:PS、其程序图标便是它的外语简称)是一个由Adobe Systems开发和发行的图像处理软件。 Adobe Photoshop有两个发行版本:标准版Adobe Photoshop和扩展版Adobe Photoshop Extended,扩展版除包含标准版所有功能之外,还增加了3D处理功能、动画图形编辑功能和高级图像分析功能。 Adobe只支持Windows操作系统和Mac OS操作系统版本的Photoshop , 但Linux操作系统用户可以通过使用Wine来运行Photoshop CS6。

Fireworks,跟Photoshop一样都是图像处理软件,但Fireworks偏向于对网页的处理。

StylePix(单位:Hornil)跟PhotoShop一样都是图象处理软件,可以处理光栅及矢量图形。

动画设计:

Adobe Flash,前称Macromedia Flash,外语简称Flash,前身FutureSplash,既指Adobe Flash Professional多媒体创作程序,也指Adobe Flash Player。

网页代码编辑器:

Adobe Dreamweave(前称Macromedia Dreamweaver)用于编辑HTML、ASP、JSP、PHP、CSS、XML、JS的页面制作工具;是Adobe公司的著名网站开发工具。它使用所见即所得的接口,亦有HTML编辑的功能。有支持Mac和Windows两个系统的版本。

Amaya(单位:万维网联盟)用于编辑HTML、CSS、数学标记语言、可缩放矢量图形的工具。

5、网页设计流程是什么?

设计流程:

主题明确:

在目标明确的基础上,完成网站的构思创意即总体设计方案。对网站的整体风格和特色作出定位,规划网站的组织结构。

Web站点应针对所服务对象(机构或人)的不同而具有不同的形式。有些站点只提供简洁文本信息;有些则采用多媒体表现手法,提供华丽的图像、闪烁的灯光、复杂的页面布置,甚至可以下载声音和录像片段。好的Web站点把图形表现手法和有效的组织与通信结合起来。

为了做到主题鲜明突出,要点明确,应该使配色和图片围绕预定的主题;调动一切手段充分表现网站点的个性和情趣,办出网站的特点。

充分利用已有信息,如客户手册.公共关系文档.技术手册和数据库等。

设计思路:

1、简洁实用:这是非常重要的,网络特殊环境下,尽量以最高效率的方式将用户所要想得到的信息传送给他就是最好的,所以要去掉所有的冗余的东西。

2、使用方便:同第一个是相一致的,满足使用者的要求,网页做得越适合使用,就越显示出其功能美

3、整体性好:一个网站强调的就是一个整体,只有围绕一个统一的目标所做的设计才是成功的。

4、网站形象突出:一个符合美的标准的网页是能够使网站的形象得到最大限度的提升的。页面用色协调,布局符合形式美的要求:布局有条理,充分利用美的形式,使网页富有可欣赏性,提高档次。当然雅俗共赏是人人都追求的。

5、交互式强:发挥网络的优势,是每个使用者都参与到其中来,这样的设计才能算成功的设计。这样的网页才算真正的美的设计。

版式设计:

网页设计作为一种视觉语言,特别讲究编排和布局,虽然主页的设计不等同于平面设计,但它们有许多相近之处。

版式设计通过文字图形的空间组合,表达出和谐与美。

多页面站点页面的编排设计要求把页面之间的有机联系反映出来,特别要求处理好页面之间和页面内的秩序与内容的关系。为了达到最佳的视觉表现效果,反复推敲整体布局的合理性,使浏览者有一个流畅的视觉体验。

色彩作用:

色彩是艺术表现的要素之一。在网页设计中,设计师根据和谐、均衡和重点突出的原则,将不同的色彩进行组合.搭配来构成美丽的页面。 根据色彩对人们心理的影响,合理地加以运用。如果企业有CIS(企业形象识别系统),应按照其中的VI进行色彩运用。

形式内容:

为了将丰富的意义和多样的形式组织成统一的页面结构,形式语言必须符合页面的内容,体现内容的丰富含义。

灵活运用对比与调和、对称与平衡、节奏与韵律以及留白等手段,通过空间、文字、图形之间的相互关系建立整体的均衡状态,产生和谐的美感。

三维空间的构成:

网络上的三维空间是一个假想空间,这种空间关系需借助动静变化.图像的比例关系等空间因素表现出来。 在页面中,图片、文字位置前后叠压,或页面位置变化所产生的视觉效果都各不相同。

通过图片、文字前后叠压所构成的空间层次不太适合网页设计,根据现有浏览器的特点,网页设计适合比较规范、简明的页面,尽管这种叠压排列能产生强节奏的空间层次,视觉效果强烈。

网页上常见的是页面上、下、左、右、中位置所产生的空间关系,以及疏密的位置关系所产生的空间层次,这两种位置关系使产生的空间层次富有弹性,同时也让人产生轻松或紧迫的心理感受。

虚拟现实:

人们已不满足于HTML(标准通用标记语言下的一个应用)编制的二维Web页面,三维世界的诱惑开始吸引更多的人,虚拟现实要在Web网上展示其迷人的风采,于是VRML语言出现了。

VRML是一种面向对象的语言,它类似Web超级链接所使用的HTML语言,也是一种基于文本的语言,并可以运行在多种平台之上,只不过能够更多地为虚拟现实环境服务。

多媒体:

网络资源的优势之一是多媒体功能。要吸引浏览者注意力,网页的内容可以用三维动画、FLASH等来表现。但要由于网络宽带的限制,在使用多媒体的形式表现网页的内容时不得不考虑客户端的传输速度。

便于使用:

如果人们看不懂或很难看懂您的网站,那么,他如何了解你的企业信息和服务项目呢?使用一些醒目的标题或文字来突出您的产品与服务。

并且即使您拥有最棒的产品,如果客户从您的网站上看不清楚您在介绍什么或不清楚如何受益的话,他们是不会喜欢您的网站的,这对于网页设计而言是失败的。

导向清晰:

网页设计中导航使用超文本链接或图片链接,使人们能够在您的网站上自由前进或后退,而不必让他们使用浏览器上的前进或后退。我们在所有的图片上使用“ALT”标识符注明图片名称或解释,以便那些不愿意自动加载图片的观众能够了解图片的含义。

快速下载时间:

很多的浏览者不会进入需要等待5分钟下载时间才能进入的网站,在互联网上30秒的等待时间与我们平常10分钟等待时间的感觉相同。因此,建议在网页设计中尽量避免使用过多的图片及体积过大的图片。主要页面的容量应确保普通浏览者页面等待时间不超过10秒。

非图形内容:

在必要时适当使用动态“Gif”图片,为减少动画容量,应用巧妙设计的Java动画可以用很小的容量使图形或文字产生动态的效果。但是,由于在互联网浏览的大多是一些寻找信息的人们,仍然建议您要确定您的网站将为他们提供的是有价值的内容,而不是过度的装饰。

反馈与沟通:

让客户明确您所能提供的产品或服务并让他们非常方便地订购是您获得成功的重要因素。如果客户在您的网站上产生了购买产品或服务的欲望,您是否能够让他们尽快实现吗?是在线还是离线?

因此,如果是产品或服务介绍网站,应该有留言、电话、在线咨询等功能或信息呈现。

在企业的Web站点上,要认真回复用户的电子邮件和传统的联系方式如信件.电话垂询和传真,做到有问必答。最好将用户的用意进行分类,如售前一般了解.售后服务等,由相关部门处理,使网站访问者感受到企业的真实存在并由此产生信任感。

测试改进:

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

内容更新:

企业Web站点建立后,要不断更新网页内容。站点信息的不断更新,让浏览者了解企业的发展动态和网上职务等,同时也会帮助企业建立良好的形象。

注意不要许诺你实现不了的东西,在你真正有能力处理回复之前,不要恳求用户输入信息或罗列一大堆自己不能及时答复的电话号码。 如果要求访问者自愿提供其个人信息,应公布并认真履行个人隐私保承诺。

(5)网页设计过程扩展资料:

网页设计(web design,又称为Web UI design,WUI design,WUI),是根据企业希望向浏览者传递的信息(包括产品、服务、理念、文化),进行网站功能策划,然后进行的页面设计美化工作。

作为企业对外宣传物料的其中一种,精美的网页设计,对于提升企业的互联网品牌形象至关重要。

网页设计一般分为三种大类:功能型网页设计(服务网站&B/S软件用户端)、形象型网页设计(品牌形象站)、信息型网页设计(门户站)。设计网页的目的不同,应选择不同的网页策划与设计方案。

网页设计的工作目标,是通过使用更合理的颜色、字体、图片、样式进行页面设计美化,在功能限定的情况下,尽可能给予用户完美的视觉体验。高级的网页设计甚至会考虑到通过声光、交互等来实现更好的视听感受。

网页设计主要以Adobe产品为主,常见的工具包括FW、PS、FL、DW、CDR、AI等,其中DW是代码工具,其他是图形图像和FL动画工具。还有最近几年Adobe新出的EdgeReflow、EdgeCode、Muse。

标题设计:

在设计网页标题时,应注意同时兼顾对用户的注意力,以及对搜索引擎检索的需要。这一原则在实际操作中可通过三个方面来体现,这三个方面也可以被认为是网页标题设计的一般规律:

1、网页标题不宜过短或者过长

一般来说6-10个汉字比较理想,最好不要超过30个汉字。网页标题字数过少可能包含不了有效关键词,字数过多不仅搜索引擎无法正确识别标题中的核心关键词,而且也让用户难以对网页标题(尤其是首页标题,代表了网站名称)形成深刻印象,也不便于其他网站链接。

2、网页标题应概括网页的核心内容

当用户通过搜索引擎检索时,在检索结果页面中的内容一般是网页标题(加链接)和网页摘要信息,要引起用户的关注,网页标题发挥了很大的作用。

如果网页标题和页面摘要信息有较大的相关性,摘要信息对网页标题将发挥进一步的补充作用,从而引起用户对该网页信息点击行为的发生(也就意味着搜索引擎推广发挥了作用)。

另外,当网页标题被其他网站或者本网站其他栏目/网页链接时,一个概括了网页核心内容的标题有助于用户判断是否点击该网页标题链接。

3、网页标题中应含有丰富的关键词

考虑到搜索引擎营销的特点,搜索引擎对网页标题中所包含的关键词具有较高的权重,尽量让网页标题中含有用户检索所使用的关键词。

以网站首页设计为例,一般来说首页标题就是网站的名称或者公司名称,但是考虑到有些名称中可能无法包含公司/网站的核心业务,也就是说没有核心关键词,这时通常采用“核心关键词+公司名/品排名”的方式来作为网站首页标题。

开头所列举的某网络营销服务商网站首页标题实例,其实也是采用这种方式来设计网页标题,只不过由于罗列了太多的“核心关键词”,反而没有了核心。

做美工看起来并不是一件容易的事情。首先,要对整个站点和企业有个大致的了解。例如:某些企业喜欢蓝色的主调,你不可能去做个红色的主调,这样完全违背客户的主要意愿,如果百度的标志改成五颜六色的,相信大家也不会认可的。

站长的职责是规划网站结构。同样也需要有一定的审美观。下面介绍了几款常用的绘图工具和基本知识。

参考资料:

网络-网页设计 (网站技术)

6、网页设计制作流程是什么样的?

网页设计的两大要点是:整体风格和色彩搭配。
确定网站整体风格
在这里,我提供给大家一些参考经验:
1.将你的标志logo,尽可能的放在每个页面上最突出的位置。
2.突出你的标准色彩。
3.总结一句能反映贵站精髓的宣传标语!
4.相同类型的图像采用相同效果,比如说标题字都采用阴影效果,那么在网站中出现的所有标题字的阴影效果的设置应该是完全一致的!

7、网页制作的一般流程是什么?

怎样设计网页

在网页设计的认识上,许多人似乎仍停留在网页制作的高度上。认为只要用好了网页制作软件,就能搞好网页设计了……

在网页设计的认识上,许多人似乎仍停留在网页制作的高度上。认为只要用好了网页制作软件,就能搞好网页设计了。
其实网页设计是一个感性思考与理性分析相结合的复杂的过程,它的方向取决于设计的任务,它的实现依赖于网页的制作。正所谓“功夫在诗外”,网页设计中最重要的东西,并非在软件的应用上,而是在我们对网页设计的理解以及设计制作的水平上,在于我们自身的美感以及对页面的把握上。
首先,我们要弄清楚网页设计的任务。

一、设计的任务

设计是一种审美活动,成功的设计作品一般都很艺术化。但艺术只是设计的手段,而并非设计的任务。设计的任务是要实现设计者的意图,而并非创造美。
网页设计的任务,是指设计者要表现的主题和要实现的功能。站点的性质不同,设计的任务也不同。从形式上,可以将站点分为以下三类。
第一类是资讯类站点,像新浪、网易、搜狐等门户网站。这类站点将为访问者提供大量的信息,而且访问量较大。因此需注意页面的分割、结构的合理、页面的优化、界面的亲和等问题。
第二类是资讯和形象相结合的网站,像一些较大的公司、国内的高校等。这类网站在设计上要求较高,既要保证资讯类网站的上述要求,同时又要突出企业、单位的形象。然而就现状上来看,这类网站有粗制滥造的嫌疑。
第三类则是形象类网站,比如一些中小型的公司或单位。这类网站一般较小,有的则有几页,需要实现的功能也较为简单,网页设计的主要任务是突出企业形象。这类网站对设计者的美工水平要求较高。
当然,这只是从整体上来看,具体情况还要具体分析。不同的站点还要区别对待。别忘了最重要的一点,那就是客户的要求,它也属于设计的任务。
明确了设计的任务之后,接下来要想的就是如何完成这个任务了。

二、设计的实现

设计的实现可以分为两个部分。第一部分为站点的规划及草图的绘制,这一部分可以在纸上完成。第二部分为网页的制作,这一过程是在计算机上完成的。
设计首页的第一步是设计版面布局。我们可以将网页看作传统的报刊杂志来编辑,这里面有文字、图像乃至动画,我们要做的工作就是以最适合的方式将图片和文字排放在页面的不同位置。 除了要有一台配置不错的计算机外,软件也是必需的。不能简单地说一个软件的好坏,只要是设计者使用起来觉得方便而且能得心应手的,就可以称为好软件。当然,它应该能满足设计者的要求。笔者常用的软件是Macromedia的Dreamweaver、Fireworks、Flash以及Adobe的Photoshop、imageready,这些都是很不错的软件。 接下来我们要做的就是通过软件的使用,将设计的蓝图变为现实,最终的集成一般是在Dreamweaver里完成的。虽然在草图上,我们定出了页面的大体轮廓,但是灵感一般都是在制作过程中产生的。设计作品一定要有创意,这是最基本的要求,没有创意的设计是失败的。在制作的过程中,我们会碰到许多问题,其中最敏感的莫过于页面的颜色了。

三、色彩的运用

色彩是一种奇怪的东西,它是美丽而丰富的,它能唤起人类的心灵感知。一般来说,红色是火的颜色,热情、奔放;也是血的颜色,可以象征生命。黄色是明度最高的颜色,显得华丽、高贵、明快。绿色是大自然草木的颜色,意味着纯自然和生长,象征安宁和平与安全,如绿色食品。紫色是高贵的象征,有庄重感。白色能给人以纯洁与清白的感觉,表示和平与圣洁。
我们知道,颜色是光的折射产生的,红、黄、蓝是三原色,其它的色彩都可以用这三种色彩调和而成。换一种思路,我们可以用颜色的变化来表现光影效果,这无疑将使我们的作品更贴近现实。
色彩代表了不同的情感,有着不同的象征含义。这些象征含义是人们思想交流当中的一个复杂问题,它因人的年龄、地域、时代、民族、阶层、经济地区、工作能力、教育水平、风俗习惯、宗教信仰、生活环境、性别差异而有所不同。
单纯的颜色并没有实际的意义,和不同的颜色搭配,它所表现出来的效果也不同。比如绿色和金黄、淡白搭配,可以产生优雅,舒适的气氛。蓝色和白色混合,能体现柔顺、淡雅、浪漫的气氛。红色和黄色、金色的搭配能渲染喜庆的气氛。而金色和粟色的搭配则会给人带来暖意。设计的任务不同,配色方案也随之不同。考虑到网页的适应性,应尽量使用网页安全色。
但颜色的使用并没有一定的法则,如果一定要用某个法则去套,效果只会适得其反。经验上我们可先确定一种能表现主题的主体色,然后根据具体的需要,应用颜色的近似和对比来完成整个页面的配色方案。整个页面在视觉上应是一个整体,以达到和谐、悦目的视觉效果。

四、造型的组合

在网页设计中,我们主要通过视觉传达来表现主题。在视觉传达中,造型是很重要的一个元素。抛去是图还是文字的问题,画面上的所有元素可以统一作为画面的基本构成要素点、线、面来进行处理。在一幅成功的作品里,是需要点、线、面的共同组合与搭配来构造整个页面的。
通常我们可以使用的组合手法有秩序、比例、均衡、对称、连续、间隔、重叠、反复、交*、节奏、韵律、归纳、变异、特写、反射等等,它们都有各自的特点。在设计中应根据具体情况,选择最适合的表现手法,这样有利于主题的表现。
通过点、线、面的组合,可以突出页面上的重要元素,突出设计的主题,增强美感,让观者在感受美的过程中领会设计的主题,从而实现设计的任务。
造型的巧妙运用不仅能带来极大的美感,而且能较好地突出企业形象,而且能将网页上的各种元素有机的组织起来,它甚至还可以引导观者的视线。

五、设计的原则

设计是有原则的,无论使用何种手法对画面中的元素进行组合,都一定要遵循五个大的原则:统一、连贯、分割、对比及和谐。
统一,是指设计作品的整体性,一致性。设计作品的整体效果是至关重要的,在设计中切勿将各组成部分孤立分散,那样会使画面呈现出一种枝蔓纷杂的凌乱效果。
连贯,是指要注意页面的相互关系。设计中应利用各组成部分在内容上的内在联系和表现形式上的相互呼应,并注意整个页面设计风格的一致性,实现视觉上和心理上的连贯,使整个页面设计的各个部分极为融洽,犹如一气呵成。
分割,是指将页面分成若干小块,小块之间有视觉上的不同,这样可以使观者一目了然。在信息量很多时为使观者能够看清楚,就要注意到将画面进行有效的分割。分割不仅是表现形式的需要。换个角度来讲,分割也可以被视为对于页面内容的一种分类归纳。
对比就是通过矛盾和冲突,使设计更加富有生气。对比手法很多,例如:多与少、曲与直、强与弱、长与短、粗与细、疏与密、虚与实、主与次、黑与白、动与静、美与丑、聚与散等等。在使用对比的时候应慎重,对比过强容易破坏美感,影响统一。
和谐是指整个页面符合美的法则,浑然一体。如果一件设计作品仅仅是色彩、形状、线条等的随意混合,那么作品将不但没有“生命感”,而且也根本无法实现视觉设计的传达功能。和谐不仅要看结构形式,而且要看作品所形成的视觉效果能否与人的视觉感受形成一种沟通,产生心灵的共鸣。这是设计能否成功的关键。

六、网页的优化

在网页设计中,网页的优化是较为重要的一个环节。它的成功与否会影响页面的浏览速度和页面的适应性,影响观者对网站的印象。
在资讯类网站中,文字是页面中最大的构成元素,因此字体的优化显得尤为重要。使用css样式表指定文字的样式是必要的,通常我们将字体指定为宋体,大小指定为12px,颜色要视背景色而定,原则上以能看清且与整个页面搭配和谐为准。在白色的背景上,我们一般使用黑色,这样不易产生视觉疲劳,能保证浏览者较长时间地浏览网页。
图片是网页中的重要元素。图片的优化可以在保证浏览质量的前提下将其size降至最低,这样可以成倍地提高网页的下载速度。利用Photoshop6或Fireworks4可以将图片切成小块,分别进行优化。输出的格式可以为gif或jpeg,要视具体情况而定。一般我们把有较为复杂颜色变化的小块优化为jpeg,而把那种只有单纯色块的卡通画式的小块优化为gif,这是由这两种格式的特点决定的。
表格(table)是页面中的重要元素,是页面排版的主要手段。我们可以设定表格的宽度、高度、边框、背景色、对齐方式等参数。很多时候,我们将表格的边框设为0,以此来定位页面中的元素,或者籍此确定页面中各元素的相对位置。我们知道:浏览器在读取网页html原代码时,是读完整个table才将它显示出来的。如果一个大表格中含有多个子表格,必须等大表格读完,才能将子表格一起显示出来。我们在访问一些站点时,等待多时无结果,按"停止"按钮却一下显示出页面就是这个原因。因此,我们在设计页面表格的时候,应该尽量避免将所有元素嵌套在一个表格里,而且表格嵌套层次尽量要少。在使用Dreamweaver制作网页时,会自动在每一个td内添加一个空字符“ ”。如果单元格内没有填充其它元素,这个空字符会保留,在指定td的宽度或高度后,可以在源代码内将其删去。
网页的适应性是很重要的,在不同的系统上,不同的分辨率下,不同的浏览器上,我们将会看到不同的结果,因此设计时要统筹考虑。一般我们在800*600下制作网页,最佳浏览效果也是在800*600分辨率下,在其它情况下只要保证基本一致,不出现较大问题即可。
说了这么多,只是希望能对做“网页设计”的人有所帮助,希望他们在做网页的时候能够从整体着眼,无愧于“设计”这两个字。

8、简述网站的设计流程

你好,网站建设的流程基本上包括域名注册查询、网站策划、网页设计、网站功能、网站优化技术、网站内容整理、网站推广、网站评估、网站运营、网站整体优化、网站改版等。

9、学习网页设计步骤

作为过来人我建议你这样学
1、先学美工。你有PHOTOSHOP基础,那就好办了。先去模仿一些简单的网站,做网页的效果图,
2、学习DREAMVER这款软件的基础知识,这个软件里面很直观的就会涉及到HTML语言,看多了你就懂了,一点不难。
3、通过以上学习,你就可以将整个效果图切割,放入DREAMVER中,做成html静态网页。
4、当你懂基础的网页制作后,以后你会自然的接触到,数据库,FLASH,网页脚本,服务器知识等很多方面的。一步一步来,不要急

祝你好运

与网页设计过程相关的知识