作者:李丽媛

邮箱：lly219@gmail.com

日期：2009-1-12

 

 

前言（自说自话）
从初识CSS到现在已经5个年头了。大多是断断续续的，可是近一年来接触颇多，甚有一些些体会。
第一次接触只知道font，color，background，margin，padding等基本知识，乃至连margin、padding都分不清个所以然。
在第一次Web大作业中知道了有“div+css template”,为了交差，从哪个时候就开始收集模板，看到各种各样的模板，不由惊叹他人的配色能力，创作技巧以及丰富的想象力。
于是从图书馆借了一堆PS，配色，广告之类的书，当时没看出个所以然，只是觉得纸质和印刷都很好，要是弄丢了赔的钱可不少。
转眼4年过去了，还是只会下载别人的模板，夸夸几下改成自己实用的，基本的css还是不甚了解。

第五个年头来了，工作了，自己的想法也比较多了，对web方面有了自己的见解。CSS不能说精通，但是浏览器差异，基本原理能说的比较清楚了。

正文
FOR：模仿者的炼金术
一个模板的炼成可以靠很多办法，对于没有创作，没有经验的人来说，最为适当的方法就是找模板来修改。

以下是平时积累的一些模板，大多是国外的：
简洁的白色网站设计欣赏 | ShowCase | 前端观察
模板实例
页面模板
Web Designer Wall - Design Trends and Tutorials
We Are not Freelancers
99 High-Quality Free (X)HTML/CSS Templates | Showcases | instantShift
Open Web Design - Download Free Web Design Templates
CSS Templates (Page 1 of 25 ) - Free CSS Templates
 
  • 对于很没经验的人来说，最好是把模板备份，然后直接在模板上修改，修改完毕记得在多个浏览器中查看。


题外话 ：话说没学会走，怎么能开始学跑呢？在此，不见得就一定，虽然你不是很精通，但它是个所见即所得的东西，再加上Firefox上的firebug，只要稍加理解，不要只图着修改的快乐，很大程度上不会走也能跑了。
但基本功是必须的，等再次回过头来看css，就会觉得很简单，看到有些未曾见过的使用，也会牢记于心。

  • 对 于稍有一点经验的人，我觉得即便是一张图，也可以把它做成HTML。也许就是PS中所谓的切片，只是不用工具，用肉眼和经验。但是，我相信再有经验的人， 他也不能准确给出颜色的RGB值。对于中国人来说，最方便的莫过于使用QQ。
如果你闲不够专业，Photoshop也可以，把一个像素放大到有你的小拇指大，更容易精确定位和获取。

  • 有一小点想象力的呢，可以把背景，icon统统换掉，要是自己没办法做可以再网上淘，总有适合你自己的。

FOR：创造者的起步
    Web出身怎么能没有自己一个亲手原创的网页模板呢？我承认自己没有完完全全的设计出一个页面模板，或多或少都参看了别人的，觉得别人做的太棒了，自己每每准备动手做时，半成品一出来就觉得颜色配的“莫名其妙”。于是又去“参看”。
这样永远迈不出自己的第一步。想要亲手做一个属于自己的网页模板，需要很多的积累，需要灵感。
    在我想来，创作一个模板需要这几个步骤吧（狂想ing）：针对网页的内容衍生出灵感，勾画出轮廓，确定主副色调，做出背景图、logo、icon，用css细微雕琢，浏览器兼容测试，压缩。

    说起来是相当的容易，但每一个步骤都很困难，很费时间。需要掌握、学习的东西太多，从配色 、灵感捕捉 、PS 到CSS 、HTML 、JS 再到用户体验 ，你一样都不能少。另外要相信自己，you are special! 还别忘记跟上时代的步伐：

做网页模板就好像服装界一样，也有流行的颜色和式样，今年也有自己的流行趋势：
http://blog.csdn.net/Vanessa219/archive/2009/12/31/5110978.aspx


推荐几个小工具：
配色工具：http://www.21andy.com/blog/20090526/1303.html
Web设计工具：http://blog.csdn.net/Vanessa219/archive/2009/11/12/4802405.aspx
CSS工具：http://blog.csdn.net/Vanessa219/archive/2009/11/12/4802405.aspx

- -! 等我真的做出来，再和大家分享我的经验吧 ^^（不要骂我。。。）
Tip：在使用或借鉴他人的作品时，要注意版权问题。