CODEWITHSUNDEEP
javascripthtmlcsssvg
JTerry
JTerry

Reputation: 101

Reasonable limit on SVG for website background, or ideas as to why this is not loading otherwise?

I'm making the assumption that the following is the result of the image's size:

I have two 10MB SVG (yes, they're huge), given to me by a graphic designer, that are supposed to act as background images for a client's landing page. It is a rather complex graphic that I don't think is suitable for SVG. I have tried to call them in a variety of ways without success, and have several (very small) svg images that render without issue, called into the DOM via:

<img id="logoImg" src="SvgLogo.svg" alt="OurLogo">

I imagine having a 10MB image is problematic for other reasons (though I haven't gzip'd); however, does anyone have any ideas if the size is the root of my issue?

Upvotes: 1

Views: 160

Answers (1)

Atherion
Atherion

Reputation: 594

10MB svg is definitely a problem.

If you don't need transparency .gif is a good compressible format.

If you need transparency you can shoot for .png but will be slightly bigger than gif.

Also when you export; make sure the correct size will fit on the website. Don't use width and height in the image tag.

If you go png then you can use a program like pngcrush

Upvotes: 1

Related Questions