Remix.run Logo
mk12 2 days ago

Another thing to watch out for with SVGs is how they appear in RSS readers or browser reader views. If you're using external SVG files then it should be fine. If you've optimized them by embedding into the HTML, then you need to be careful. If they rely on CSS rules in the page's CSS then it's not going to work well. For my website I try to make the SVGs self-sufficient by setting the viewBox, width, and height attributes, using a web safe font, and only relying on internal styles. You can still get some measure of light/dark mode support by setting fill or stroke to currentColor.

chrismorgan 2 days ago | parent | next [-]

My advice, for web pages: always specify the <svg> width and height attributes, or the width and height properties in a style attribute, because if non-inline CSS doesn’t load (more common, for various reasons, than most people realise), the SVG will fill the available width. And you probably don’t want your 24×24 icon rendered at 1900×1900.

(For web apps, I feel I can soften a bit, as you’re more likely to be able to rely on styles. But I would still suggest having appropriate width/height attributes, even if you promptly override them by CSS.)

anon1395 2 days ago | parent [-]

This, so much this. It is extremely annoying when I have a slow connection and I have to scroll down ages to get to the page content.

coder543 2 days ago | parent | prev [-]

They appear to have “solved” the RSS problem by only providing one sentence of content with each entry in the RSS feed.