《Photoshop》课件-网页设计基础应用

Photoshop网页设计基础应用网页是图像与图像、图像与文字以及图像与图案之间的组合，网站是展现企业形象、介绍产品和服务、体现企业发展战略的重要途径。虽然网页设计也是平面设计的一个方面，但是网页设计有其独特的设计要求与原则，在设计网页之前要对其有所了解。在设计网页的软件中，Photoshop具有许多功能让用户把图像有效地保存为Web格式的特性。Photoshop集图像设计、扫描、编辑、合成以及高品质输出功能于一身，在使用Photoshop设计网页时，要根据网页的特点，有机地结合Photoshop中的相关工具和命令。2Photoshop网页设计基础引入其次，网页要突出主题要素，必须在众多构成要素中突出一个清楚的主体，它尽可能地成为阅读时视线流动的起点。网页已成为信息交流的一个非常有影响的途径，所以网页在一定意义上也是一种艺术品，因为它既要求文字的优美流畅，又要求页面的新颖、整洁、而色彩的应用可以产生强烈的视觉效果，使页面更加生动。Photoshop网页设计基础引入网页制作包括哪些工作呢？主要包括：网站的选题，内容采集整理，图片的处理，页面的排版设置，背景及其整套网页的色调等。Photoshop网页设计基础引入选择菜单命令“文件→存储为Web所用格式”，弹出“存储为Web所用格式”对话框，使用“存储为Web所用格式”对话框可选择优化选项并预览经过优化的图片。设置完成后单击“存储”按钮，弹出“将优化效果存储为”对话框，在对话框中的“保存类型”选项中，有以下三个选项：·HTML和图像生成一个HTML文件和对应于图片中每个切片的图像文件。HTML文件包括文档中任何链接、图像映射和其他效果的代码。所有切片的图像文件存放在自动创建的images文件夹中。·仅限图像以指定的优化设置存储图片。如果图片包含多个切片，则每个切片将存储为一个单独的文件。·仅限HTML生成HTML文件但不存储任何图像文件。存储为Web所用格式图像调整命令

1.首页首页是指一个网站的主索引页，是了解网站概貌并引导查阅重点内容的向导。一般默认文件名为：index.htm或index.html等。2.页面尺寸页面尺寸和显示器大小及分辨率有关系，页面标准为800*600分辨率，按778*434像素制作，页面标准1024*768分辨率，按1003x600像素制作。页面长度原则上不超过3屏，宽度不超过1屏。3.BannerBanner叫旗帜广告或横幅广告，还有多种称呼，如全幅广告、条幅广告等。通常采用图片、动画、Flash等方式来制作。一般放在网页的上方，以吸引访问者浏览和点击，也可以放置在网页上的不同位置，在用户浏览网页信息的同时，吸引用户对于广告信息的关注。4.网站的标准色彩标准色彩是指能体现网站形象和延伸内涵的色彩。一个网站的标准色彩一般不超过3种。标准色彩要用于网站的标志，标题，主菜单和主色块。给人以整体统一的感觉。网页制作基本知识

