has anybody tried puting logo in image sprite?

I see pros and cons.... Iam redesigning my site with lots of image sprites. I noticed some big companies use image sprite for logos some dont... I will report any rank/ changes if i get from it.

Whats your take on it?

I dont think alt tag is that big of a deal as I have internal linking in place.

They only negative I see is that people will not be able to save my logo but than again I never saved any logos eather. Ohh and if somebody print my page logo will not show up but url will so no biggie...

In my mind everything should be in sprite accept post/page images.

Marcink99,

There are tons of positives to using CSS sprites (mainly reducing the number of requests thereby reducing your website's load time) among others. I don't really see any negatives other than the ones you have mentioned. The alt attribute isn't a huge factor for rankings anyway and most of the time it is difficult to use it effectively for SEO.

Here is a good write-up on sprites,

http://www.alistapart.com/articles/sprites

Best,

Shawn

When you use CSS sprites, your HTTP requests decrease and thus the page loading time. It takes more time for your browser to download 2 x 10kb file than 1 x 20kb file, because it has to make 2 requests instead of 1.
As per my knowledge, there is absolutely NO CON using sprite images anywhere in your website. Just make sure that you place proper title and alt tag in your logo div / span or whatever you are using.

I encourage you to use sprite images instead of normal img tags anywhere possible ( including logo)

"proper title and alt tag in your logo div / span" ??? I thought that there is no way to add alt tag to class.

Sorry that's wrongly said... Put title only if you have a div, and title as well as alt if you have span...

for example

I've never found image sprites that useful. They always ended up larger than the sum of all my images (which negatively affected my load time). But then again, I wasn't loading countless small images either.

Personally, I really only see them useful if you have a very large site, your website is hosted on a shared server, or if you're targeting people with crappy internet connections.

I think you are missing something. It can't be larger than the sum of all images. Go check some tutorial about Sprite images first.

Secondly, even if your combined sprite is slightly bigger in size, your site might still load a lot faster!! Why??

It actually takes more time to process a http request then downloading the actual file. As i said in my first post, it takes more time to download 2 x 10KB file than 1 x 20KB file.

Another cool thing that will happen to your site when you use sprite images intelligently, is that, all the backgrounds / logo / icons or other images in your page will load at once. So the user will see it like ... zzaaapp and your site is loaded! THis is awesome because UI is really important. Here's what users think of your UI in common when it loads in the given time:

.1 sec to 1 sec -> user thinks the site is running locally ( on his / her own computer) and they would be more than happy to comeback anytime.
More than 1 sec - 3 sec-> User thinks the site is not running locally, but he/she will be happy with the site.
More than 3 sec to 10 second -> user starts feeling that something is being processed and they will soon get the result. This is the point where they start getting frustrated.

More than 10 Second -> Always show a message to user that this will take time, or he might never comeback


Now get the point! Always try to cut down the loading time as much as you can. So always use sprite where-ever you can. Also compress your Javascript / Css etc, but that's off topic..

proweb said:

I've never found image sprites that useful. They always ended up larger than the sum of all my images (which negatively affected my load time). But then again, I wasn't loading countless small images either.

Personally, I really only see them useful if you have a very large site, your website is hosted on a shared server, or if you're targeting people with crappy internet connections.

Click to expand...

I used them correctly.

The problem I had is that all of my images are compressed differently. Some images are compressed 30% and others 80%. However, to keep my quality up using Sprites I had to compress all my images to 30% which increased the size of the Sprite image. The size of the sprite image then exceeded the combined sum of all my other images previously, and while I did have less server requests, it did not make up for the fact that I was having to load 10+kb of extra images.

I have nothing against Sprites, in fact I wish I could use them...but my sites are designed in a way that Sprites are not benefitial for me. I can have the page load much faster without using them.

And yes, I did extensive load time tests to determine this.

Currently my website load time is .37 seconds, but apps like Facebook, Google+, and Twitter slow down some of my pages to 2 seconds.

I firt run all my images through photoshop save for web option and than combine them into sprite... I gues puting all pictures in one image and than saving them for web would work the same. Not sure if you have photoshop if not look for free alternative.