CSS background images weight impact
-
Hi,
do you think that the use of a single 1.8Mb background image sitewide could have a big negative impact and make a website disappear from SERPS?thank you
-
Hi Gianni,
There are a ton of reasons why your website might have slipped down the SERPs or dropped rankings. It's almost certainly not because of your image.
If you want, you can PM me your URL and I'll have a look.
Nick
-
Hello,
I think the heavy wheight background image has been wrongly pubilshed without the proper jpg compression during last months... (maybe a webdesigner distraction).Anyway now the website is disappeared from SERPS,
I'm trying to spot the possible reason of this penalization, currently the homepage ranks "A" with Seomoz on page optimization tool for the primary keyword, and it's domain metrics are equals or superior to many competitors that rank in first page for the same keyword.
With this heavy wheight background image the overall wheight of the internal pages is about 2.8 Mb (html/css + scripts + inline images + css background images ), I think this is a really uncommon and high value.
If Google considers a page as "loaded" when all of its assets were actually downloaded from the server and not when the event "load" fires on the browser I think it could be a very negative factor.
Thank you all for your replies
(and sorry for my english) -
That is a pretty large image file, I do not know how it would impact the SERPS.
If you are using photoshop and saving the background image as a Jpg, one thing I always try to do is lower the quality when saving for web to around 30-40 for really large images (can notice a difference but not too bad) or lower the quality to 51 if you want the image to remain pretty much the same.
Another thing that I like to do is use Smush.it (http://www.smushit.com/ysmush.it/) which is a free tool from Yahoo that will save you a little on filesize without changing the appearance of the image.
Hope this helps!
-
1.8mb is HUGE, what on earth is in there? I have a full background complex image for one of my websites - it's 90kb. Even the biggest CSS sprite image I have is just 30kb that includes most of my site template.
I recommend that you revisit this and use a different image format if not jpg/png/gif - for example never use tif or BMP online.
A background this size will really look poor to your first time visitors - this is exactly why Google want to start using speed as a ranking factor.
-
Just to add - try and compress the image as much as you can.
I'd be more worried about waiting for it to load and it having a knock on effect on your user experience.
DD
-
Hi Gianni,
of course the huge image won't make the website disappear from the serps - if you define "disappear" that the website is banned from the index.
I suppose you know that speed / loading time already matters, but it is just one of many ranking factors and Matt Cutts said that very rare pages are concerned. But imagine that there is a website with exactely the same condition as yours then the one with less loading time will be "better" than yours.
Even though the image is in the css defined it is not the best idea. Did you really compress the image yet?
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
Logo Image H1 Tag SquareSpace
We have a site hosted on SquareSpace: Roomhance.com Going through the on-page optimizaton tool, we noticed that the H1 tags weren't fully optimized. If you click on view source on the page, it shows 2 H1 tags on the home page: id="logoImage"><a <span="" class="html-attribute-name">href</a><a <span="" class="html-attribute-name">="</a>/">src="//static1.squarespace.com/static/5bcca055ab1a62465f5b9ee7/t/5c18feb270a6adf771765799/1588613682225/?format=1500w" alt="Virtual Staging For Real Estate | Roomhance" /> style="text-align:center;white-space:pre-wrap;">Virtual Staging The 2nd one shown above it the H1 tag we want. I'm wondering if the H1 tag in the logo image is hurting us for SEO? Can't figure out how to modify it in SquareSpace.
On-Page Optimization | | vikasnwu0 -
My website is not indexing the image.
Our website's images are not indexed. Will anyone help me? How will all images in my website be indexed? This is my website address: https://www.expertclipping.com/
On-Page Optimization | | jacky_risham0 -
Google's mobile-friendly update. How significant is the impact for us?
Hi guys. Recently I got an email from Webmaster-tools saying our site is poorly optimised for mobile devices, and that it’s going to heavily affect rankings from April 21st. I’m worried to say the least. We literary cannot afford a hit on traffic at the moment 😞 We rank well for niche terms like ‘customised diary’ and ‘personalised diary’. So question... Because we rank well for these very specific searches will we still take a hit on rankings after the update? Won’t our high relevancy for those search terms be enough to keep us high in the results? Also, do you know if this change is specific to the users device? E.g) Someone on a mobile device will get mobile-friendly results, whilst users on a laptop will get different results altogether? I'm just trying to get a sense of how much this update will effect us. Any isights, suggestion, or thoughts would be greatly appreciated. Our site. Thanks in advance. This community is invaluable to us 🙂 Isaac - TOAD Diaries.
On-Page Optimization | | isaac6630 -
Does Google penalize a page with the image tag with alt and without src?
Hi, I am curious whether Google penalizes a page with the image tag with a value in the "alt" attribute and without one in the "src" attribute? Would this count as stuffing? Sometimes you cannot put an image but you would like to get SEO benefit by having a keyword in an image?
On-Page Optimization | | Plivo0 -
Keyword density and it's impact?
How beneficial is properly optimised text on your website? I have been reading copy blogger and they seem to think it's almost the foundations and can have a massive impact - thus their software for improving optimised text. So... The way I see it, content can fit into 3 areas: 1. Over optimised - keyword stuffed 2. Produced without the keyword in mind and then small changes, maybe the keyword used once or twice within 500 words, slotted into the h1 tag. 3. Optimised - At the front of the h1 tag, density of roughly 3-4%, emphasised with bold and italic. What kind of impact can number 3 really have on rankings? If your position 7/8 could it be possible to see position movement from content changes? Cheers
On-Page Optimization | | activitysuper0 -
Html and css errors - what do SE spiders do if they come across coding errors? Do they stop crawling the rest of the code below the error
I have a client who uses a template to build their websites (no problem with that) when I ran the site through w3c validator it threw up a number of errors, most of which where minor eg missing close tags and I suggested they fix them before I start their off site SEO campaigns. When I spoke to their web designer about the issues I was told that some of the errors where "just how its done" So if that's the case, but the validator still registers the error, do the SE spiders ignore them and move on, or does it penalize the site in some way?
On-Page Optimization | | pab10 -
Seo'ing Sub domains for images
We are currently adding some performance improvement to our websites, to improve user experience. One of the things we are looking at is splitting of images over several sub-domains, to increase the number of images that can be downloaded at the same. We have seen that using key phrases within image names has an improvement in rankings. So, the question is should we create sub-domains as key-phrase.example.co.uk or as i1.example.co.uk? K
On-Page Optimization | | soltec0 -
Preferred Image Replacement Techniques
What is the preferred image replacement technique currently for CSS? I have been using the one that someone here at SeoMoz recommended a year or two ago, which was: Text to be hidden { #id { overflow:hidden; width:200px; //width of the image background-image: url(...); } #id span { display:block; width:1000px; height:1000px; }
On-Page Optimization | | TomBristol0