[网页设计]青岛网站设计:高性能的网站开发:标识/CSS优化(网站界面设计)

3周前 (06-11 00:34)阅读1回复0
admin
admin
  • 管理员
  • 注册排名1
  • 经验值101300
  • 级别管理员
  • 主题20260
  • 回复0
楼主

  一.标识(注释)的优化

   网站在开发上往往容易出现这样两种情况:一种是代码过于紧密,其中包含大量注释信息和排版空白,一种就是代码太过宽松,其中不但包含了编辑器自动生成的标识语言及大量缩排空白,而且包含了编辑器常用来控制文件结构的特定注释,甚至还有冗余或无用的标识或代码。象这样的代码是不适合传输的。我们可以通过下面一些安全有效的途径来减小文件的大小:

    1.1 删除多余的空白区域

    一般说来,可以把那些多余的空白字符如空格,水平TAB,换行符等删除掉。不过当然了,象<pre>,<textarea>文本框和CSS的<white-space>属性中的空白是不能删除的。

    1.2 删除注释文字

    除客户端对IE浏览器和文档类型声明条件注释之外的注释几乎都可以删除,不会对文件造成什么影响。

    1.3 将色值重新调整至最简短形式

    在颜色上,尽量不要只使用十六进制值或只使用颜色名称,哪个短就用哪个。比如对于红颜色,用它的属性值“#ff0000”就没有“red”来得简短。而对于“浅金黄色”如果用它的颜色名“lightgoldenrodyellow”就太长了,反不如用属性值“#FAFAD2”。

    1.4 将文字实体重新调整至最简短形式

    这一点与色值的替换类似。我们可以把一个单词名很长的文字实体用一个数字性实体来表示。

    1.5 删除无用的标识

    将无用代码删除。

    二.CSS的优化

    我们可以对CSS代码进行精简来进一步减小文件的大小。不过,如今大多数网站所创建的CSS都要比普通HTML难压缩的多。对CSS的代码精简有下面这样一些安全有效的措施:

    2.1 删除CSS空白

  CSS对空白的敏感度远远低于(X)HTML,因而可将CSS中的空白删除来有效降低CSS文件和样式表区域的大小。

    2.2 删除CSS注释信息

    就象删除普通代码中的注释来精简代码一样,由于CSS中的注释对普通的终端用户来说并没有什么实用价值,所以应予删除。不过,如果需要考虑改进过的浏览器,则可以保留在CSS的<style>中的屏蔽注释信息。

    2.3 将CSS中色值调整至最简短形式

    这一点也和HTML相似。对CSS字体颜色可以用单词或十六进制格式。不过,这样做在CSS中的效果会更为显著一些。这是因为CSS支持3位6进制色值,例如对白色(#ffffff)可用“#fff”来表示。

    2.4 对CSS设置进行重组,减少及删除

    CSS中设定了字体的大小,字重,颜色等。一般CSS内容都是:

  p {font-size:36pt;

  font-family:Arial;

  line-height:48pt;

  font-weight:bold;}

    我们可以将其改写成:p{font:bold 36pt/48pt Arial;}

    如果运用得当的话,可以对样式表中的一些语法规则进行大幅削减。不过目前还没有这样的工具,所以我们只能手工删除,不过即将推出的w3compiler2.0版将会包含这一特性。

    2.5重命名类和ID值

    在CSS优化中,对样式表或ID值的重命名可能是最危险的一个步骤。对样式表的重命名可以遵循这样的原则:例如对于: .superSpecial{color: red; font-size: 36pt;} 则可将其更名为sS。而对ID值一样可以遵循这样的原则,例如对于:#firstParagraph {background-color: yellow;} 则可将原来的 "#firstParagraph" 更名为 "#fp" 。自然,这样做可能会牵涉到“标识-样式-脚本”的问题:如果一个“tag”有一个ID值,而这个值又可能不但用于样式表,还可能用于脚本参考,甚至可能是一个链接目标地址。在这种情况下一旦修改了这个值,那么必须确保对所有文件中相关的脚本和链接参考都进行了相应的修改。

    请注意:最好不要更改名称属性,尤其是表单区域中的名称属性。因为这些数值也会被服务器端程序操作。

  七点企业形象策划有限公司(简称青岛七点设计)是一家专业的广告设计和网站设计公司,提供专业的企业网站设计制作、标志设计、企业宣传画册设计、电子杂志设计等项目的策划与设计服务。 青岛七点设计已经成功地完成了多项企业标志设计、企业网站设计、企业宣传画册设计等项目,服务对象涵盖诸多行业。青岛七点设计的作品深受客户好评。

  青岛七点设计凭借在设计领域的专业化水平和国际化眼光,以及多年的专业平面设计、网站设计经验和资历,充分结合企业的自身特点和实际需求,以独创、新颖的品牌形象设计促进企业自身独特性的塑造和产品的竞争力的提高。青岛七点设计的宗旨是立足本土,放眼世界,靠设计作品说话,坚持原创,以作品赢得客户信任,做中国最具创新意识的专业策划与设计公司。

  主页:[url]]

0
回帖

[网页设计]青岛网站设计:高性能的网站开发:标识/CSS优化(网站界面设计) 期待您的回复!

取消
载入表情清单……
载入颜色清单……
插入网络图片

取消确定

图片上传中
编辑器信息
提示信息