<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="https://shkspr.mobi/blog/wp-content/themes/edent-wordpress-theme/rss-style.xsl" type="text/xsl"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	    xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	     xmlns:dc="http://purl.org/dc/elements/1.1/"
	   xmlns:atom="http://www.w3.org/2005/Atom"
	     xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	  xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>
<channel>
	<title>Super Tiny Website Logos in SVG &#8211; Terence Eden’s Blog</title>
	<atom:link href="https://shkspr.mobi/blog/2017/11/super-tiny-website-logos-in-svg/feed/" rel="self" type="application/rss+xml" />
	<link>https://shkspr.mobi/blog</link>
	<description>Regular nonsense about tech and its effects 🙃</description>
	<lastBuildDate>Fri, 26 Nov 2021 07:04:41 +0000</lastBuildDate>
	<language>en-GB</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.4</generator>

<image>
	<url>https://shkspr.mobi/blog/wp-content/uploads/2023/07/cropped-avatar-32x32.jpeg</url>
	<title>Super Tiny Website Logos in SVG &#8211; Terence Eden’s Blog</title>
	<link>https://shkspr.mobi/blog</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title><![CDATA[Super Tiny Website Logos in SVG]]></title>
		<link>https://shkspr.mobi/blog/2017/11/super-tiny-website-logos-in-svg/</link>
					<comments>https://shkspr.mobi/blog/2017/11/super-tiny-website-logos-in-svg/#comments</comments>
				<dc:creator><![CDATA[@edent]]></dc:creator>
		<pubDate>Sun, 26 Nov 2017 07:15:33 +0000</pubDate>
				<category><![CDATA[/etc/]]></category>
		<category><![CDATA[NaBloPoMo]]></category>
		<category><![CDATA[svg]]></category>
		<guid isPermaLink="false">https://shkspr.mobi/blog/?p=28781</guid>

					<description><![CDATA[You may not realise it, but bandwidth is expensive. It costs you time, money, and battery power whenever you download a file larger than it needs to be.  That&#039;s why I&#039;ve become a little bit obsessed with SVG - Scalable Vector Graphics.  They&#039;re the closest thing to magic that the web has when it comes to image compression.  Let me show you what I mean.  This is the standard Twitter Logo. It&#039;s 512 …]]></description>
										<content:encoded><![CDATA[<p>You may not realise it, but bandwidth is expensive. It costs you time, money, and battery power whenever you download a file larger than it needs to be.</p>

<p>That's why I've become a little bit obsessed with SVG - Scalable Vector Graphics.  They're the closest thing to magic that the web has when it comes to image compression.  Let me show you what I mean.</p>

<p>This is the standard Twitter Logo. It's 512 * 512 pixels and, even with hefty PNG compression, weighs in at around 20KB.</p>

<img src="https://shkspr.mobi/blog/wp-content/uploads/2017/10/Twitter-Logo.png" alt="" width="256" height="256" class="alignnone">

<p>Here's the same logo rendered as an SVG.  Because it is a vector graphic it can be magnified infinitely without any loss of fidelity.</p>

<img src="https://edent.github.io/SuperTinyIcons/images/svg/twitter.svg" width="256" class="alignnone" title="Twitter" alt="The Twitter logo is a bird">

<p>The uncompressed SVG is <strong>a mere 425 Bytes</strong>. Not a typo. You could fit over 3,000 of these images on a floppy disk.</p>

<p>That's why I have <a href="https://github.com/edent/SuperTinyIcons">released SuperTinyIcons on GitHub</a>. Eighty of the web's most popular logos - each image is under 1KB.</p>

<p><a href="https://github.com/edent/SuperTinyIcons"><img src="https://shkspr.mobi/blog/wp-content/uploads/2017/10/Screenshot-2017-10-25-edent-SuperTinySocialIcons-fs8.png" alt="Rows of icons - each one has the size printed next to it." width="606" height="552" class="aligncenter size-full wp-image-28787"></a></p>

<p>These files are suitable for use on the web - just use <code>&lt;img src="...</code>. They are supported by all popular browsers. I've also converted them to Android Vector Drawables, so they can be incorporated into your apps.</p>

<p>I've released them as MIT licensed files - although you should check the original images' licences. Some of these logos may be trademarked.</p>

<p><a href="https://github.com/edent/SuperTinyIcons">SuperTinyIcons on GitHub</a></p>
<img src="https://shkspr.mobi/blog/wp-content/themes/edent-wordpress-theme/info/okgo.php?ID=28781&HTTP_REFERER=RSS" alt="" width="1" height="1" loading="eager">]]></content:encoded>
					
					<wfw:commentRss>https://shkspr.mobi/blog/2017/11/super-tiny-website-logos-in-svg/feed/</wfw:commentRss>
			<slash:comments>24</slash:comments>
		
		
			</item>
	</channel>
</rss>
