风景区网页制作.doc

风景区网页制作本实例的风景区网页页面，是对风景区的图片进行编辑修饰后，设计制作成类似于国画的画面效果，设计新颖，充满艺术气息。页面下半部分的空白，也是页面设计不可忽视的重要部分，使得在浏览信息的间隙，视觉得到适当的放松和调节。并且以虚衬托实的表现手法，可以获得更佳的视觉效果产生更加深刻的视觉印象。如图9-47所示，为本实例的完成效果。图9-47 本实例完成效果技术提示在本实例的制作中由于所介绍的景点在中国境内，所以在设计风格上要显示出东方的特色，以及中国古老的传统文化，因此将画面效果制作成类似国画的风格，黄色调的运用营造出祥和，美好的特点。另外，网页的主要作用是传达，在页面上结合风景来进行文字说明，图文并茂，可以使人们在浏览的过程能够快捷的了解最新信息。如图9-48所示，为本实例的制作流程。图9-48 本实例制作流程制作步骤（1）启动Photoshop，执行“文件”“新建”命令，参照图9-49所示对打开的“新建”对话框进行设置，创建出一个名为“风景区网页”空白文档。图9-49 新建文档（2）设置前景色为灰褐色（R211、G200、B171），按下键，使用前景色填充背景。然后在“图层”调板中，新建“图层 1”，使用“矩形选框”工具，在视图中绘制选区。如图9-50所示。 图9-50 绘制选区（3）设置前景色为黑色（R20、G22、B16），选择工具箱中的“画笔”工具，参照图9-51所示设置选项栏，然后在选区内绘制图像。图9-51 绘制图像（4）按下键，取消选区，单击“图层”调板底部的“创建新的填充或调整图层”按钮，在弹出的菜单中执行“色相/饱和度”命令，参照图9-52所示设置对话框，对图像色调进行调整。提示：使用色相/饱和度命令来调整图像的色调很直观，并且在调整的过程中可以不断的与背景颜色进行比较。图9-52 调整图像色调（5）执行“文件”“打开”命令，打开本书附带光盘Chapter-09“天空.jpg”文件，使用“移动”工具，将该文档中的天空图像拖动到“风景区网页”文档中的相应位置，在“图层”调板中，生成“图层 2”，如图9-53所示。图9-53 添加素材图像（6）将“图层 2”的混合模式设置为“颜色加深”，效果如图9-54所示。图9-54 设置图层混合模式（7）在“图层”调板中，新建“图层 3”，设置前景色为墨绿色（R89、G102、B71），使用工具箱中的“直线”工具，在视图中配合键，绘制两条垂直直线，如图9-55所示。 图9-55 绘制直线（8）执行“文件”“打开”命令，打开本书附带光盘Chapter-09“山水风景.jpg”文件，然后将该素材图像拷贝到“风景区网页”文档中，并调整图像的大小和位置，如图9-56所示。图9-56 添加素材图像（9）选择工具箱中的“多边形套索”工具，在视图中绘制选区，将部分图像选取。如图9-57所示。图9-57 创建选区提示：为方便读者观察选区状态，图9-10中特意将素材图像的透明度降低了一些。（10）确定图像所在“图层4”为当前可编辑状态，单击“图层”调板底部的“添加图层蒙版”按钮，为“图层 4”添加图层蒙版，将选区以外的图像遮盖。如图9-58所示。 图9-58 添加图层蒙版（11）接下来打开本书附带光盘Chapter-09“树林.jpg”文件，将该文档中的图像复制到“风景区网页”文档中，在“图层”调板中，生成“图层 5”，然后参照图9-59所示对图像的大小和位置进行调整。图9-59 添加素材图像（12）确定树林图像所在“图层 5”为当前可编辑状态，选择工具箱中的“仿制图章”工具，配合按下键，在树林图像上单击，定义取样点，然后松开键，在视图的相应位置单击，对图像进行修补，如图9-60所示。 图9-60 修补图像（12）单击“图层”调板底部的“添加图层蒙版”按钮，为“图层 5”添加图层蒙版，参照图9-61所示，选择“画笔”工具，并对工具选项栏进行设置，然后对添加的蒙版进行编辑。图9-61 编辑蒙版（13）在“图层”调板中，配合键，将“图层 5”和“图层 4”同进选中，按下键，将两个图层合并为一个图层，如图9-62所示。提示：将带有蒙版效果的两个图层合并后变为没有蒙版效果的普通图层，合并后若想恢复以前的状态会特别麻烦，因此在执行合并命令前要慎重考虑。 图9-62 合并图层（14）按下键，执行“自由变换”命令，将图像压扁一些。配合使用工具箱中的“加深”和“减淡”工具，对图像进行处理。效果如图9-63所示。图9-63 调整并处理图像（15）使用“直线”工具，在图像的左下侧再绘制一些深绿色（R30、G36、B23）直线，然后使用“橡皮擦”工具，对直线图像进行处理，制作出如图9-64所示的图像效果。提示：根据画面效果调节橡皮擦笔刷的形状、大小和不透明参数，使最后的效果好象干画笔绘制出的效果。图9-64 绘制直线图像 （16）将“图层 5”的混合模式设置为“正片叠底”，然后按下键的同时单击该图层前的图层缩览图，将图层中的图像作为选区载入，如图9-65所示。图9-65 设置图层混合模式并创建选区（17）单击“图层”调板底部的“创建新的填充或调整图层”按钮，在弹出的菜单中执行“亮度/对比度”命令，参照图9-66所示对打开的对话框进行设置，调整选区内图像的亮度和对比度。图9-66 调整图像（18）将“图层 5”中的图像选区再次载入，然后添加“色相/饱和度 2”调整图层，对选区内图像色调进行调整，如图9-67所示。图9-67 调整图像色调（19）在“图层”调板中，为“图层 2”添加图层蒙版，然后再将“图层 5”中的图像选区载入，确定“图层 2”的蒙版为当前可编辑状态，使用黑色填充选区并取消选区，将相应图像遮盖。如图9-68所示。图9-68 编辑蒙版（20）打开本书附带光盘Chapter-09“图案.psd”文件，然后将该文档中的图像拖动到“风景区网页”文档中的相应位置，并为图像添加“斜面和浮雕”效果，如图9-69所示。图9-69 设置浮雕效果（21）选择工具箱中的“直排文字”工具，参照图9-70所示，在图案上创建文字。提示：某些命令和工具（如滤镜效果和绘画工具）不可用于文字图层。必须在应用命令或使用工具之前栅格化文字。栅格化将文字图层转换为正常图层，但其内容不能再作为文本编辑。图9-70 创建文字（22）单击“图层”调板底部的“添加图层样式”按钮，在弹出的菜单中执行“投影”命令，参照图9-71所示对打开的“图层样式”对话框进行设置，为图像添加图层样式效果。图9-71 为文字添加图层样式（23）打开本书附带光盘Chapter-09“云雾.psd”文件，然后将云雾图像添加“风景区网页”文档中的相应位置，如