当前位置：首页>ps实例教程>ps网页设计>网页图片>教程内容

Photoshop制作商务公司网站模版(5)

来源：未知 作者：admin 学习：6180人次
本教程设计的公司灰色调网站，但是在布局方面就感觉十分大胆与随意，与国内很多企业公司网站的风格完全背离，也可以看出不同国家的文化的体现，不过整体来说还是很不错的页面设计，这样的设计感觉颜色体现了公司网站需要的沉稳但布局又不缺少活跃气份的部分。

新建900x850大小文件，双击背景图层，取消背景图层的锁定
再次双击背景图层，然后添加如下图层样式

开始制作导航按钮！
使用圆角矩形工具，设置半径为10px，拖动出如下图三个形状，随后用多边形套锁工具删除一个左下角区域，如下图所示

随后用椭圆选区工具制作箭头，制作步骤是，先画一正圆选区，然后删除白色区域，再将选区减少2px~3px,为圆填充白色

使用photoshop箭头形状制作箭头，完成后如下



                                       
将导航按钮进行复制，并合并达到一个图层中，添加一个如下的阴影样式，再加入按钮文字

完成后图

为了让页面增加一些变化的效果，使其看上去不呆板，我们导入一些图片与斑迹笔刷

在图片下放置一个图层，用来放上联系方式，这样看上去是不是有点小创意？

为新图层的圆角矩形添加样式

放入联系文字



                                       
将之前做好的公司LOGO标志导入

放一张咖啡图片，在其下制作网页的主要区域

为上面的选区填充白色，随后设置不透明度为40%

加入文字

为了充实页面内容我们开始设置版面的摆放位置
如下图这种图片显示方式十分得体，由于我们的公司网站颜色比较单一，所以在版面上就不能过于保守

制作两个主要版块区域，填充颜色使用#eae9e4 ，边框颜色为#838274

加入图片与文字以及按钮，整个页面中的按钮我们都使用同样的风格



                                       
制作搜索条区域

制作公司网站的新闻区域

完成公司网站后的整体效果如下
共4页:上一页1234在本页浏览全教程

学习 · 提示

  • 一定要打开PS，跟着教程做一遍，做完的图到这交作业：提交作业
  • 建议练习时，大家自己找素材，尽量不要用教程提供的素材。
  • 教程有看不懂的地方，可以到论坛发帖提问：新手求助
  • 加官方微信，随时随地，想学就能学：ps_bbs，或扫右侧二维码！
  • 关注我们学更多，每天都有新教程：新浪微博 抖音视频 微信小程序
- 发评论 | 交作业 -
最新评论
暂无评论，交个作业支持一下吧~
查看全部评论 >

关注大神微博加入>>

网友求助，请回答！