边做边学——Photoshop CS3图像制作案例教程 教学课件 作者 魏哲 08.ppt

《边做边学——Photoshop CS3图像制作案例教程 教学课件 作者 魏哲 08.ppt》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、第8章　网页设计本章简介：一个优秀的网站必定有着独具特色的网页设计，漂亮的网页页面能够吸引浏览者的注意力。设计网页时要根据网络的特殊性对页面进行精心的设计和编排。本章以制作多个类型的网页为例，介绍网页的设计方法和制作技巧。课堂学习目标掌握网页的设计思路和表现手法掌握网页的制作方法和技巧8.1制作科技网页案例分析设计理念操作步骤相关工具8.1.1案例分析本例是为科技公司设计制作的网页，网页的主要服务受众是对现代科技进步感兴趣的网友。网页在设计风格上要体现出现代感和科技感，通过科技元素和图形化的语言表现出科技的独特魅力。8.1.2设计理念

2、在设计制作过程中，通过放置在页面上方的深蓝色块的导航条，方便爱好者的浏览，通过格状底图展示出设计的科技感，通过地球图形和图片展示出网页的全球化和信息化，通过科技图片和文字展示最新的科技动态，从而使访问者更加快捷方便地浏览。整体页面大方直观，简洁明了。科技网页图8.1.3操作步骤12348.1.4相关工具1．图像尺寸的调整打开一幅图像，选择“图像>图像大小”命令，弹出“图像大小”对话框，如图所示。“图像大小”对话框2．画布尺寸的调整图像画布尺寸的大小是指当前图像周围的工作空间的大小。选择“图像>画布大小”命令，弹出“画布大小”对话框，如

3、图所示。“画面大小”对话框8.1.5实战演练-制作国粹艺术网页使用自定形状工具制作背景装饰图形，使用图层样式命令制作图片的装饰效果，使用钢笔工具和横排文字工具制作介绍性文字，使用横排文字工具和图层样式命令制作导航文字。国粹艺术网页图8.2制作电子产品网页案例分析设计理念操作步骤相关工具8.2.1案例分析本例是为电子厂商设计制作的产品宣传网页，网页主要服务的受众是喜欢使用电子产品的消费者。网页在设计风格上要突出重点、简洁直观、易于浏览。8.2.2设计理念在设计制作过程中，使用内敛的灰色和亮眼的橘红色形成鲜明的对比，烘托出网页的现代和时尚

4、感，使用块状划分将菜单和产品图片分离，简洁直观、便于操作，使用不同的文字块构成不同的网页区域，使读者易于浏览。整体设计科技感和专业性较强。电子产品网页图8.2.3操作步骤3128.2.4相关工具1．路径控制面板绘制一条路径，再选择“窗口>路径”命令，调出“路径”控制面板，如图所示。单击“路径”控制面板右上方的图标，弹出下拉菜单。“路径”对话框路径下拉菜单2．新建路径使用控制面板的弹出式菜单：单击“路径”控制面板右上方的图标，弹出其下拉菜单，在其中选择“新建路径”命令，弹出“新建路径”对话框。“新建路径”对话框3．复制路径使用菜单命令：

5、单击“路径”控制面板右上方的图标，弹出其下拉菜单，选择“复制路径”命令，弹出“复制路径”对话框，如图所示。在“名称”文本框中输入复制路径的名称，单击“确定”按钮，“路径”控制面板。“复制路径”对话框4．删除路径使用菜单命令：单击“路径”控制面板右上方的图标，弹出其下拉菜单，选择“删除路径”命令，将路径删除。使用面板按钮：在“路径”控制面板中选择需要删除的路径，单击面板下方的“删除当前路径”按钮，将选择的路径删除。5．重命名路径双击“路径”控制面板中的路径名，出现重命名路径文本框，如图8-103所示，更改名称后按Enter键确认即可，如

6、图所示。重命名路径示意图6．路径选择工具选择“路径选择”工具或反复按Shift+A组合键，其属性栏如图所示。“路径选择”工具属性栏7．直接选择工具直接选择工具用于移动路径中的锚点或线段，还可以调整手柄和控制点。8．矢量蒙版选择“自定形状”工具，在属性栏中选中“路径”按钮，在形状选择面板中选中“红桃”图形，如图所示。“矢量蒙版”属性栏8.2.5实战演练-制作流行音乐网页使用渐变工具、矩形工具和圆角矩形工具绘制底图，使用圆角矩形工具、渐变工具和内阴影命令制作宣传板底图，使用自定形状工具和图层面板绘制装饰花图形，使用文字工具输入宣传文字。流

7、行音乐网页图8.3制作宠物医院网页案例分析设计理念操作步骤相关工具8.3.1案例分析本例是为星级宠物医院设计制作的网站首页，星级宠物医院主要服务的对象是被主人饲养的用于玩赏的动物。在网页的设计上希望能表现出公司的服务范围，展现出轻松活泼、爱护动物、保护动物的医院理念。8.3.2设计理念在设计制作过程中，通过绿色背景寓意动物、自然与人的和谐关系，通过添加图案花纹增加网页页面的活泼感。导航栏通过使用不同的宠物图片和绕排文字来介绍医院的服务对象和服务范围，从而使页面直观准确而又灵活多变。标牌设计表现出医院温馨庄重的工作态度。整体设计轻松明快

8、，布局合理清晰。宠物医院网页图8.3.3操作步骤34128.3.4相关工具1．图层组单击“图层”控制面板右上方的图标，在弹出的下拉菜单中选择“新建组”命令，弹出“新建组”对话框，单击“确定”按钮，即可新建一个图层组。选中