网站模型设计中的内涵和重点(10)

http://www.itjxue.com  2015-08-02 14:05  来源:未知  点击次数: 

CSS整站规划——网站设计的重中之重题

说过DIV当然要说说CSS,CSS使现代网站大放异彩。符合标准化的网站,仅仅通过更换一个不同的CSS文件,就可以瞬间实现整站所有页面改变更新的显示效果。CSS统一了网页的表现层,而不影响网站结构和数据传输。

而CSS的书写方式也因设计师的不同而各有千秋,在此,我们强调CSS的设计关键在于代码的缩略与复用:缩略能使CSS代码更加简明扼要,CSS文件也能缩小体积;复用则是提高代码的利用率,以最少的代码实现最高的重复使用效率。如图3所示,腾讯网的CSS设计就十分优秀。

首先我们来看代码的缩略,很多编辑器生成的CSS代码片段会像图4一样杂乱随意,而实际上这段代码能缩略掉所有不需要的空格,组合起同系列元素,使得代码行读起来更加轻松无负担。

毕竟,编辑器是按照一定的程序运算而提供出来的CSS样式,它能自动实现预期效果的CSS样式,而绝不会自动精简代码。这个过程还是需要人的干预,而且对于不同的应用场合,CSS代码中的缩略方式也会有所不同,而取谁舍谁,则完全看具体情况而定了。

其次,我们来了解CSS的复用。同样是复用,CSS的复用情况和DIV很不同。设计中我们需要尽量实现CSS代码的复用,尽量多利用CSS的继承和层叠,而不是到处定义新的CSS类。在繁琐的CSS设计中,也许会遇见两个大部分属性一致而只有某一两个细节不同的类,那么可以考虑这两个类是否是继承关系,或者说将它们相同的属性提炼出来,形成另一个可供公用的类。

后期整理——代码也可以很美

之前说的都是代码编写的前期规范,而页面完成之后,代码的后期整理对于今后的修改维护“可持续发展”也非常重要。在这里,我们需要注意以下几个方面的内容。

1.样式表统一:样式表分为内联样式表和外联样式表,成型的网站架构要求对样式表统一管理,所有的样式表都需要独立出来,作为一个或几个外联样式表文件;除非是极特殊的情况,该CSS只在这一个页面中出现,不会有另外的页面需要复用它,那么可以考虑使用内联,而内联样式很多时候会被视为极不专业的做法。如图5,色影无忌网站的设计从外观看很符合标准化设计,但从图6我们可以看出色影无忌的代码设计非常混乱。

(责任编辑:IT教学网)

更多

推荐网站策划文章