网页设计与制作的具体流程

1、目 录 摘 要2关键词2Abstract2Key Words2一、网页设计的原则3（一）明确网站主题3（二）总体设计方案主题鲜明3（三）网页设计形式与内容相统一3二、网页设计与制作的具体流程3（一）网站策划4（二）网页布局版式设计5（三）网页色彩搭配6（四）网站后台设计7三、网页制作工具的学习与应用8（一）Dreamweaver8（二）Flash9(三) Photoshop9四、网页优化10（一）网页技术优化11（二）人文优化12参考文献13浅谈网页的设计与制作学生姓名：林永俊 学号：20075171030美术学院 美术学专业指导教师：张睿 职称：讲师摘 要：随着中国互联网的高速发展，相关的网络应用技术将会得到更多的应用，做为互联网信息表述和传递基础载体的网页也越来越受到人们的关注。本文从网页设计的要素、原则及相关技巧等对网页设计与制作进行了介绍和说明。通过对网页的设计与制作的研究,探求符合时代特色的网页制作原理和行之有效的设计方法,提高网页的用户体验和视觉冲击力,增强网站与网民的互动，促进企业开展电子商务，信息平台等基础设施，创造更高的经济效益。关键词：网页设计；网页制作；色彩搭配A

2、bstract: With the rapid development of Chinas Internet web applications, related technology will get more applications, as Internet information representation and transfer of web based carrier has become the concern of the public. This article from the web page design elements and principles and related skills on web design and production are introduced and illustrated. Through the design and manufacture of web page, which can accord with the special age web production principle and effective de

3、sign methods, improve web user experience and visual impact, enhance the interaction with Internet website, promote enterprise in developing electronic commerce, information platform and other infrastructure, and create more economic benefits. Key Words: web design；web pages；colour collocation一个成功抓住用户“眼球”并最终带来经济效益的网站首先需要一个优秀的设计，然后加上优秀的制作。设计是网站的核心和灵魂，是一个感性思考与理性分析相结合的复杂的过程，它的方向取决于设计的任务，它的实现依赖于网页的制作。把网页艺术设计与其他艺术设计形式进行比较，尝试从网页艺术设计的内容、原则、制作技巧、制作流程等几个方面对这个新的艺术设计领域进行初步的归纳总结和理论探讨，网页艺术设计是艺术与技术的高度统一。一、网页设

4、计的原则（一）明确网站主题优秀的网页设计必然服务于网站的主题，就是说要建设一个网站，首先需要定位，既要清楚建设网站的目的和面向浏览的对象，只有定位准确的网站才会有可观性和应用性。因此我们必须明确设计站点的目的和用户需求，从而做出切实可行的设计计划。（二）总体设计方案主题鲜明在目标明确的基础上，完成网站的构思创意即总体设计方案。对网站的整体风格和特色作出定位，规划网站的组织结构。做到主题鲜明突出，要点明确，以简单明确的语言和画面体现站点的主题；调动一切手段充分表现网站的个性和情趣。（三）网页设计形式与内容相统一内容是构成设计的一切内在要素的总和，是设计存在的基础，被称为“设计的灵魂”；形式是构成内容诸要素的内部结构或内容的外部表现方式。为了将丰富的意义和多样的形式组织成统一的页面结构，形式语言必须符合页面的内容，体现内容的丰富含义。灵活运用对比与调和、对称与平衡、节奏与韵律以及留白等手法，通过空间、文字、图形之间的相互关系建立整体的均衡状态，产生和谐的美感。如对称原则在页面设计中，它的均衡有时会使页面显得呆板，但如果加入一些富有动感的文字、图案，或采用夸张的手法来表现内容往往会达到比较好

5、的效果。 点、线、面作为视觉语言中的基本元素，巧妙地互相穿插、互相衬托、互相补充构成最佳的页面效果，充分表达完美的设计意境。一个优秀的设计必定是形式对内容的完美表现。正如黑格尔所说：“工艺的美就不在于要求实用品的外部造型、色彩、纹样去摹拟事物，再现现实，而在于使其外部形式传达和表现出一定的情绪、气氛、格调、风尚、趣味，使物质经由象征变成相似于精神生活的有关环境。”陈鹏，走出艺术哲学迷宫黑格尔美学笔记，文化艺术出版社，2007年第7期，第201页。二、网页设计与制作的具体流程网页设计是一个综合性极强的工作，涉及到商业策划、平面设计、人机界面、程序语言和数据库等。网页设计从总体上可大致分为策划、前台页面设计和后台三部分，本文主要从AZE设计工作室的网站实例来论述网页设计与制作的流程。（一）网站策划策划是指网站的整体定位、功能规划、应用分析、流程设计和内容架构组织，网站策划是网站平台建设成败的关键内容之一。网站策划重点阐述了解决方案能给客户带来什么价值，以及通过何种方法去实现这种价值。在策划的同时要以人为本，迎合网民需求、找到了市场需求的点，才能把整体定位策划做到位。对网站内容功能规划，做到

