难得国外有这样好的教程，我就用我仅有的英文程度翻译一下啦。倡议将本博客的中栏跟右栏暗藏后观看本文。
译者：joe
译文
原文来自：design
a beautiful website from
scratch
引言
你是否曾经想过设计一个美丽的网页，然而却不晓得怎么入手？说瞎话，多少年前我也是这样。当我阅读网页的时候我看到这么多难看的网页，我就盼望本人有技巧创作这样的设计作品。
今天我可以这么做了，而。傳單設計从事设计制作,彩色印刷,包装,后道加工一条龙服务。且我将教你怎么做这样的设计！从基本上，对这种设计你须要一点photoshop的操作技巧跟察看细节的才能。通过以下的教程，我将会指出其中极轻微的细节之处，而这些细节讲使你的网页设计英俊起来。打开photoshop，我们开端啦！
注释
先看效果图
第一步：下载960网格模板
我始终以来做的设计简直全体是基于960网格模板的。
因而在我们开始创作之前，先下载这个模板。 你能在960.gs上找到这些模板。 下载之后解压zip里面对于psd的模板。 你会发明有两种规格： 一个是。網頁設計根据企业希望向浏览者传递的信息，进行网站功能策划，然后进行的页面设计美化工作。12栏式的而另一个是16栏式的。
他们的差别就像名字所说的，一个是按12栏散布一个按16栏。 更具体的先容一下吧， 假如你的设计里面分3个区块你就挑选12栏式的，那是由于12能被3整除
同理如果你的设计分四个区块， 你可以选12栏式或者16栏式，那时由于12和16都可以被4整除。
你会发明这个技巧将用于下面教程。
第二步：结构你设想的构造
在我们打开psd网格模板创作前， 我们首先须要先构造一下设想中的结构。
从上面的这张图，你可以看出来：因为在一个排版中又有排版，所以这是一个有点庞杂的结构。
第三步
结构了构造之后咱们持续。
翻开16栏式的psd模板文件。 翻开图像 》画布大小 。 把画布的宽度设置为 1200px 高度设置为 1700px 。把背风景设置为 #ffffff
既白色。
第四步
用长方形工具在顶部画一个宽100%高大略80px的长方形。 用颜色： #dddddd
填充它。
第五步
在长方形那层上面创立一个新层。 按住crtl键鼠标点击长方形层。 长方形就被选中了，而后把目的移至刚建的新层上。 抉择半径
600px 的软笔刷（如图）， 把其色彩设置为白色， 而后就像图片所示那样在选框上边缘点多少下。 通过这个技巧你画出了一个奥妙的照亮效果。
你当初可以把这两层结合起来了。
第六步
建一个新层，再用长方形工具如图所示在上端画一个深灰色的小长方形。
第七步
在间隔上端长方形500px处开端画一个宽
100% 高 575px 的长方形。 设置其由 #d2d2d0到 #ffffff 的渐变色，
角度为-90，缩放为100%
第八步
当初我们如第五步那样增添照亮效果。 这个技能我们将很频繁地应用因而下次用到的时候我只提醒是第五步的效果
。
在当前层之上简历一个新层。 ctrl+鼠标点击这个大的长方形。 取舍 600px的软笔刷，
设置颜色为白色，如图所示对选区的边缘点击多下。
第九步
创建一个新层画一个400px高的长方形。 这是用作我们网页页头的。
给它设置一个线性渐变，由颜色 #2787b7 to
#258fcd.
以下展现色彩的奥妙变更：
第十步
在页首长方形块底端画一条1px的灰蓝色的线， 混杂属性中增加暗影效果。
暗影参数： 正底叠加， 透明度： 65%， 方向： -90， 间隔： 1px ， 宽度： 6px.
之后再建一个新层，在灰蓝色线下面画一条1px的白线。通过这种方法，咱们就能够创立一个轮廓赫然的边沿。
能够说在你的设计中，你可以把这个技能用于其余色块。
第十一步
创建一个新层，在画布顶端用
长方形工具化一个50px高的长方形，就如图所示，这个长方形是用作导航的。