1．标题标题用来提示页面的主要内容，这一信息将出现在浏览器的标题栏中，它的作用就是引导访问者清楚地浏览网站的各项内容。2．标志（Logo）网站的标志（Logo），就是站点的标志图案，一般会出现在站点的每一个页面上，是网站给人的第一印象。这如同一个产品的商标，集中体现了该网站的特色、内容及其内在的文化内涵和理念，标志的作用最重要的就是表达网站的理念、便于人们识别，广泛用于站点的连接、宣传等。目前网站的标志有三种规格：88*31、120*60、120*90。网站标志的设计(Logo)最简单的方式可以用网站的英文名称作标志，采用不同的字体或字母的变形和字母的组合制作标志。可以是网站有代表性的人物、动物、花草等，以此作为设计的蓝本，再进行卡通化或艺术；也可以是用有代表的物品作为标志。网页组成的要素3．页眉页眉指的是页面上端的部分，大多数网站在页眉位置设置网站宗旨、宣传口号、广告语等。4．页脚页脚是页面底端部分，通常用来显示站点所属公司（社团）的名称、地址、版权信息、电子信箱的超连接等。5．导航导航是网页设计中的重要部分。一般网站的导航位置在每个页面中出现的位置是固定的。导航一般有四种位置：左侧、右侧、顶部和底部。有的站点为了增加页面的可访问性，运用了多种导航。6．主体内容主体内容是页面设计的主体元素。它一般是二级连接内容的标题，或者是内容提要，或者是内容的部分摘录。表现手法一般是文字和图像相结合。它的布局通常按内容的分类进行分栏安排。页面的注意力值一般是按照从上到下、从左到右的顺序排列，所以重要的内容一般安排在页面的做上位置，次要的内容安排在右下方。网页组成的要素选择菜单“文件→自动→Web照片画廊”命令，可以依据一组图像自动生成Web照片画廊。Web照片画廊是一个Web站点，它包含一个缩览图图像的主页和若干包含源图像的画廊页。每页都包含链接，当访问者单击主页上的缩览图图像时，就会链接到对应的源图像的画廊页。创建Web照片画廊平面设计的元素1．概念元素概念元素是那些实际不存在的，不可见的，但人们的意识又能感觉到的东西。例如，我们看到尖角的图形，感到上面有点，物体的轮廓上有边缘线。概念元素包括点、线、面。2．视觉元素概念元素不在实际的设计中加以体现，它将是没有意义的。概念元素通常是通过视觉元素体现的，视觉元素包括图形的大小、形状、色彩等。3．关系元素视觉元素在画面上如何组织、排列，是由关系元素决定的，包括方向、位置、空间、重心等。4．实用元素实用元素指设计所表达的含义、内容、设计的目的及功能。平面构成的形式1．组形基本形状之间的组合，可以有分离、接触、复叠、透叠、结合、减却、差叠和重合8种形式。2．渐变渐变是一种视觉效果，如近大远小、近疏远密等。渐变有形状的渐变、方向的渐变、位置的渐变、大小的渐变、色彩的渐变等。3．重复重复是指在同一设计中，相同的形象出现过两次以上，造成有规律的节奏感，使画面统一。重复的类型有形状重复、大小重复、色彩重复、肌理重复、方向重复等。4．发射发射是一种常见的自然现象，如太阳光芒。发射具有方向的规律性，发射中心为最重要的视觉焦点，所有的形象均向中心集中，或由中心散开，有强烈的视觉效果。发射的分类有中心点发射、螺旋式发射和同心式发射。平面构成的形式5．近似近似指的是在形状、大小、色彩、肌理等方面有着共同特征，它表现了在统一中呈现生动变化的效果。近似的程度可大可小，如果近似的程度大就产生了重复感，近似程度小就会破坏统一。近似与渐变的区别：渐变的变化是规律性很强的，基本形排列非常严谨，而近似的变化规律性不强，基本和其他视觉要素的变化较大，也比较活泼。6．对比自然界充满了对比，如红花与绿叶。对比可产生明朗、肯定、强烈的视觉效果，给人深刻的印象。在构成对比的关系上，包括大小、明暗、锐钝、轻重等。对比有形状的对比、大小的对比、色彩的对比、肌理的对比、位置的对比、重心的对比、空间的对比和虚实的对比。平面构成的形式还有特异构成、空间构成、密集构成、肌理构成、分割构成等。

网页中的文字不仅是网站信息传达的主要媒介，也是网页中必不可少的重要视觉艺术传达方式。在Photoshop中可以通过各种工具、滤镜功能、图层样式功能、或将滤镜与图层样式相结合、将通道与滤镜等功能相结合、制作多种文字特效。在设计网页时，合理添加艺术文字，不仅可以突出文字主体，强调重点，更能体现出页面的艺术性。当然，再恰到好处地使用色彩，协调好审美的需要，能够使信息更加清楚明确、网页的视觉感受更加新颖独特。特效文字在网页中的应用特效文字在网页中的应用网络信息通常是通过文本、图像、Flash动画等呈现的，其中文本是网页中最为重要的设计元素，而特效文字在网页中占有重要的地位，相对于