PSD格式网页模板如何使用.doc

PSD格式网页模板如何用 step1:在PS中打开模板，如下图： 选择工具板上的slice切片工具，先大刀阔斧的切上一番!技巧： 大面积的色块单独切成一块，尽可能的保持在水平线上的整齐(这个问题你们在后面的制作页面中深有感触)切好的图如下所示： step2:在ps中选择file-save for web...来输出，这里要注意一些参数的选择： 我们来看看红线所标识的1，2，3部分，将1所示的切片工具选中，然后点选2所示的图片，在3所示的地方选择色值，如果色彩单一可以选择尽量小的色 值位;(为什么要这样？？)答案：这样会大大减小文件的大小，同时又能比较好的保持图片的色彩；设置好后点OK输出文件，这里的文件包括了一个htm和 images文件夹，如图： 这里候你的页面才算完成了一半，接下来在dw里建立站点： step3:定义站点 在图示左边的site name中为站点起一个名字，如example然后在下面的local root folder中选择我们刚才导出的站点所以的文件夹；站点建好后在site map中我们看到： step4:重新制作页面表格(为什么？)通常在ps中直接导出的htm文件是不可以直接使用的，因为有些地方在实际运用时要作调整，比如有动态文 字的地方，我们需要在页面中输入页不是使用图片，那么图片就要把它拿走，如果你在直接生成的htm中拿走不想要的图片再加上你想要的东西，你们发现页面将 变得惨不忍睹，整个页面可能完全乱了套!好了，先来分析一下导出的htm文件吧： 根据这个页面表格所示，我们在新的页面中建立一个三行一列的表格: 注意，把cellpadding,cellspacing,border三项值设为0，这个很重要；因为图片中我们不希望看到空隙和错位；然后再在第一行中插入一个三行两列的表格，并合并左边三列的表格，如图： 插入表格的时个要注意对比原htm文件中的内容接下来在第二行中插入一个二行二列的表格，按上面的方法合并左边的格子，并在右边格子的第一行插入一个一行五列的表格如图示： 最后在下面一行插入一个三行二列的表格，并将图示中1,2外分别合并： 最后得到的页面应该是这样的： PSD模版如何变成网页模版 现在想做一个出色的页面还真不容易,除了需要 HTML 知识,了解相关的网页设计工具.更主要的是需要有一定的设计能力.那么有没有一个省事的办法？回答显然是肯定的。网络上有很多公司提供各种风格和用途的 HTML 商业模扳。这些摸版一般进行简单修改后就完全可以加以利用。而且制作精良。比较著名的专业模版制作公司包裹:Boxedart ; Dymamicfactory 等等.大多数模板是有版权的,也有一些公司提供一些免费模板,大家可以利用互联网资源搜索一下.先解释一下什么是模板. 其实模板就是一个由大型设计公司设计的非常专业的网页筐架.当你拿到模版后,只需要按部就班的将你自己的内容填入相应的区域就可以制作出看上午非常专业的页面.一般摸版是由PSD 件，通过PHOTOSHOP 和 IMAGEREADY 进行编辑。编辑完成后由 Photoshop 生成页面文件,再载入到 DREAMWEAVER 等网页制作工具中完成细加工.本次讨论着重介绍网页 部分.Photoshop 大家应该都有所了解,对于它的基本应用,就不在本讲座中详细叙述.我们来看一个简单的模版实例，首先我们来看一个模版文件.打开一个 PSD 文件.大 家可以看到,这个文件其实包含了大部分的页面内容.大家可以看到,文件是 PSD 格式的,也就是说资料都是可更改的,并且以分层的形式来存储.我们可以像平时使用Photoshop 一样对它进行文字排版编辑。可以增加或者更改自己的 LOGO ，自己的标语以及自己的修改成自己的商品图片。将页面元素完全转化成自己的产品。二.神奇的切片工具接下来我可以用 Photoshop 平时被大家忽略的切片功能，来对图片进行一些裁减和分割.这个工具有点像我们上讲讲过的热点工具。不过他们有一个不同。就是热点工具不会对图片进行裁减，而切片会把图片本身分割成小块，来增加显示速度。我们可以在 PS中 为切片填加链接.来看一下三.保存并输出成网页模板基本设置完成.我们把它输出成网页吧.看看有什么值得我们注意的.先选择文件中的保存为 WEB 所用格式.我们来看看这个对画筐.在调整好相关设置后,我们选择 SAVE ,来到下一个对话筐.这里我们选择保存类型为 HTML 和 图象. 保存后,我们得到一个 HTML 文件以及一个 IMAGES 文件夹,里面有根据我们刚刚划分好的切片.我们现在打开HTML 文件,可以看到这个页面,如果你刚才有设置过链接,这里也可以看到相应的链接咯.最