第五章-电子商务网站图像处理技术PPT课件

1 电子商务网站图像处理技术 不学习PhotoshopCS就无法独立建设电子商务网站 我们没有必要全面学习 我们应该站在应用的角度上学习 即可胜任电子商务网站制作的全部需要 第5章 第一节PhotoshopCS使用速成 第二节网页常用图像处理 第三节网站版面制作实例 第五章电子商务网站图像处理技术 一 PhotoshopCS工作环境 进入AdobePhotoshopCS 系统后会出现如图 在 欢迎屏幕 窗口中单击按钮 将 欢迎屏幕 窗口关闭 此时所显示的是PhotoshopCS软件的工作界面 PhotoshopCS软件的工作界面主要包括 菜单栏 属性栏 工作区 控制调板 状态栏 工具箱 标题栏 二 PhotoshopCS图像文件的处理 1 图像文件的创建 2 图像的打开与保存 文件 新建 命令 Ctrl N 图像文件的打开 执行菜单栏中的 文件 打开 命令 Ctrl O 图像文件的保存 执行菜单栏中的 文件 存储 命令 Ctrl S 三 PhotoshopCS图层的应用 1 2 3 4 7 6 8 5 9 图层 调板 图层的概述 图层的功能及效果 图层的分类 图层创建及删除 调节图层顺序 图层的编辑 创建图层组 创建剪贴蒙版 10 对齐和分布图层 应用提醒 1 网站版面设计使用的分辨率为72像素 英寸 2 网站版面设计色彩模式为RGB 网站版面设计中以像素为单位 3 新建图层Ctrl Alt Shift N不出现对话框 在图层调板中自动生成透明图层 本节所介绍的PhotoshopCS是做版面设计不可缺少的 要快速的制作网站那你就必需熟练的运用以下的快捷键 1 新建图层 Ctrl Alt Shift N 2 矩形选区描边 Alt E S 3 重新选择 4 反向选择 5 通过拷贝建立一个图层 6 盖印可见图层 7 调整当前图层的透明度小键盘的 8 自动调整色阶 Ctrl Shift D Ctrl Shift I Ctrl J Ctrl Alt Shift E 0 至 9 Ctrl Shift L 案例 PhotoshopCS精细制作网站的导航条 制作步骤 新建立文件500px 50px 分辨率72ppi 制作480px 530px的一个选区 执行 选择 修改 平滑 设置半径为2px 创建一个新图层 填充选择为任何颜色 在如图所示的 应用图层样式 设置渐变颜色为 313332 到 46474a 描边颜色为 676767 选择 导航 上部的 选取 新建一个图层 从上到下用白色到透明进行渐变填充 图层模式改为线性减淡 不透明度35 效果如图所示 新建图层 使用单行选框工具在上部选择1px区域填充为白色 改变图层混合模式为柔光 不透明度为60 下面添加一个按钮 创建一个130px 524px选区 然后 选择 修改 平滑 设置半径为2px 方法同上 步 效果如图5 23所示 添加字符 字体为宋体 字号12点 白色 在文字中间添加分隔线 创建新层 使用单列选框工具选择区域 填充颜色为 1a1b1c 向右移动选区1px再次填充为 5d5f60 再向右移动1px填充为 232526 用20px柔笔刷擦除上下的部分 图层不透明度设置为50 效果如图所示 训练内容 制作5种不同风格的网站导航条 训练目的 1 熟悉软件的操作 2 了解网站导航条的制作过程和网站内容 训练要求 1 用文字说明制作的网站类型 录入网站导航的链接文字 2 统一尺寸 800px 530px 3 文字说明制作感言 第一节PhotoshopCS使用速成 第二节网页常用图像处理 第三节网站版面制作实例 第五章电子商务网站图像处理技术 PhotoshopCS功能强大 工具众多 初次学习 如入云山雾海 但网站页面制作中常用的功能并不多 也非常容易学习 本节将以案例导航的方式将网站设计常用的图像处理一网打尽 并将对网页制作常用的图像处理技术 以案例的方式进行全面讲解 一 头部常用图像处理实例 二 导航 常用图像处理实例 三 栏目常用图像处理实例 四 网站背景图像处理实例 五 链接常用图像处理实例 将所选文本的文字大小减小2点像素 Ctrl Shift 将所选文本的文字大小减小10点像素 Ctrl Alt Shift 将行距减小2点像素 Alt 将行距增大2点像素 Alt 将基线位移减小2点像素 Shift Alt 将基线位移增加2点像素 Shift Alt Google 标志的制作 网站图像制作实例 训练内容 制作5个不同风格的栏目和5个热链接按钮 训练目的 1 了解网站的整体构成 2 熟练运用Photoshop各种工具 训练要求 1 可以临摹 但