CSS 优化,提高性能的方法有哪些

html-css015

CSS 优化,提高性能的方法有哪些,第1张

压缩css代码,就是删掉空格换行之类的,使用尽量短的class名称,不过这个影响维护,对速度的影响也很小。因此首推的是合并css文件,如果页面加载10个css文件,每个文件1k,那么也要比只加载一个100k的css文件慢。

另外,我觉得你提出的问题比较流于表面,建议你用谷歌分析、百度站长之类的测试一下你的网站性能,它们会指出可能的问题并附带适当的建议。

每个人的系统字体type渲染设置中清晰度、平滑等设置不同看不做的网页字体效果也不同(还有window和mac渲染方式根本不一样等问题),网页上的字体是系统默认的字体看不出来多大区别,当你用了非默认字体,区别就明显了。

还有个问题是字体本身问题,在css嵌入字体流行以前,比如你这个华康字体以及一些其他字体可能内部本身是点阵方式储存的字型,而且根本没考虑过未来嵌入web的问题,没做过 相关优化(这几年出现的中文字体也基本上没优化,中文字太多了,每个字都需要优化工作量太大),于是多数中文字体嵌入后会缺胳膊少腿(宋体系列相对好点),字上的一些线条特别发虚像丢了似的。

你看到的微软雅黑、苹果丽黑之类的字体效果好是这些少数字体是微软、苹果这种大企业花很高的成本设计,每个字都经过专门优化,充分考虑了系统和web等各种场景下的显示效果的。

总体来说,中文字体嵌入没有很好的解决方案,嵌入量大的问题到是可以程序解析字库删掉web中未出现的字来解决文件大小问题,但渲染不清晰、缺胳膊少腿这个问题根本就不是用户能搞定的。除非字体厂商花大价钱。

这是因为 Windows 的 ClearType 技术在将字体的矢量轮廓栅格化时,将横向笔画与像素网格纵向对齐,所以笔画在竖直方向上只能以像素为单位来定位。这样就无法精确定位了。而微软雅黑的 hinting 质量也不高,没有弥补多少。所以汉字上下浮动。一些字很明显变形了也是这个原因。

变形只在某些字号某些字上才会发生

可以调一下字号试试

或者换加粗的宋体吧