网站建设如何设计页面效果图

2017-11-14

网站建设之前,一般都是需要设计出网站页面的效果图,以方便对页面的色彩,排版等进行安排。而常用的页面效果设计软件,就非Photoshop莫属了,它是一款非常强大的图片设计工具,如今绝大部分的页面效果图都是通过Photoshop设计出的。借助Photoshop的滤镜、图层、样式等工具,可以设计出非常精美的网站页面,那么具体怎么为网页制作一张效果图呢?

通过Photoshop制作页面效果图,第一步需要新建一张图片,并且对图片的大小以及是背景颜色进行调整,图片的大小就是页面的大小,而图片颜色就是页面的背景颜色。

由于网页制作中的内容是按照一定的次序进行布局和排版的,而在图片中对这些内容的定位和排版都是不怎么方便的,这就需要借助Photoshop的标尺工具以及是辅助线,通过这两个工具,能够对页面效果图进行简单的划分。

在PS中进行网页的效果图制作

至于网站的Logo(参考:如何设计网站LOGO),在设计页面效果图时,可以将已经设计好的Logo图片导入到图片中,然后再单独调整好Logo图片的位置以及是大小,以更好的协调页面的效果。

至于页面中的banner条,这通常都是紧跟在网站logo后方的,在页面效果图中,其导入大致与网站Logo相同,都需要进行导入,调整。

接下来是导航条的内容,导航条可以是图片或者是文字,在设计页面效果图以前,需要先设计好导航条的效果,如果是文字导航条,那么就要注意文字导航条与网站背景的对比,以及是否和网站风格统一起来。

当页面的Logo、banner条、导航条等内容都设计好以后,就要对页面的内容部分进行设计,网页制作中内容部分是整个页面的核心,内容区域的页面效果设计,需要在完成页面内容的基础上才能体现出具体的页面风格和效果的。

网页底部制作内容效果

网站建设页面效果设计的最后一步,就是页面的底部栏目,就是关于网站的版权声明,网站的帮助信息、友情链接等的内容,这里主要通过Photoshop的文字添加功能,就可以巧妙的在图片中设计出底部栏目的相关信息。


免费使用