<?xml version="1.0" encoding="UTF-8"?>
<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>Chris Wallace &#187; fonts</title>
	<atom:link href="http://www.chris-wallace.com/tag/fonts/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.chris-wallace.com</link>
	<description>User experience designer and infamous WordPress developer.</description>
	<lastBuildDate>Sat, 21 Jan 2012 15:50:46 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>The Ultimate Web Safe Font List Reference</title>
		<link>http://www.chris-wallace.com/2008/12/19/the-ultimate-web-safe-font-list-reference/</link>
		<comments>http://www.chris-wallace.com/2008/12/19/the-ultimate-web-safe-font-list-reference/#comments</comments>
		<pubDate>Fri, 19 Dec 2008 21:14:53 +0000</pubDate>
		<dc:creator>Chris</dc:creator>
				<category><![CDATA[Tips & Tutorials]]></category>
		<category><![CDATA[fonts]]></category>
		<category><![CDATA[typography]]></category>

		<guid isPermaLink="false">http://www.chris-wallace.com/?p=336</guid>
		<description><![CDATA[If you&#8217;re like me, you frequently need a quick reference for finding the right web-safe font for a website. I&#8217;ve compiled a list that outlines the various fonts that Windows ships with, along with the Mac equivalent (or just very [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.typetester.org"><img class="alignnone size-full wp-image-442" title="typetester" src="http://cdn.chris-wallace.com/wp-content/uploads/typetester.jpg" alt="typetester" width="580" height="160" /></a></p>
<p>If you&#8217;re like me, you frequently need a quick reference for finding the right web-safe font for a website. I&#8217;ve compiled a list that outlines the various fonts that Windows ships with, along with the Mac equivalent (or just very similar).  Special thanks to <a href="http://www.ampsoft.net/webdesign-l/WindowsMacFonts.html">ampsoft.net</a>.<br />
<span id="more-336"></span></p>
<p>A great tool to compare web font settings is <a title="Great tool for checking web font settings" href="typetester.org">TypeTester.org</a>. It shows three different font settings next to each other with all the potential styles included.</p>
<p>I&#8217;ve added tags to each font that denotes which fonts come standard with each OS.</p>
<style type="text/css">
#help{
  float: right;
  height: 40px;
}
#help dt{
  font-weight: bold;
}
#help dt, #help dd{
  float: left;
  display: inline;
  padding-left: 5px;
  margin: 0;
  height: 40px;
  line-height: 40px;
}</p>
<p>#websafe h1{
  font: inherit;
}
#websafe ul, 
#websafe ul li{
  margin: 0; 
  padding: 0; 
  list-style: none
}
#websafe ul{
  margin: 0 0 15px 0;
}
#websafe div{
  padding: 10px;
  border-bottom: 1px solid #e2e2e2;
  border-left: 0;
  border-right: 0;
  clear: both;
  font-size: 14px;
}
.pc{
  background: url("http://cdn.chris-wallace.com/wp-content/uploads/ico_pc1.gif") no-repeat top right;
  padding-right: 25px;
}
.mac{
  background: url("http://cdn.chris-wallace.com/wp-content/uploads/ico_mac1.gif") no-repeat top right;
  padding-right: 25px;
}
.mac span{
  margin-right: -14px;
}
dd.mac span{
  height: 40px;
  line-height: 40px;
  display: block
}
#websafe div:first-child{
  border-top: 1px solid #e2e2e2;
}
</style>
<dl id="help">
<dt>Legend:</dt>
<dd class="pc">Windows</dd>
<dd class="mac">Mac</dd>
<dd class="mac"><span class="pc">Both</span></dd>
</dl>
<div id="websafe">
<div style="font-family: Arial, Helvetica, sans-serif">
<h1 style="font-family: Arial, Helvetica, sans-serif"><span class="mac"><span class="pc">Arial</span></span>, <span class="mac">Helvetica</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: 'Arial Black', Gadget, sans-serif">
<h1 style="font-family: 'Arial Black', Gadget, sans-serif"><span class="mac"><span class="pc">Arial Black</span></span>, <span class="mac">Gadget</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: 'Comic Sans MS', Textile, cursive">
<h1 style="font-family: 'Comic Sans MS', Textile, cursive"><span class="mac"><span class="pc">Comic Sans MS</span></span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: 'Courier New', Courier, monospace">
<h1 style="font-family: 'Courier New', Courier, monospace"><span class="mac"><span class="pc">Courier New</span></span>,  <span class="mac">Courier</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: Georgia, serif">
<h1 style="font-family: Georgia, serif"><span class="mac"><span class="pc">Georgia</span></span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: Impact, Charcoal, sans-serif">
<h1 style="font-family: Impact, Charcoal, sans-serif"><span class="mac"><span class="pc">Impact</span></span>, <span class="mac">Charcoal</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: 'Lucida Console', Monaco, monospace">
<h1 style="font-family: 'Lucida Console', Monaco, monospace"><span class="pc">Lucida Console</span>, <span class="mac">Monaco</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif">
<h1 style="font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif"><span class="pc">Lucida Sans Unicode</span>, <span class="mac">Lucida Grande</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif">
<h1 style="font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif"><span class="pc">Palatino Linotype</span>, <span class="pc">Book Antiqua</span>, <span class="mac">Palatino</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: Tahoma, Geneva, sans-serif">
<h1 style="font-family: Tahoma, Geneva, sans-serif"><span class="pc">Tahoma</span>, <span class="mac">Geneva</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: 'Times New Roman', Times, serif">
<h1 style="font-family: 'Times New Roman', Times, serif"><span class="pc">Times New Roman</span>, <span class="mac">Times</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: 'Trebuchet MS', Helvetica, sans-serif">
<h1 style="font-family: 'Trebuchet MS', Helvetica, sans-serif"><span class="pc">Trebuchet MS</span>, <span class="mac">Helvetica</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: Verdana, Geneva, sans-serif">
<h1 style="font-family: Verdana, Geneva, sans-serif"><span class="pc">Verdana</span>, <span class="mac">Geneva</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: 'MS Sans Serif', Geneva, sans-serif">
<h1 style="font-family: 'MS Sans Serif', Geneva, sans-serif"><span class="pc">MS Sans Serif</span>, <span class="mac">Geneva</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
<div style="font-family: 'MS Serif', 'New York', sans-serif">
<h1 style="font-family: 'MS Serif', 'New York', sans-serif"><span class="pc">MS Serif</span>, <span class="mac">New York</span></h1>
<ul>
<li>The quick brown fox jumps over the lazy dog.</li>
<li><strong>The quick brown fox jumps over the lazy dog.</strong></li>
<li><em>The quick brown fox jumps over the lazy dog.</em></li>
<li><strong><em>The quick brown fox jumps over the lazy dog.</em></strong></li>
</ul>
</div>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.chris-wallace.com/2008/12/19/the-ultimate-web-safe-font-list-reference/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
	</channel>
</rss>

<!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Minified using disk: basic
Page Caching using disk: enhanced
Database Caching 1/12 queries in 0.004 seconds using disk: basic
Object Caching 338/353 objects using disk: basic
Content Delivery Network via Amazon Web Services: CloudFront: cdn.chris-wallace.com

Served from: www.chris-wallace.com @ 2012-02-09 11:26:48 -->
