在sprite中使用logo标记好还是坏?
在建立网页时,我的一个同事使用CSS background-image属性显示任何标志,而不是使用HTML < img>
标签嵌入图片。同事报告说,它是减少HTTP请求的数量。他还向我展示了图片精灵,并表示Google使用精灵图片显示其徽标。
When building web pages, one of my colleagues displays any logo using the CSS background-image property, rather than embedding the image using an HTML <img>
tag. The colleague reported it was to reduce the number of HTTP requests. He also showed me an image sprite and said that Google displays its logo with sprite images.
我不同意他的做法,并向他表明主要的 Google.com页面
I don't agree with his approach and showed him that the main Google.com page loads their logo in an <img>
tag.
这是更好的做法吗?
编辑:
Facebook也在其首页上执行同样的操作,在img标签中加载标志,而在他们的个人资料页面上,他们使用 CSS sprite 。
从这里我的结论是,也许你应该加载你的主要标志在img标签,而对于其他标志
From this my conclusion was that perhaps you should load your main logo in an img tag while for the other logos such as in a footer or subpage you might want to load them in the background using CSS sprites.
UPDATED :我通常在加载标志时使用img标签,也知道为什么我们可能使用精灵。我的主要问题是:如果一个页面上有三个或更多的标志,最好的方法是加载它们。
UPDATED: I am routinely loading logos with img tags and also know why we might use sprites. My main question is: if you have three or more logos on a page, what is the better way to load them?
徽标是您网站内容的一部分,因此应在 img
标记中,而不是背景图片。它将有助于增加SEO(添加一个标题和alt属性也)和公司喜欢谷歌,Facebook,等人把他们的形象在一个精灵的原因是加载时间 - 不是SEO增强。
A logo is part of the content of your site, therefore it should be in an img
tag, not as a background image. It will help to increase SEO (adding a title and alt attribute will too) and the reason companies like Google, Facebook, et al put their image in a sprite is for load times - not SEO enhancement.
贵公司与Google或Facebook拥有相同的SE排名吗?不是。在那之前,请将徽标保持在其所属的 img
标记中。当你的网站一直是互联网上观看次数最多的网站,那么你可以开始考虑性能超过SEO。
Does your company have the same SE rank as Google or Facebook? No. Until then, keep putting the logo in an img
tag where it belongs. When your site is consistently the most viewed site on the internet, then you can start thinking about performance more than SEO.
另外,如果标志曾经调整(大小,颜色等),精灵必须重新创建以及CSS。如果它只是一个 img
标签,这个麻烦是不存在的。
Also, as an aside, if the logo ever had a tweak (size, color, etc), the sprite would have to be recreated as well as the CSS. If it was just an img
tag, this hassle is nonexistent.