: Will adding background images using JavaScript improve SEO? I've read that Google ranks sites that render faster higher than slower ones. Will it be beneficial to add background images using JavaScript

@Yeniel560

SEO-wise, no. Speed is a very small factor in ranking so unless your current load time is 20s+ it won't make a difference.

For your visitors however, it is a worthwhile goal. Slow load times may cause users to go elsewhere.

With regard to your specific method, it will increase speed, but only if you do it in a non-blocking way, e.g. load the images after window.onload. That way the whole page can load and be usable while images load. Make sure to specify the width/height of the images so that you don't get "repaints" (janky changes of layout) as the images load.

Vote Up Vote Down

@Margaret670

In recent Official Google Webmaster hangout, John Muller said, speed is ranking factor but people often think if they increase their load speed time from 2 second:200ms to 2seconds:100ms, then it will going to gives them some higher ranking slot then previous one, but that's not true.

They did not disclose what should be optimum load speed of any webpage, they just say if it take 10 seconds to load for Googlebot(Googlebot is really faster than our our normal ISP speed) then it might bad for SEO.

In my personal opinion, they might use some kind of table to gives different value for particular webpage speed for example, page that load in 100 ms to 200ms gives some X value, and page that load in 200ms to 300ms gives some lower value than X and so on...I am not 100% sure about it, but that is what make sense to me, after reading/watching many of official articles and videos.

There is nothing like you're making fool them by rendering that content after some seconds. But browser and Googlebot might already download all the resources which gonna used it later. So, It's purely depend on how you gonna use it those images with javascript. So simply open chrome dev tools and check yourself, how your JavaScript is render by browser. Googlebot will also render just like that, because they also use similar kind of webkit to render webpages.

And one last note, it is really good practice to load your important content first without waiting for loading other resources , for example for some content you can use css internally (For example the size of your body content, sidebar width, image width etc, so browser don't need to repaint same thing later), and load the rest of things (like backgrond images, extra css and javascript) asynchronously.

Vote Up Vote Down