摄影网站首页.摄影网站首页

摄影网站首页设计制作摄影网站首页设计制作8.4【任务22】摄影网站首页设计

网站首页是网站整体形象的浓缩，它直接决定了客户是继续深入访问还是要直接跳出。所以在进行网页设计时，不仅要把握好色彩与图片的关系，更要合理安排每一个栏目的内容版块。

本任务将设计一款关于婚纱摄影的网站首页。通过本任务的学习，读者可以掌握亮度/对比度、曝光度、色阶等对图像颜色调整的基本操作。

巴黎婚纱摄影馆以其流畅的空间，极富艺术性的陈列，清丽典雅的组合，独特、宁静、简约的设计风格，创造五星级的婚纱摄影空间。本次任务是为巴黎婚纱摄影馆设计一个网站首页，公司要求结合公司的特点和理念，设计一个简约大气，时尚潮流的网站首页，同时在首页中要重点突出摄影的质量。8.4.1任务描述8.4【任务22】摄影网站首页设计摄影网站首页设计效果展示8.4【任务22】摄影网站首页设计

在网站首页设计中，排版布局尤其重要。合理的排版布局，可以让整个页面显得整齐有序的。首页的布局基本结构包括：导航栏、Banner、内容和页脚这四部分。为了让制作首页的过程更加流畅，可以对其逐个进行分析：8.4.2任务分析1、导航栏

导航栏起着链接整个网站中的各个子级页面的作用，因此在设计时可以按照客户需求，划分相应的列表项。同时还可以在导航栏中添加公司LOGO，以推广公司的主题和品牌文化。为了使网站更加商业化，还可以在导航栏添加服务热线，以方便客户咨询。LOGO联系电话8.4【任务22】摄影网站首页设计2、Banner

为了符合网页的主色调，可以选用整体以蓝色为主的Banner素材。Banner3、内容

鉴于公司要求重点突出摄影质量，因此可以展示一些处理过的摄影照片。同时通过合理的布局排版和相关的文字修饰，彰显网页的简约大气，富于艺术性的设计风格。4、页脚

最后页脚部分简单注明公司版权即可。8.4【任务22】摄影网站首页设计8.4.3任务制作

8.4【任务22】摄影网站首页设计8.4.4知识点讲解1、亮度/对比度

“亮度/对比度”命令可以快速地调节图像的亮度和对比度。执行“图像→调整→亮度/对比度”命令，弹出“亮度/对比度”对话框。8.4【任务22】知识点讲解“亮度/对比度”对话框1、亮度/对比度

“亮度/对比度”对话框，对其各选项的解释如下：亮度：拖动该滑块，或在文本框中输入数字（-100~100），即可调整图像的明暗。向左拖动滑块，数值显示为负值，图像亮度降低。向右拖动滑块，数值显示为正值，图像亮度增加。对比度：用于调整图像颜色的对比程度。向左拖动滑块，数值显示为负值，图像对比度降低。向右拖动滑块，数值显示为正值，图像对比度增加。使用旧版：新版本对“亮度/对比度”的调整算法进行了改进，能够保留更多的高光和细节。如果需要使用旧版本的算法，可以选择“使用旧版”复选框。8.4【任务22】知识点讲解1、亮度/对比度

执行“图像→调整→亮度/对比度”命令弹出“亮度/对比度”对话框。拖动滑块或在文本框中输入数值（-50~50）即可调整图像的亮度。单击“确定”按钮。原图像“亮度/对比度”对话框调整“亮度”和“对比度”“亮度/对比度”效果8.4【任务22】知识点讲解2、曝光度

拍摄照片时，有时会因为曝光度过度导致图像偏白，或者曝光不足使图像看起来偏暗。使用“曝光度”命令可以使图像的曝光度恢复正常。打开素材图片。执行“图像→调整→曝光度”命令，弹出“曝光度”对话框。原图像“曝光度”对话框8.4【任务22】知识点讲解2、曝光度

对“曝光度”对话框中各选项的解释如下：曝光度：用于设置图像的曝光程度，通过增强或减弱光照强度使图像变亮或变暗。设置正值或向右拖动滑块，可以使图像变亮。设置负值或向左拖动滑块，可以使图像变暗。位移：用于设置阴影或中间调的亮度，取值范围是-0.5~0.5。设置正值或向右拖动滑块，可以使阴影或中间调变亮，但对高光的影响很轻微。灰度系数校正：使用简单的乘方函数来设置图像的灰度系数。可以通过拖动该滑块或在其后面的文本框中输入数值校正照片的灰色系数。8.4【任务22】知识点讲解2、曝光度设置曝光度为1设置曝光度为-18.4【任务22】知识点讲解3、色阶

