李宁项目总结(1)----不要被表面现象所迷惑

         接到了新的任务---李宁网站项目.主要任务是将网站由静态换成动态,其实就是重新做成一个Jsp网站.这次任务分工很明确,我和另外三个人主要任务是负责网站页面设计.

         大约在两年前学过Dreamweaver8的相关内容,但是当时做的也是静态网页,并且特别的简单,几乎都是手动拖拽操作,相对来说比较简单,由于时间的原因很多的内容都已经忘的差不多.所以从8月16日到8月17日这两天时间主要是进行了DreamweaverCS5的学习,(后盾网DreamweaverCS5视频教程是主要的学习内容)而此时的Dreamweaver的版本已经是CS5.事实证明这两天的学习是相当的关键的,因为随后进行网页设计中很多的关键技术都是从教程中学来的.另外通过看书,简单的了解了一些关于jsp相关的知识,但是仅仅属于浮光略影.真正要学到自己身上的内容还需要经过自己的接下来的实战经验才可以慢慢的消化吸收.从11月18日正式开始到现在(11月25日)用了约一个星期的时间完成了50多个页面的设计和制作.剩下的就是面对不断更改的需求做相应的修改.

       在项目进行的第一天,我们四个接受的第一个任务是根据需求文档对原有html网页进行修改,修改符合客户要求的布局类型.刚刚开始以为很简单的事情,结果打开一看.仅仅一个表单页面就有将近5000多行代码,并且布局是纯Div和Css样式.而单单Div的ID号就达一千多个.我们四个人用了将近一下午的时间每个人才勉勉强强的修改一个页面符合文档的需求.如果要修改接下来的50个页面,那剩下的工作量可想而知.

       虽说DIV+CSS可以更好的对网页进行控制和修改,但是滥用DIV就不可取了,况且原始页面的Css都是写在网页内部,也就是说并没有实现真正的样式与结构的分离.Css仅仅是伪Css,要进行修改的话还需要对每个Div中的样式进行修改......可以这么说吧,他们所给的页面可修改性几乎是零.                    

       刚开始天真的认为这种网页是人工制作而成,还挺佩服这个制作网页的"人员",这么多个DIV位置都是绝对的,需要一个一个的进行调整,也就是说你要换一个或者更改一个DIV的话,所有的其他的DIV都会受到影响.

       不过通过晚上的分析和总结,总感觉如果人工完成这些纯"体力"的代码似乎有些不值得.于是从网上找是否有相关的工具或者可以把网页"切割"成一个个的DIV+CSS,经过一番查找还真找到了类似的一个工具叫做"DIVBrash",此工具的大体思路是通过导入一个设计好的图片,这个图片是对网页整体框架的一个设计,你可以通过DivBrash对这个图片进行切割,也就是把一个图片分出一个一个的"块",而这些块就是一个个的DIV.你也可以通过DIVBrash对每一个具体的DIV进行样式设计.随后会到处相关的文件,这些文件包括(1个Index.html文件,一个图片资源文件,一个Css样式文件.)在处理网页Div排版方面的工作时,DivBrash的功能还是非常的强大的,可以省去很多代码工作.相信在以后的Web前段的设计上会用上网页Div页面排版输出系统.

       通过对网页的修改到DivBrash工具的发现的这个过程,认识到一点:当你发现自己所处理的代码非常的有规律,像ID号从u1到u1000,这样的代码人工实现起来非常的费时费力,但是让相关的软件处理起来就是非常容易的事情.其实我们一开始就应该想到如果是人为进行代码编写的话一般都会给ID附上有意义的内容.这也是人们的聪明之处,将一些有规律的复杂繁琐的"体力活"交给机器或者软件来处理,而人则把精力集中放在创意和设计上.

       随着项目的不断进行和对客户的交流中得知,他们就是用的类似工具,不过这个工具并不是DivBrash,而是IBM公司Filenet页面设计的一个软件叫做eForm.

       不要轻易的被表面"复杂"的现象所迷惑,对现象进行分析总结,发现其规律,扩展自己的思路.

继续修改是不可能了,我们四个人要做的是重新对所有的页面进行设计,按照用户的需求文档进行.