设计网页效果图

——以Photoshopcs4为例设计网页效果图全文共15页，当前为第1页。

请选择你目前的或喜欢的职业并记住它的编号（数字），通过以下方式寻找你另一半从事的职业1.医生2.教师3.律师4.网络工程师5.建筑师6.设计师7.网页美工8.警察9.化妆师10.其他另一半从事的职业编号等于所选择的职业编号乘以9得到的数字，个位与十位相加，除以3，最后加4

算好了吗？你另一半从事的职业是？设计网页效果图全文共15页，当前为第2页。网页美工主要负责的工作

P图做各种网络广告图片当然，如果懂一些html,div，css,更好

它的主要工作是设计网页效果图设计网页效果图全文共15页，当前为第3页。1、记录客户的要求与意向如：确定网站的颜色、风格、框架等等。2、向客户索取网站必要文字及图片素材如：LOGO公司介绍产品图片联系方式等等。3、根据素材、客户意向及客户同行类的网站首页，设计出首页效果图。给客户确认，满意之后则进行内页的设计。4、代码实现设计网页效果图全文共15页，当前为第4页。概念：使用Photoshop软件设计出网页的外观，制作网页效果图

设计网页效果图全文共15页，当前为第5页。1、网页宽度常有980px，960px或是950px，760px等2、分辨率数值为72

一般在显示设备上使用的图像文件都设为此值，方便在不同显示设备里能有统一的显示效果。3、字体与字号

一般中文字体使用宋体与黑体，英文可选Arial，Sans1111Serif，Tahoma.12号与14号4、风格统一5、使用psd等可见图层的格式保存设计网页效果图全文共15页，当前为第6页。1、软件Photoshop下，用“素材\图片”文件夹下1.jpg和2.jpg制作图像3.jpg2、软件Photoshop下，用“素材\图片”文件夹下“学校标志.jpg”和“校园风景.jpg”为学院制作简单的logo(例logo.jpg)设计网页效果图全文共15页，当前为第7页。1、图像合成：打开需要合成的图片，单击排列文档工具，选择双联，鼠标拖曳合成2、将图层载入选区：单击图层，选择载入选区3、alt+Delete填充前景色（ctrl+Delete填充背景色)4、图层样式双击图层便可以对图层进行设置设计网页效果图全文共15页，当前为第8页。以用Photoshopcs4制作职业技术师范学院网站的分页为例设计网页效果图全文共15页，当前为第9页。(见word文档：设计步骤.doc)1.设计思路

背景相关设置（以蓝色淡雅为主）,制作logo（美观大方，有校园特色风景等标志）,设计导航栏,设计网页中间部分,设计网页底部2.设计重点

风格统一制作logo3.设计难点

竖直虚线设计网页效果图全文共15页，当前为第10页。1.根据老师的操作演示用Photoshopcs4设计职业技术师范学院分页的网页效果图（如有疑问，请查看“设计步骤.doc”文件的详细设计过程）

或者2.模仿“素材”文件夹下“PS制作网页效果图—漂亮的绿色首页模板.doc”的制作过程设计网页效果图全文共15页，当前为第11页。界面设计（50）1.版面设计和谐美观，布局合理，导航清晰简捷，各页面内容符合实际，满足需求2.文字清晰、字体设计恰当、色彩搭配合理协调、风格统一，视觉效果好，符合视觉心理3.页面的设计和布局提供了很好的导向作用4.版面设计清晰，容易理解创造性（30）原创性(15)1.图标、图片设计有较多的原创成分创新性(15)2.版面和界面设计有新意加分（20）整体效果加分(10)1.UI层整体风格,立意新颖、构思独特，设计巧妙，具有想像力和表现力创新创意加分(10)2.作品素材原创成分达80%，具有鲜明的个性，创意新颖设计网页效果图全文共15页，当前为第12页。设计网页效果图

1.

概念

2.

注意事项

3.以实例讲解并演示了具体的设计过程

4.

巩固练习

5.

评估网页美工网站设计的一般流程设计网页效果图全文共15页，当前为第13页。1、

关键字：960网格

SEO2、软件Photoshop下，自命主题，制作一组（首页，内容页不小于1页）网页效果图3、

预习课本第二课：Web标准不是神话

a.Web标准是什么

b.为什么选择Web标准