浅析photoshop在网站群中应用.docVIP

浅析photoshop在网站群中应用 　　摘 要：Photoshop作为图像处理软件，在各行业中已经有了广泛的应用，在网页制作中也有广泛的应用。本文主要介绍了Photoshop在网站群中制作网页的方法和技巧。 　　关键词：Photoshop；网站群；Web 　　0 引言 　　Photoshop是一个专业的图像处理软件，具有强大的图像处理功能，能够对各种图像文件进行精细的处理，可以用于平面设计、广告设计、数码摄影的处理，也可以用于网页的制作。设计一个整体效果协调、有创意、有个性，吸引浏览者视线的网页，是网页设计者所追求的目标，同时也使得网页的设计方法也越来越多，本文将以网页制作为主题，介绍Photoshop如何结合网站群技术，实现网页的制作。 　　1 网页的结构布局 　　一般情况下一个网页版面有：网站Logo图区、导航区、正文区、说明区等，版面布局是网页设计的框架，在整个网页设计过程中起到灵魂的作用，规划和确定网站Logo图区、导航区、正文区、说明区的位置，使网站的文字、图片和动画和谐完美地搭配一起，让网页在更好地传递信息的同时，也具有赏心悦目的视觉效果，下面分别论述几种比较常用的网页布局。 　　1）“国字”型布局：因布局结构与“国”字相似，采用上中下模式，网页顶部也即网页的Logo图区和导航栏区，一般放置网页的Logo标志和导航栏、Banner广告，网页中间放置网页的内容信息和图片资料，网页底部放置网页的版权信息、联系方式等，是比较受大中型企业欢迎网页布局模式。 　　2）左右框架型：是一种左右分割的网页框架结构，一般左面是导航链接，有时最上面会有一个标题或标志，右面是正文，大部分的大型论坛是采用这种结构，有些企业网站也喜欢采用这种结构。 　　3）T型布局：页面顶部放置网站的Logo标志或Banner广告，网页的左下侧放置导航链接栏、右下侧放置网页的正文内容；网页底部放置一些辅助信息。 　　4）封面型布局：页面以一些精美的平面设计结合一些动画为主体，放上一些链接或者“进入”链接，进而设计成首页，这种布局以企业网站和个人主页较多。 　　5）综合框架型布局：这种是左右框架型和上下框架型的结合，页面顶部放置网站标志、广告??、菜单栏，网页中间左侧为二级栏目条，右侧为链接栏目条，中间为网页的主体内容，网页的底部为网页说明区，放置版权、联系方式等辅助信息。 　　6）Flash布局：就是以Flash作为整个页面，通过Flash来诠释页面所要传达的信息。 　　2 简单web设计实例 　　下面以水土保持网站为例，讲述Photoshop如何在网站群中的应用，以及网页的设计流程。如图1所示。 　　图1 水土保持网站流程图 　　2.1 创建网页初步雏形 　　按[Ctrl+N]创建一个宽度为1000像素、高度为900像素、72像素/英寸、RGB模式的图像文件，选择菜单【视图】/【标尺】和【视图】/【显示】/【参考线】，利用水平标尺或垂直标尺按住鼠标左键进行拖动，创建水平参考线或垂直参考线，根据网页布局模式为Logo图区、导航区、正文区及说明区中信息的放置提供参考依据，并进行排版。 　　2.2 制作网页框架 　　由于网页框架在网页制作过程起着重要的作用，因此制定一个合适的网页布局，对网页设计有着事半功倍的效果，也决定着网页的美观程度。例如“水土保持”网页采用比较受欢迎的“国字”型布局，在网页顶部放置Logo图区和导航栏区，中间正文区放置网页的内容信息，网页底部放置版权、通讯地址、联系方式等相关说明信息。如图2所示 　　图2 　　2.2.1 网页Logo区制作 　　创建好参考线之后，打开“水土保持”网站的Logo图片，使用【移动工具】将Logo图片放置在网页的顶部，然后生成一个图层，并将图层进行重命名为“Logo”。 　　2.2.2 网页导航区的制作 　　设置前景色为#cef78d，利用矩形选框工具依据参考线在Logo图区下面绘制一个矩形选框并用前景色进行填充绘制导航栏放置区。 　　2.2.3 网页正文区的制作 　　设置前景色为#d3f89a，然后选择[矩形选框]工具，在正文区绘制一个矩形选区，执行【选择】/【修改】/【羽化】命令，对选区进行羽化2PX，然后执行【编辑】/【描边】命令，利用前景色对选区进行描边操作，描绘出颜色边框，在制作出的颜色边框内，选择【矩形选框】工具，描绘出一个矩形选区，更改前景色为#d8f7a8，对选区进行颜色填充，制作出分类内容标题框依次用同样的方法，绘制出正文区中的其它分类内容方形区，然后依据参考线把分类标题图标放置到各自的方形框标题区中。 　　2.2.4 网页说明区的制作 　　设置前景色为#9ace48，依据参考线，利用【矩形选框】工具绘制一个矩形选区，并利用前景色进行颜色填充，然后调整矩形选区的大小，进行1个像素的羽化，