“色阶”命令是最常用到的调整命令之一。它不仅可以调整图像的阴影、中间调和高光的强度级别，而且还可以校正色调范围和色彩平衡。

执行“图像→调整→色阶”命令（或按【Ctrl+L】组合键），弹出“色阶”对话框。原图像“色阶”对话框8.4【任务22】知识点讲解3、色阶

在“色阶”对话框中，中间的直方图显示了图像的色阶信息。其中，黑色滑块代表图像的暗部，灰色滑块代表图像的中间色调，白色滑块代表图像的亮部。通过拖动黑、灰、白色滑块或输入数值来调整图像的明暗变化。对“色阶”对话框中其他选项的解释如下：（1）通道

在“通道”下拉列表中可以选择一个颜色通道进行调整。例如，在调整RGB图像的色阶时，在“通道”下拉列表中选择“蓝”通道。然后拖动滑块可以对图像中的蓝色进行调整。单击“确定”按钮。8.4【任务22】知识点讲解3、色阶选择“蓝”通道调整图像中的蓝色调整后的效果8.4【任务22】知识点讲解3、色阶（2）输入色阶

“输入色阶”用来调整图像的阴影（左侧滑块）、中间调（中间滑块）和高光区域（右侧滑块），从而提高图像的对比度。拖动滑块或者在滑块下面的文本框中输入数值都可以对图片的输入色阶进行调整。向左拖动滑块，与之对应的图片色调会变亮。向右拖动滑块，则图片色调会变暗。8.4【任务22】知识点讲解3、色阶向左拖动滑块向右拖动滑块图片色调变亮图片色调变暗8.4【任务22】知识点讲解3、色阶（3）输出色阶

“输出色阶”可以限制图像的亮度范围，从而降低对比度，使图像呈现出类似褪色的效果。同样，拖动滑块或者在滑块下面的文本框中输入数值，都可以对图片的输出色阶进行调整。单击“确定”按钮。拖动滑块调整后的图片效果8.4【任务22】知识点讲解4、反相

“反相”命令用于反转图像的颜色和色调，可以将一张正片黑白图像转换为负片，产生类似照片底片的效果。执行“图像→调整→反相”命令（或按【Ctrl+I】组合键），将对图像进行“反相”操作。原图像“反相”效果8.4【任务22】知识点讲解5、通道调色

“通道”是一种重要的图像处理方法，它主要用来存储图像的色彩信息。接下来，将对“调色命令与通道的关系”、“颜色通道”及“通道调色”进行具体讲解。（1）调色命令与通道的关系

图像的颜色信息保存在通道中，因此，使用任何一个调色命令调整颜色时，都是通过通道来影响色彩的。使用“色相/饱和度”命令调整它的整体颜色时，可以看到红、绿、蓝通道都发生了改变。8.4【任务22】知识点讲解5、通道调色RGB文件通道发生改变

由此可见，使用调色命令调整图像颜色时，其实是Photoshop在内部处理颜色通道，使之变亮或者变暗，从而实现色彩的变化。8.4【任务22】知识点讲解5、通道调色（2）颜色通道

颜色通道就像是摄影胶片，它们记录了图像内容和颜色信息。图像的颜色模式不同，颜色通道的数量也不相同。RGB图像包含红、绿、蓝和一个用于编辑图像内容的复合通道。CMYK图像包含青色、洋红、黄色、黑色和一个复合通道。RGB图像通道CMYK图像通道8.4【任务22】知识点讲解5、通道调色（3）通道调色

在颜色通道中，灰色代表了一种颜色的含量，明亮的区域表示大量对应的颜色，暗的区域表示对应的颜色较少。如果要在图像中增加某种颜色，可以将相应的通道调亮；要减少某种颜色，将相应的通道调暗即可。

“色彩”和“曲线”对话框中都包含通道选项，可以从中选择一个通道，调亮它的明度，从而影响颜色。具体操作如下：

按【Ctrl+M】组合键，弹出“曲线”对话框。在“通道”下拉列表中选择“红”，将红色通道调亮。单击“确定”