精彩专题推荐:建站之入门课 建站之必修课 建站之关键课 网站价值所在 流量提高专题 css+div 标准 个人网站打造全过程
  • 让你的网站产生收益赚钱,有博客和网站的绝对不能错过
  • 将指定的流量带到你的网站,为你站增加有效的访客,为你提升业绩
  • Photoshop制作网站首页(2):首页内容的制作

    来源:xuexin.com 薛欣 时间:07-12-18 点击: 点击这里收藏本文

      相关文章:Photoshop制作网站首页(1):首页主体的制作

      因为相对于主体来说,内容部分并不是很容易出彩,所以其设计比主体更加需要清晰的思路,并非常考验制作者的耐心。通常情况下内容部分的主要工作都是在Dreamweaver 中,所以这里我们在Photoshop 中所设计的只是一个供参照的外观。

      1. 在页面的右侧用矢量“矩形工具”绘制一个淡绿色的背景填充,该绿色的十六进制值为“#eefded”,几乎接近于白色,这是为了突出前景深绿色的文字。这里的文字内容都是虚构的,其十六进制颜色值为“#054d00”,布局的位置如图1-2-1 所示。

    Photoshop制作网站首页(2):首页内容的制作_来源:建站学www.jzxue.com
    图1-2-1


      2. 在文字的下面是播放在线视频的地方,我们这里插入一些图片进行占位。图片推荐在Adobe Stock Photos CS3 中进行查找,这是Adobe 提供的一个庞大的图片素材库,包含在Adobe Bridge CS3中,低质量的图片小样是完全免费的。因为网页需较高的下载速度,因此低质量的照片反而更适合于网页设计师。需要注意的是,该搜索功能暂时还不支持中文,所以这里我们搜索“bridge”来下载一些关于桥的照片,如图1-2-2 所示。

    Photoshop制作网站首页(2):首页内容的制作_来源:建站学www.jzxue.com
    图1-2-2


      3. 我们用多张“桥”和“花园”的图片合成了这部分的图像内容,这里使用的石桥剪影字体为“方正古隶简体”,合成的方法因为非常简单,这里就不再赘述,如图1-2-3 所示。

    Photoshop制作网站首页(2):首页内容的制作_来源:建站学www.jzxue.com
    图1-2-3


      4. 在下面绘制深灰色矩形,十六进制颜色值为“#2a2a2a”。输入文字“ShiQiao Garden”,字体为“Trajan Pro”,这些均是作为中间的隔断和装饰,如图1-2-4 所示。

    Photoshop制作网站首页(2):首页内容的制作_来源:建站学www.jzxue.com
    图1-2-4


      5. 在隔断下面再绘制一个较浅的灰色矩形,十六进制值为“#7a7a7a”。在该矩形上面再并排绘制两个颜色更浅的灰色矩形,十六进制值为“#efefef”。这些矩形的绘制主要是用来布局,频繁的使用灰色有两个原因,一是因为灰色通常在设计中表示高级,另外,网页的主体过于鲜艳,使用灰色可以平衡一下,以避免“抢了主角儿的戏”,如图1-2-5 所示。

    Photoshop制作网站首页(2):首页内容的制作_来源:建站学www.jzxue.com


    图1-2-5
    9 7 3 1 2 3 4 8 :

    用户评论

    广而告之