6、让搜索引擎更多的收录和关注，网页打开速度更快。通过对AZE设计工作室的分析，主要包涵动画设计、网站设计、家装设计、CG培训四个大栏目，明确了网站定位后来分析相关行业和市场特点。通过对相关行业和市场的分析，以及网站内容和功能的分析，规划出本次建设的网站主要内容如下：1.进入页flash Flash 页面的导入网站不仅生动形象，还会给人印象深刻的感觉， flash 页面以四个版块为基准，主要分动画设计、网站建设、墙体彩绘、设计培训。点击任意一个可以直接进入每个小站，具有明确的导航性，设置较醒目的进入首页按钮，通过点击它就可以进入网站首页。2.网站首页网站首页是整个网站的门户，简洁、大方、加载速度快是网站首页的关键要素。网站主要规划的栏目内容有：首页、业内新闻、动画设计、网站建设、家装设计、CG培训、精品案例、关于我们、服务范围、联系我们。3.新闻动态发布系统最新动态栏目主要用来发布企业新闻，公司动态、最新消息等。通过最新动态栏目可使客户对公司最新的发展动态、产品信息、人文文化、最新消息等信息有一个及时的了解。此栏目，可让客户在线实时管理、发布新闻、删除新闻、更改等。4.企业留言系统企业留言

7、栏目在设计方面要美观、大方、与网站风格融成一体，更要注重用户体验。网民无需注册，有回复，通过相互直接的交流，能够为企业找到潜在客户，和一些市场信息。5.人才招聘目前很多企业都利用公司网站平台发布招聘信息。这样不但可以充分利用现有资源，而且相比传统的职业服务中心更具有实时性、互动性等优点。（二）网页布局版式设计logo公司公告、人才招聘、网站地图、论坛联系方式/收藏本站首页业内新闻动画设计网站建设墙体彩绘CG培训精品案例关于我们服务范围联系我们网站主幻灯片公司公告动画设计栏目最新资讯帮助中心网页设计栏目公司简介资源共享墙体手绘栏目友情链接CG培训栏目网页版权信息图（1） AZE设计工作室首页规划图页面的整体布局则是网页设计的根基。根据现代网页的发展趋势来看，简洁、直观、人性化以及个性化是网站设计的基本要素，所以在做整体布局的时候一定要充分的考虑到这些要素。网页设计作为一种视觉语言，特别讲究编排和布局，通过文字图形的空间组合编排，表达出和谐与美。在AZE网站首页主要版块设计中，我采用了“匡”字型布局，给主内容区释放了更多空间，如图(1)（AZE设计工作室网站首页）所示：页面上部是网页标志和

8、导航条，接下来是网页主幻灯片，左边栏目放友情链接和网页的一些小栏目，中间是网站的四个核心内容栏目，右边栏目放新闻更新和公司简介，网页底部放版权信息。网页内容作为一种版面，既要有文字，又要有图片；文字有大小、标题和正文之分等网页构成画面的对比，在网页排版的时候充分考虑网站的定位，突出表现网站的主体内容。AZE设计工作室网站是个多页面站点，页面的编排设计要求把页面之间的有机联系反映出来，特别要处理好页面之间和页面内的秩序与内容的关系。为了达到最佳的视觉表现效果，设计中应利用各组成部分在内容上的内在联系和表现形式上的相互呼应，并注意整个页面设计风格的一致性，实现视觉上和心理上的连贯，使整个页面设计的各个部分极为融洽，布局的合理，让浏览者有一个流畅的视觉体验。（三）网页色彩搭配色彩是艺术表现的要素之一。在网页设计中，根据和谐、均衡和重点突出的原则，将不同的色彩进行组合、搭配来构成符合审美要求的页面。根据色彩对人们心理的影响，合理地加以运用。不同的颜色也代表着不同的行业诉求。(例如：医院和环保部门会选择绿色，而公共事业机构则会选择蓝色等)因此在设计之初要充分考虑该网站的性质及访问对象，以此来确认

9、网页的色彩搭配形式。当主题色确定好以后，考虑其它配色时，一定要考虑其它配色与主题色的关系，要体现什么样的效果。“色彩总的应用原则是:总体协调，局部对比。网页的整体色彩效果应该是和谐的，只有局部的、小范围的地方可以有一些强烈色彩的对比。”高永子、卢坚、潘星亮著，网页经典配色与设计手册，中国青年出版社，2006年第7期，第56页。在色彩的运用上，可以根据主页内容的需要，分别采用不同的主色调。色彩还具有明显的心理感觉，例如冷、暖的感觉，进、退的效果等。另外，色彩还有民族性，各个民族由于环境、文化、传统等因素的影响，对于色彩的喜好也存在着较大的差异。充分运用色彩的这些特性，可以使我们的主页具有深刻的艺术内涵，从而提升网页的文化品位。AZE设计工作室网站是一个艺术设计类型的网站，在色彩运用方面要凸显行业特色的同时更要独具特色，通过对网站的策划和内容规划，网站主要分四个小站分别表现四个设计行业，在把握好每个小站色彩整体性又要有所区别，动画设计页用蓝紫色调，网站设计页用蓝色调，墙体手绘页用黄绿色调，CG培训页用绿色调，主页采用灰色调把四个小站统一起来。下面是网站设计中用到的几种调色方案：单色方案、相似色方案、对比色方案。1.单色方案单色方案是指在网站设计中使用一种基本颜色，为避免单调，可以通过调整这种基本颜色的灰度和亮度来得到更多的颜色，由于整个颜色方案中事实上只有一种基色，因此这种方案称为单色方案。例如：在Photoshop的色彩选择窗口中，我们可以这样进行建立单色方案。首先调整H（也就是Hue的缩写）后面的值来调整色调。注意，H的单位是度，也就是基本颜色在颜色环上所处位置的角度。设置好H的值之后，再调整B后面的数字调整亮度以及S后面的数字调整饱和度。注意

《网页设计与制作的具体流程》由会员luobi****88888分享，可在线阅读，更多相关《网页设计与制作的具体流程》请在金锄头文库上搜索。