创意：photoshop+cs5网页设计与配色实战攻略it168文库.docVIP

01 Photoshop CS5网页设计 网页是图像与图像、图像与文字以及图像与图 案之间的组合，网站是展现企业形象、介绍产品和服 务、体现企业发展战略的重要途径。虽然网页设计也 是平面设计的一个方面，但是网页设计有其独特的设 计要求与原则，在设计网页之前要对其有所了解。 在设计网页的软件中，Adobe公司的Photoshop中 具有许多能让用户把图像有效地保存为Web格式的特 性。Photoshop集图像设计、扫描、编辑、合成以及高 品质输出功能于一身，在使用Photoshop设计网页时， 要根据网页的特点，有机地结合Photoshop中的相关工 具和命令。 Photoshop CS5 +：Photoshop CS5网页设计与配色实战攻略 创意 创意 +：Photoshop CS5网页设计与配色实战攻略 1.1　网页界面的构成要素 网页是通过视觉元素的引人注目而实现信息内容的传达的，为了使网页获得最大的视觉传达 功能，使网络真正成为可读性强而且新颖的媒体，网页的设计必须适应人们视觉流向的心理和生 理特点，并由此确定各种视觉构成元素之间的关系和秩序。 1．网页显示尺寸 网页在屏幕上显示的页面尺寸和显示器大小及分辨率有关系，网页的局限性在于网页无法突破 显示器的范围，而且浏览器本身也将占去不少空间，因此留给网页的页面范围变得越来越小。 一般来说，当显示器分辨率为1024×768时，页面的显示尺寸为1002×600像素；当显示器分辨 率为800×600时，页面的显示尺寸为780×428像素，如图1-1所示。从以上数据可以看出，分辨率 越高页面的尺寸就越大。 1024×768 800×600 图1-1 不同分辨率下的网页显示 提示 浏览器的工具栏也是影响页面尺寸的因素。目前一般的浏览器的工具栏都可以取消或者增加，那么当显 示全部工具栏和关闭全部工具栏时，页面的尺寸是不一样的。 2．网页中的五大元素 了解网页中的基本元素，可使浏览者对网页中各部分内容的安排有总体认识。在网页设计 过程中，向下拖动页面是唯一给网页增加更多内容的方法。但是除非站点的内容能够吸引大家拖 动，否则不要让访问者拖动页面超过三屏高。如果需要在同一页面显示超过三屏的内容，那么最 好能在上面做上页面内部连接，方便访问者浏览。另外还需要考虑到网页元素——图片、文本、 多媒体，以及页眉和页脚等，如图1-2所示。 页眉 又可称之为页头，其作用是定义页面的主题。比如一个站点的名字多数都显示在页眉 里，这样，访问者能很快了解该网页的主要内容。在页眉部分通常放置站点名字、图片和公 司标志以及旗帜广告。 文本 在页面中文本多数是以行或者块（段落）出现的，它们的摆放位置决定着整个页面布 局的可视性。随着DHTML（动态HTML）的普及，文本、段落已经可以通过层的概念按要求放置 到页面的任何位置。 页脚 是指在页面最下方的一块空间，它和页眉相呼应。页眉是放置站点主题和标识的地 方，而页脚则通常是放置制作者、公司相关信息、版权的地方，有时候，还会放置一个导 航栏。 2 PHOTOSHOP 01 第1章 Photoshop CS5网页设计 PHOTOSHOP 图1-2 网页中的基本元素 图片 图片和文本是网页的两大构成核心，缺一不可。如何处理好图片和文本的排列放置关 系成了整个页面布局的关键。 多媒体 除了文本和图片，还有声音、动画、视频等其他媒体。虽然它们不经常被利用，但 随着动态网页的兴起，它们在网页布局上也将变得更重要。 1.2　网页设计的审美需求 人们对美的追求是不断提高的，网页设计同样如此。为使受众能更好地、更有效率地接收网 页上的信息，这就需要从审美的方面入手。网页设计的审美需求是对平面视觉传达设计美学的一 种继承和延伸，两者的表现形式和目的都有一定的相似性。把传统平面设计中美的形式规律同现 代网页设计的具体问题结合起来，运用一些平面设计中美的基本形式到网页中去，可以增加网页 的美感和大众的视觉审美需求。 首先，网页的内容与形式的表现必须统一和具有秩序，形式表现必须服从内容要求，网页上 各种构成要素之间的视觉流程，能自然而有序地达到信息诉求的重点位置。在把大量的信息放到 网页上的时候，要考虑怎样把它们以合理、统一的方式排列，使整体感强的同时又要有变化，如 图1-3所示。 图1-3 网页内容与形式的统一 3 PHOTOSHOP +：Photoshop CS5网页设计与配色实战攻略 创意 创意 +：Photoshop CS5网页设计与配色实战攻略 其次，网页要突出主题要素，必须在众多构成要素中突出一个清楚的主体，它应尽可能地 成为阅读时视线流动的起点，如图1-4所示。如果没有这个主体要素，浏览者的视线将会无所适 从，或者导致视线流动