资源简介

(共14张PPT)
网页美工设计
情景模拟
网页美工是目前就业市场中很好的职业。小张是某院校的学生，他很希望学好网页美工设计这门课程，以便在毕业时能顺利地找到一份好工作，但却不知道该从哪里入手开始学习。
网页美工是一项技术性和艺术性都很强的工作。要学习网页美工设计，首先需要了解网页美工的岗位职责和所需技能，以及网页美工设计的流程和设计要点，从而有目的地学习。此外，还需要了解网页的版面构成，并通过赏析优秀的网页，对网页美工设计有一个初步的认识，从而为后续学习打下基础。
第一章 网页美工设计基础
了解网页美工
的岗位职责和所需技能
了解网页美工设计
的工作流程和设计要领
了解网页的版面
构成元素及各元素的作用
通过赏析优秀的网页，
了解不同类型网站页面的设计特点
学习
目标
1.1
本节介绍网页美工的岗位职责和所需技能，
以及网页美工设计的流程和要点。
网页美工设计概述
1.1.1认识网页美工1．网页美工的岗位职责（1）配合项目负责人和程序开发人员完成网站（或网店）页面的整体美工创意和网页效果图设计，并对网站（或网店）的优化提出建议。（2）负责公司网站（或网店）栏目的图片设计及更新。（3）配合市场推广及开发人员进行商品专题推广图片和页面的设计。2．网页美工所需技能（1）了解平面设计基础知识，包括色彩构成、平面构成等。（2）了解网站和网页基础知识，包括网站开发流程和网页组成元素等。（3）熟练掌握图像处理软件Photoshop的使用。（4）掌握网页布局、网页各组成元素的设计及网页整体效果图设计等。（5）熟悉各行业促销方式及常用图文。（6）能与客户很好地沟通，了解客户的需求并推荐自己的设计方案。（7）具有坚持学习的习惯，包括了解最新的网页设计理念并将其应用到实践中。1.1.2网页美工设计的流程网页美工设计的流程为：需求分析→网站规划→设计网页效果图→客户反馈→切片与输出，如图1-1所示。图1-1 网页美工设计的流程（1）需求分析。网页美工与项目负责人一起与客户沟通，了解客户的需求，并为客户提供网站建设和网页设计的参考建议。可向客户提供或让客户提供至少2～3个与客户需求同类的参考网站，让客户说明他对这些网站的看法，以便了解客户的意图和品味。对客户需求的细致了解和分析可让网页美工在设计时少走弯路。
小技巧
在与客户沟通过程中，由于个人喜好不同难免会有意见不统一的情况，此时不宜用专业理论或术语进行辩证。比较合理的用语是：“我觉得，您提的想法很不错，只是我觉得……（尽量用对方能听懂的话）这样做的话效果会更好一些。”
（2）网站规划。一个完整的网站应具有色调合理、分类清晰、布局合理、版面美观、内容丰富、重点突出且方便浏览等特点。在设计网页之前，网页美工需要参与网站规划讨论，与相关人员一起确定网站的设计方向，完成网站方案书的制订。在讨论过程中，网页美工需要给出专业性的建议，确定网页的色调、布局等。（3）设计效果图。网页美工根据网站规划收集素材，使用图像处理软件完成网站页面效果图的初步设计并发给客户。设计网页效果图最常用的软件是Photoshop。提 示网页设计素材包括图片、动画、视频、文字等，这些素材可由客户提供或网站制作方自己收集、制作。（4）客户反馈。在客户看了网页效果图后，网页美工需要根据客户提供的建议对设计进行修改，直到客户满意为止。（5）切片与输出。网页效果图定稿后，网页美工要根据网站的制作需要，对网页效果图做切片处理，将其输出为相应格式的单个文件，为网站的前端开发做准备。1.1.3网页美工设计的要点网页设计的最终展示对象是网站的访问者，因此在设计网页时不能“埋头苦干”，而应该换位思考，根据网站的类型和定位，将自己想象成网站的访问者来设计作品。具体来说，网页美工设计的要点如下：（1）色调。色调如同网站的性格，不同类型的网站所使用的主色调是不同的。例如，科技类网站的主色调通常为蓝色、银色或灰色等；针对女性用户网站的主色调通常为粉色、紫色、玫瑰红等。在与客户充分沟通，了解其需求后，选择合适的颜色作为网页色调是网页美工设计的首要任务。（2）版式。根据网站类型设计网页版式时可先忽略细节，而是首先从页面整体出发，根据需求规划各版块区域，并调整各版块的大小比例，使页面中各个版块协调融洽、重点突出、方便浏览，然后再对各版块精心细化。例如，娱乐类网站需要以图片为主导，图片所占比重较大；新闻类网站由于信息量大，应将图片与文字均等分配，图文并茂，方便浏览者阅读。（3）创意。创意是网页设计的灵魂。如果网站页面与同类网站页面大同小异，一般不会为浏览者留下深刻印象。因此，善于思考，敢于别出心裁，多一点独创性才能赢得客户的青睐。平时的积累是产生创意的必要条件，网页美工平时应多留意设计优秀的网页，学习其版面布局和配色方案，取其精华去其糟粕，并时常练习。（4）细节。细节决定成败。网页的一些细节可能会被浏览者忽略，但对设计师来说是绝不可放过的，如背景色、各组件间距、标题样式、图标样式、字体样式、文本间距、插图位置等。在调整页面细节上多下功夫，会使页面更加精致。
课堂互动
据英国《每日邮报》报道，一家互联网公司正致力于收集全世界最差设计网站。令人大跌眼镜的是，在400多个入选网站中，多数居然是由当年的网页高手设计的。图1-2为其中某个网站首页，请尽可能多地指出该网页的问题。
图1-2 指出该网页的设计问题
THANK YOU!

展开更多......

收起↑