1

I'm trying to style the distance of text around images and I've experimented with margin and padding.

For testing purposes I tried 100px around images and what I have seen is that with padding the image is severely scaled down when viewed in the browser. So my concern is that this scaling down is reducing load speed and in that sense it’s bad for SEO.

To this respect it appears better to use margin instead of padding. Does anyone have a better understanding of the above issue?

3
  • Reducing load speed is never a bad thing for users and SEO in regards to bounce rate signals. Did you mean increasing load times?
    – dan
    Jun 3, 2016 at 1:43
  • Thank you for your comment. Let me try the following clarification: When speed of loading is reduced, load time is increased. Search engines do measure this, but I'm not sure if and how they treat it for search results. However, at increased load times, higher bounch rates are expected and this is a bad signal for search engines.
    – Michael
    Jun 3, 2016 at 6:54
  • When speed of loading is reduced, load time is increased Really? I think you're confusing things. What impacts SEO, and users, is how fast a page can be reached (i.e., "time to first byte") and loaded & rendered in the browser (i.e., "page load time"). Changing how an image is sized on the page without changing file size (i.e., "your page size" and "total image content") will not affect that significantly enough to impact your ranking. For more, see this: Moz: How Website Speed Actually Impacts Search Ranking.
    – dan
    Jun 3, 2016 at 7:07

3 Answers 3

2

You should resize an image manually, rather than using styles to resize it. As reducing the file size will improve your download and load speed.

Additionally, the effect of resizing an image via styles on rendering performance is small but present (at least when using background-image)

From http://www.artlebedev.com/tools/technogrette/html/browser-performance/

"It seems that modern browsers don’t know how to optimize such tasks and redraw the stretched image every time something is changed on the page."

In regards to using padding vs margin, whether or not your image is actually resized depends on the the box-sizing property www.w3schools.com/cssref/css3_pr_box-sizing.asp

Based on your description, it sounds like you are using the box-size: border-box mode which preserves the overall width and decreases contents size when padding is added.

At the end of the day, unless you are drastically resizing your image, you may not notice any real difference in performance and therefore Page load score.

But if you are using large images and scaling them down significantly, swapping those images for smaller ones may make a noticeable difference.

Since you are interested in optimizing your site for SEO, I suggest you have a look at https://developers.google.com/speed/pagespeed/insights/?url=google.com, where you may discover some things which may be having even more of an impact.

0

View ( that what client see) in webpage don't have (in normal case) impact on seo . Google robot reads text (html),and don't see webpage as human .

Only case that view can have negtive inpact on seo is when you have invisible (the same color as background etc.) text on site .

Scaling down images is good idea ( faster site = better user experience = better seo ) ,but only when you change size(server side - php for example) of the file (that is sent to browser) . Changing only width and height wont give you anything ( form seo point of view )

0

Doesn't effect. Google bots just crawl through the pages unlike the normal HTML pages that users view as. The bots feed on robot.txt files at the time of indexing for SEO purposes. It crawls through the urls being fed to it by the system eg, in xml format.

So, the images wrapped around with padding or margin is of least importance to google robots while they are crawling through your pages.

Check this link for more info

Google Bots Crawler and how they work

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.