网页效果图制作中Photoshop的使用分析

　　摘    要：　网页效果图是制作网站前的必备工作, 网站是指在因特网上, 根据一定的规则, 使用HTML等工具制作的用于展示特定内容的相关网页的集合。网站又可分类为:分类:大型门户网站、搜索引擎网站、购物网站、专业网站、企业网站、个人网站等。网站制作用到的软件:Photoshop (设计效果图) 、Fireworks (切图) 、Dreamweaver (生成静态网页) 。本文就photoshop在网页效果图中的应用进行研究。

　　关键词：　Photoshop; 网页效果图设计;

　　一、引言

　　我国现在处于经济发展飞速的时代, 网站是事企业单位展示自己的重要途径。通过网站, 直观的多样化的展示优势特长, 网民可以直接在网站上了解到更多的行业动态。现在也是视觉时代, 网站的展示需要第一时间抓住人的视线, 并且被大脑记录下来, 加深对网站信息的印象。网站想要吸引客户的眼光, 就必须重视网站效果图的设计, 而Photoshop软件是一个集图像设计、高品质图像输出于一体的图形图像处理软件。

　　二、网页效果图中Photoshop的实际应用表现

　　网页设计就是让美工做设计网站的所有页面的界面效果图, 就像造房子之前, 会请着名的设计师来设计房子的外形效果。网页美工要求精通各类图形图像设计软件, 有较强美感, 精通网页界面布局, 了解用户体验, 有思想, 能判断和分析基本市场需求或目标客户喜好。

　　(一) 网站分类及功能

　　网站是指在因特网上, 根据一定的规则, 使用HTML等工具制作的用于展示特定内容的相关网页的集合。可以分为大型门户网站、搜索引擎网站、购物网站、专业网站、企业网站、个人网站等几大类。网站制作用到的软件:Photoshop (设计效果图) 、Fireworks (切图) 、Dreamweaver (生成静态网页) 。一个完成的网站包括登录页面、主页面、子页面三个部分。

　　(二) 网页构成要素

　　Photoshop软件可以使网页元素细致化, 根据美工设计标准, 涉及到的元素种类较多, 网页设计的主页内容有:网站标志设计、文字、图片、宣传标语、导航条等。而网页版面内容又可分为以下几部分:页面 (LOGO) 、导航区、banner、主题内容、页脚 (友情链接、版权等) 。怎么使得这些繁杂的元素变得整体统一又具有美观性, 这就需要美工使用Photoshop软件加以有效的解决, 使得网站的主题效果表达明确。

　　(三) 网页效果图的色彩应用

　　俗话说的好, 红花也要绿叶配。好的色彩搭配对于网站的页面来说是非常重要, 我们看到的网站都是色彩的, 色彩构成了网站的整体风格, 也为用户带来了不一样的视觉体验。网站视觉体验主要是指色彩的搭配和运用, 页面设计需要考虑页面之间颜色的搭配, 不能看起来太花哨又不能太单调, 我们将需设计的页面当成一个画布, 对页面功能区域进行颜色填充, 使其看起来即美观又实用。想要正确的掌握网站色彩搭配, 既要对颜色有一定的了解, 又要熟练使用Photoshop中的图层功能, 这样可以对网页的色彩进行有效的分析, 从而提高网站页面色彩的合理性。

　　(四) 网页中动画效果的实现

　　一个网站要让客户有好的用户体验, 不仅要有绚丽的海报图片还时常会配一些动画视频增加网站的趣味性。而Photoshop这个软件还具制作Gif简单动画的功能。Gif的信息多于一张静止的图片, 它的观看性远远大于video的质量。Gif是一个最有优势的媒材, 让静的图像动起来, 或者让动画一直重复, 变成抓住眼球的媒介, 它效果增加了网页的活泼性和趣味性, 使网页不显得那么死板。通过Photoshop制作而成的Gif格式, 被广泛的应用于网页效果图的设计当中, 因为目前市面上任何浏览器都支持这种格式的播放。

　　(五) 网页速度的提高

　　一个网站打开的速度的快与慢, 这个问题直接影响着访客的用户体验度。但我们经常会遇到打开网页比较“卡”的状态, 随着互联网时代的发展, 人们越来越依赖信息化, 也逐渐进入快餐时代, 什么事情都讲究效率, 一旦打开一个网站速度过慢, 我们肯定会关闭还在缓冲的网站, 从而转向浏览其他同类型的网站。网站网页打开的速度受很多因素的影响, 除了网速这个不可预期的因素之外, 还有比如说图片大小、动画、图片链接等方面, 网页中大量的图片我们知道, 特别使图片网站, 一般都会设置为图片延时家在, 这是因为图片家在需要大量的网速, 很多情况下我们都是将图片处理国再放到网站上。比如说, 淘宝店铺效果图中, 图片都很多, 我们要提高买家的体验度, 就需要用Photoshop软件将这些图片进行处理, 将其的占存大小进行调整, 保证其画面质量的情况下, 提升页面打开速度。当进行图片占存处理还无法解决问题的时候, 我们还可以使用photoshop中的切片工具, 切片工具主要是将在Photoshop里制作的图片切成多块, 犹如切蛋糕一样切出很多份, 根据需要设置分辨率, 再把图片发到网络上去, 切成小块之后的图片更容易发送, 这样网页打开的速度又得到了提高。

　　三、结语

　　综上所述, 加强Photoshop在网页效果图设计中的实际应用, 可以对网站网页进行优化、提高网站网页的打开速速、增加网站网页的访问量, 从而实现经济效益最大化。