<?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>Dominique Stender &#187; fonts</title>
	<atom:link href="http://www.st-webdevelopment.com/tag/fonts/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.st-webdevelopment.com</link>
	<description>Good software is only the beginning</description>
	<lastBuildDate>Sun, 26 Feb 2012 16:24:44 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=</generator>
		<item>
		<title>Web enabled custom fonts with cufón</title>
		<link>http://www.st-webdevelopment.com/general/2009/12/web-enabled-custom-fonts-cufon/</link>
		<comments>http://www.st-webdevelopment.com/general/2009/12/web-enabled-custom-fonts-cufon/#comments</comments>
		<pubDate>Fri, 18 Dec 2009 02:03:54 +0000</pubDate>
		<dc:creator>Dominique</dc:creator>
				<category><![CDATA[General]]></category>
		<category><![CDATA[canvas]]></category>
		<category><![CDATA[cufon]]></category>
		<category><![CDATA[fonts]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[style]]></category>
		<category><![CDATA[SVG]]></category>

		<guid isPermaLink="false">http://www.st-webdevelopment.de/?p=240</guid>
		<description><![CDATA[An introduction to Cufón, a fast text replacement with canvas and VML - no Flash or images required.]]></description>
			<content:encoded><![CDATA[<p><img class="alignleft size-full wp-image-249" title="cufon" src="http://www.st-webdevelopment.com/wp-content/uploads/2009/12/cufon.png" alt="cufon" width="190" height="400" />A frequent issue in web development is the clients wish for individual fonts for this site. This ranges from the understandable desire to maximize the companys corporate image by using the corporate fonts to more or less useless eye candy such as in headlines and menus.</p>
<p>The solution that comes up by reflex is to use graphics, often auto generated. But keep in mind that graphics are meaningless for search engines. Your SEO suffers if you use graphical headlines (the most important bits of information as far as search engines are concerned).</p>
<p>The next solution is flash. <a title="Google indexes flash content" href="http://googlewebmastercentral.blogspot.com/2008/06/improved-flash-indexing.html" target="_blank">Google is able to read flash</a>, so your SEO might suffer not that much. But what about your visitors? Ok, Flash is installed on virtually any PC these days. But not on the iPhone. So do you care about your mobile visitors? I think you should.</p>
<p>Furthermore, I use the <a title="The NoScript Firefox extension" href="https://addons.mozilla.org/en-US/firefox/addon/722" target="_blank">NoScript Firefox extension</a> as a security measure to disable JavaScript and many other "dynamic" content such as Flash by default. So I won't see your Flash headlines - all I see is a nasty empty box with the NoScript logo. Don't think I'll enable Flash just to see your headlines. Chances are that I leave your site in favor of another one with similar content, without flash.</p>
<p><span id="more-240"></span>Enter <a title="Cufón - JavaScript TrueType web fonts" href="http://cufon.shoqolate.com/generate/" target="_blank">Cufón</a>, a pure JavaScript implementation that is able to render TrueType fonts in <a title="Cufón - list of supported browsers" href="http://wiki.github.com/sorccu/cufon/browser-support" target="_blank">all modern browsers</a>. It works by converting your classical .ttf or .odf file into a JavaScript representation and rendering it through SVG. Check <a title="Cufón - how it works" href="http://wiki.github.com/sorccu/cufon/about" target="_blank">their in-depth explanation</a> how that works. It utilizes <a title="The JQuery JavaScript library" href="http://jquery.com/" target="_blank">JQuery</a> so you can easily use the <a title="JQuery selectors" href="http://docs.jquery.com/Selectors" target="_blank">JQuery selectors</a> to convert a headline into a nice font, or all paragraphs with a certain class:</p>
<pre class="xhtml">&lt;script type="text/javascript"&gt;
    Cufon.replace('h1', { fontFamily: 'Vegur' });
    Cufon.replace('.menu', { fontFamily: 'Myriad Pro' });
&lt;/script&gt;</pre>
<p>Check the <a title="Cufón - Usage" href="http://wiki.github.com/sorccu/cufon/usage" target="_blank">usage page</a> on the Cufón website for a detailed explanation.</p>
<h4>Why I prefer Cufón</h4>
<p>There are a few things that really make Cufón stand out:</p>
<p>For me the best thing about Cufón is that it degrades nicely. If JavaScript is disabled or blocked as in my case your visitor will still see the standard html tags in their natural font as defined in your StyleSheet. No content will disappear.</p>
<p>Search engines are save. Your headline is still there, will be indexed and your SEO won't suffer at all.</p>
<p>It is style-able. You can style your truetype headlines through Cascading Style Sheets just like you would without Cufón. Set the color, size etc just like you used to.</p>
<p>Cufón is easy. If you're even slightly familiar with JavaScript and CSS, you don't have to learn anything new.</p>
<h4>Conclusion</h4>
<p>Although Cufón has it's limits it is by far the best solution to the custom font issue on the web today.</p>
<p>Give it a try, I'm convinced you won't be disappointed.</p>
<p>Best of all while stable, Cufón is still in active development so we all can expect improvements and fixed to come up pretty frequently.</p>

<!-- using Like-Button-Plugin-For-Wordpress [v4.5.2] | by Stefan Natter (http://www.gb-world.net) -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http://www.st-webdevelopment.com/general/2009/12/web-enabled-custom-fonts-cufon/&amp;layout=standard&amp;show_faces=false&amp;width=550&amp;action=like&amp;colorscheme=light&amp;height=30&amp;locale=en_US" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:550px; height:30px"></iframe>
<!-- using Like-Button-Plugin-For-Wordpress [v4.5.2] | by Stefan Natter (http://www.gb-world.net) -->
]]></content:encoded>
			<wfw:commentRss>http://www.st-webdevelopment.com/general/2009/12/web-enabled-custom-fonts-cufon/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

