成都网站建设公司 专业成都网站制作服务.八年专注电商网站建设,客服热线:4008000583
行业资讯
当前位置:首页 > 网络营销 > 网站logo图相关以及之外的性能优化

网站logo图相关以及之外的性能优化

发布日期:2011-3-7 来源:

莫名的源起 – H1
这里的H1不是H1N1中那令人不寒而栗H1,而是HTML中的一个标签,一个重构者日常工作中不可避免的一个标签,一个不能被忽视的标签,一个在HTML的标题中排名第一的标题,历史上有过很多的关于H1的探讨,也有人在Twitter上进行过H1辩论(en),虽然大家会有一些分歧,但是对于H1的重要性,大家都一种认同,追求者众多,追法各异,各有各的手段,各有各的目的,满足了才是王道。

 

捏造的主题 – Logo与网站性能优化
谈到H1,无可避免的就会和SEO发生关系,同时也会把网站Logo扯出来说事;其实今天的女主角不是H1,SEO也不是男主角,网站Logo也不是男女主角,他们的故事很精彩,他们的关系也不简单;其实这里只是想单说一下网站Logo,网站性能优化相关。唉,其实这些东西早就在坊间流传,我这也说不出什么新点子,只是陈词滥调,左顾右盼,罗列出一些常识性的东西。(其实这两个字为什么老是出现呢)

 


预加载Logo图: 第一时间显示logo图和背景,避免空白和无背景;

合并背景图到Logo: 减少页面请求;

优化压缩logo: 尽可能减少文件大小;

在img中指定logo的替换文字: 提升页面可用性和兼容性;
在img中指定logo尺寸大小: 提升浏览器渲染效率;
闭合logo所在的img标签: 提升浏览器渲染效率;(这个还提!?)
对logo启用Gzip压缩?: 这个真的不行!!用长cache吧!!!

 1. 预加载Logo: 第一时间显示logo图和背景,避免空白和无背景
被说烂了的google的方式,老调重弹,在页面的内容还没有加载之前,先把需要的图加载:这样就会让logo第一时间显示出来(如果你不想让logo第一时间显示,请忽略),也不会出现光秃秃的没有背景图修饰内容。
下面是google首页的做法,其实,这个图是搜索结果页的logo和背景合并图,首页并没有用到,但是到了google首页的人有几个会不去搜索结果页呢…(这里多谢鬼哥提醒)

 

<body .... onload="...;if(document.images)new Image().src='/images/nav_logo8.png'"...>
 
2. 合并背景图到Logo: 减少页面请求
同事们都喜欢雪碧(css sprite),这个雪碧也不例外。其实,这一条和第一条有些重复了,为了显示文章内容的丰富性,不管了。

<h1> <a title="Go to Google Home" href="http://www.google.com/webhp?hl=en" id="logo">
Google<img width="164" height="106" alt="" src="/images/nav_logo8.png" />
</a></h1>

Powered By bg68.com ALl Rights 创想电子商务建站系统 NetsoftokECS 网站建设热线 400-8000-583
计算机软件著作版权号:2008SR05461 网站备案:蜀ICP备11013802号   电信增值业务许可:川B2-20140049
版权所有 © 2008-2016 成都网亚科技有限公司 | Chengdu NetAsia Network Technology Co.,Ltd
请使用Mozilla,Chrome,IE7.0以上浏览器访问,本站不再针对低版本浏览器予以支持!