Photoshop在网页美工设计中的应用研究

张莉

摘 要 在我国经济飞速发展的今天，科学技术的发展日新月异。在我们的日常生活中，对网络技术的运用更是渗透到了各个方面。人们通过互联网进行交流、购物、工作以及学习。越来越广泛的使用也对网页自身有了更高的要求，更加精美的设计才是吸人眼球的第一步。因此，文章就网页美工设计中对Photoshop的运用进行研究和分析，希望能为网页美工设计提供一些有价值的参考。

关键词 网页美工设计；Photoshop；应用

中图分类号 J913 文献标识码 A 文章编号 1674-6708（2016）162-0091-02

对网站访问率造成影响的因素有很多种，但是网页的设计也是关键的因素之一。现在的网站早已改变过去只注重单一功能性的缺点，对于网页的美观设计成为了未来网页设计的重要发展方向。在以往的网站设计中最多使用的是Dreamweaver，但是其在进行美工设计时却存在一定的缺陷。Photoshop的出现就为网页设计师带来了更加宽广的空间。

1 网页美工设计中Photoshop的应用表现

网页设计的最主要目的就是能让人们获得最直观的信息，而信息的获取方式自然就是利用网页的美工设计。这样人们不仅能够获得自己想要的信息，还能从中体会到美的享受，而Photoshop，也就是Adobe Photoshop就是完成这一要求的重要平台[ 1 ]。

1.1 完成更加合理的布局

从网页设计师的角度来说，从拿到项目的那一刻就要开始思考应该进行怎样的布局，是采用三栏布局好还是二栏布局好？自由式结构的效果更好还是普通框架结构更好？应该以图片为主还是文字为主？这些也是设计的关键所在。使用Photoshop软件就能让设计师在不断调整和确认工程中完成更好的设计思路。这种方式无疑要好过手绘草稿很多倍，因为这不仅更加的贴合实际还让设计变得更加生动。如果是使用以往的Dreamweaver，就需要制作出实际的网页，不仅会浪费很多时间，更不方便修改。在Photoshop软件中的图层功能就能将想要使用的不同元素进行灵活的摆放和转换，各个图层之间是具有很强独立性的，当然如果想，也可以进行链接。图层本身就具有可以修改的属性。功能上的灵活性就能让设计师在进行创作时不受任何束缚，然后根据各方面意见进行及时的调整和修改，最终完成一个成功的设计[2]。

1.2 让元素可以更加细致

按照标准的网页来说，其中所要设计的元素有很多，例如，最基本的导航条、图标、标志、页眉与页脚等等，对于这些细碎的元素，在进行处理时会对整个页面效果造成非常大的影响，不仅如此，元素的设计风格也会影响到页面的主题，如果处理到位就会为页面增色。反之，不仅会造成页面的繁乱，更会影响页面的整体布局。这时对于Photoshop软件的运用就能为各种素材提供方便，这也是Photoshop软件的强大之处，关于元素，可以制作成不同的质感和效果，进而让网页能够有更加多样的选择，更能将设计师的创意想法进行相对完美的实现。

1.3 让色彩更加丰富

在网页的美工设计中，色彩搭配相当关键。而Photoshop软件中对图层的运用就能为网页美工设计中的色彩搭配提供相当方便的路径。首先是对元素的基本确定，然后就是进行各区域以及各图层的单独调整。这样只要进行一个简单的操作就能够完成想要的颜色搭配，不仅如此，还能对颜色进行一个实时的分析，方便合理。更重要的是Photoshop软件具有网页安全色功能，这样就够在色板里挑选web安全颜色、web色相命令以及Web色谱，放入调色板中的任何一个颜色都会在不同操作系统、不同硬件环境以及不同浏览器中呈现最为正常的颜色，不论颜色有何不同，用户在进行终端浏览时设备所呈现的效果没有差别。

1.4 让动画变得更加精巧

网页美工设计中，网页的趣味性也可以依靠动画来加以提升，以便能吸引更多访问者的兴趣。Photoshop软件可以制作一些相对简单的“帧动画”这些都可以保存为GIF格式[ 3 ]。这种格式的实质就是将多幅图片合并为一个图像文件，进而形成一种动画，这种格式的特点就是浏览器支持相对稳定以及较小的文件体积的优势，目前在网络上有非常广泛的使用。

1.5 让速率变的更快

网页的美工设计如果不精美就无法吸引人们的眼球。而相应的，如果网站的打开速度过慢也会让浏览者逐渐消失。目前我们正处于一个互联网高速发展的时代，同种类型的网站也如雨后春笋，层出不穷。据相关调查就能够看出，人们对网站的等待耐心不会超过十秒。造成网页打开过慢的原因有很多，但是外在条件基本相同时，网页元素的配置和优化以及网页大小是影响速度的关键因素。而进行Photoshop软件的应用就能够将这些图片进行一定的缩小。例如，可以进行图片的减色处理，也就是在不影响图片质量的前提下对图片的颜色进行删减。让图片体积更小，还可以进行大块图像的分块，将大图像切分成不同的小图像，完成多图的同时传送，将网页的下载速度加以提高。要注意的是，在运用Photoshop进行切片后，应将图片的形式储存为web形式，Dreamweaver也能完成对图片的有效整合。对于切片的存储格式可以用Gif，其占用的体积较小，如果有一定较高的要求，那图片就可以存储为JPEG格式，其能够进行图片更多的细节展示。如此进行过合理存储之后，网页就能够被大大减小，进而也就将传输速率提高了上来。

2 在网页美工设计中应用Photoshop的注意事项

对网页的美工设计来说，对Photoshop软件加以应用，不仅能创造出更好的页面轮廓，更可以通过美工对Image Ready的运用来完成动画效果的创建，当然也可以进行FrontPage、Dreamweaver的联合设计，来帮助美工设计完成更好的页面创作。但是在运用Photoshop进行网页的美工设计时有一些基本问题是必须掌握的。例如，在网页设计的初始阶段，要注意网页尺寸与分辨率的关系。通常来说网页的文档尺寸都会设为708×800像素，而分辨率则为72即可。进行设计时也不能忘记对分辨率的调整，要保证分辨率的适当。当然，对于参考线的运用也是非常重要的，网页设计中如果能合理的使用参考线，那将会让网页有更加清晰明确的规划与布局。在最初使用参考线时，将页面进行一个按比例分割，主要内容一定要在分割点上，其目的就是吸引更多人的视线。不仅如此，Photoshop软件还具有链接的优势，适当的使用链接，给访问者们展示更多的图片以及信息，也是其他制作软件所不能取代的优势。

3 结论

综上所述，在网页的美工设计中对Photoshop进行应用是未来的发展趋势。不管是网页设计还是其他的设计，表达永远是第一目的。只有能将本网站的内容与主题进行完整表达的网站界面才算的上是专业，因为设计者想要表达的内容都呈现在了眼前。精美并具有特色的网页美工设计能为访问者带来非常好的体验感受，第一观感通常是成功的最关键部分，进入网站的瞬间就决定了潜在客户的人群以及是否能获取他们的信任。可见网站的美工设计是多么的重要，希望未来的网页设计师们能够通过对Photoshop的应用而完成一次又一次更好的设计。

参考文献

[1]马绥莉.基于艺术设计中Photoshop软件的应用仿真研究[J].电子设计工程，2015（16）：56-58.

[2]古韵婷.有关网页设计中Photoshop和Flash的应用探析[J].科技致富向导，2014（9）：242.

[3]李娜.高职Photoshop网页美工课程教学方法改革及实践应用探究[J].科教文汇旬刊，2014（13）：162.