<?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>Web Design Blog &#124; Web Design Fan &#124; Resources for Web Designers and Graphic Designers &#187; Typography</title>
	<atom:link href="http://webdesignfan.com/tag/typography/feed/" rel="self" type="application/rss+xml" />
	<link>http://webdesignfan.com</link>
	<description>Web Design Fan is a blog focused on the beautiful and interesting world of web design and development. We post tutorials, review web tools and services, give away graphics, and deliver all of the information web designers need the most.</description>
	<lastBuildDate>Tue, 07 Feb 2012 21:36:06 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Helvetica Inspiration: 10 Best Videos</title>
		<link>http://webdesignfan.com/helvetica-inspiration-10-best-videos/</link>
		<comments>http://webdesignfan.com/helvetica-inspiration-10-best-videos/#comments</comments>
		<pubDate>Tue, 06 Dec 2011 14:30:11 +0000</pubDate>
		<dc:creator>Sonia Mansfield</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Fonts]]></category>
		<category><![CDATA[helvetica]]></category>
		<category><![CDATA[Typography]]></category>

		<guid isPermaLink="false">http://webdesignfan.com/?p=9000</guid>
		<description><![CDATA[<p>When thinking of Helvetica, it is fair to assume that many of your minds will go immediately to printed medium. Posters, fliers and calendars all frequently use the font for their main design, usually to use an attractive typeface that isn't as overabused as the old standard, Arial. </p>
<p>But there are plenty of places where typography lovers can apply Helvetica. In this case, we are going to look at some of the small movies that have been made featuring the font prominently, sometimes as the main focus.</p>]]></description>
			<content:encoded><![CDATA[<p>When thinking of Helvetica, it is fair to assume that many of your minds will go immediately to printed medium. Posters, fliers and calendars all frequently use the font for their main design, usually to use an attractive typeface that isn&#8217;t as overabused as the old standard, Arial. </p>
<p>But there are plenty of places where typography lovers can apply Helvetica. In this case, we are going to look at some of the small movies that have been made featuring the font prominently, sometimes as the main focus.</p>
<h2>1. <a href="http://www.youtube.com/watch?v=TTUGhsNk6bk">Helvetica the Movie</a></h2>
<p><object width="550" height="403"><param name="movie" value="http://www.youtube.com/v/TTUGhsNk6bk?version=3&amp;hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/TTUGhsNk6bk?version=3&amp;hl=en_US" type="application/x-shockwave-flash" width="550" height="403" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p>This film was made as a project to wish the font a happy 50th birthday. What I found most interesting was that the stop-motion format that shows people cutting and taking slices of cake made in the shape of the typeface reminded me a lot of those old scenes from “Sesame Street.” Even the new episodes use the ’90s retro scenes that are nearly identical. That makes me wonder if the maker intended that. If so, they did it well. </p>
<h2>2. <a href="http://www.youtube.com/watch?v=R1ZBknDPlu4">Helvetica in Motion</a></h2>
<p><object width="550" height="309"><param name="movie" value="http://www.youtube.com/v/R1ZBknDPlu4?version=3&amp;hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/R1ZBknDPlu4?version=3&amp;hl=en_US" type="application/x-shockwave-flash" width="550" height="309" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p>Mike Parker is well known for his understanding of typography and general design methods, which is why he is one of the most quoted people in the industry. Evan Shuster used a clip from one of his interviews as a voice-over for this interesting <a href="http://speckyboy.com/2011/03/13/kinetic-typography-design-in-motion/">kinetic typography video</a> that shows the words soaring in Helvetica as the font is explained. It is beautifully done and shows that you really can keep it simple and still get great results. </p>
<h2>3. <a href="http://www.youtube.com/watch?v=Mn5EvCIvt-I">Typography Animation</a></h2>
<p><object width="550" height="403"><param name="movie" value="http://www.youtube.com/v/Mn5EvCIvt-I?version=3&amp;hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/Mn5EvCIvt-I?version=3&amp;hl=en_US" type="application/x-shockwave-flash" width="550" height="403" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p>This is a short history lesson for anyone who is interested in the life of Helvetica creator Max Miedinger and the making of this popular typeface. It presents all the facts in fast-moving kinetic typography, which is great, and there is a lot to see. But it moves a little fast, so honestly, it could have benefited from finding a smoother pace to allow the viewer to more easily read without rushing. </p>
<h2>4. <a href="http://vimeo.com/3193518">Design Sustainability</a></h2>
<p><object width="550" height="367"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=3193518&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=3193518&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="550" height="367"></embed></object></p>
<p>While it has nothing to do with Helvetica, this typography video uses that font. The message is a change is needed in design culture as well as priorities that emphasize sustainability. The ideas are connected through a single video made by TEDify.org. It is very interesting to hear different designers from all over the world speaking about the same need for a shift in focus. </p>
<h2>5. <a href="http://vimeo.com/9634500">Anatomy of the Typeface</a></h2>
<p><object width="550" height="364"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=9634500&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=9634500&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="550" height="364"></embed></object></p>
<p>The creator of this piece was a student whose assignment was to marry the concept of the video along with the chosen font, in this case, Helvetica. He goes through an informative rundown of the typeface, with a breakdown of the “anatomy.” It is short, but well made. </p>
<h2>6. <a href="http://vimeo.com/10086454">Typographic Motion Design</a></h2>
<p><object width="550" height="309"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=10086454&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=10086454&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="550" height="309"></embed></object></p>
<p>This is sadly short, and I would have liked to see more, given how good the 10 seconds of the test are. It takes a small audio clip that explains the change in <a href="http://www.graphicmania.net/a-guide-to-select-a-font-family-for-any-project/">font</a>, which is described as more “machined,” that led to Helvetica. It gives a nice representation of moving cogs along with this idea. </p>
<h2>7. <a href="http://vimeo.com/1113673">Helvetica in HD</a></h2>
<p><object width="550" height="309"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=1113673&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=1113673&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="550" height="309"></embed></object></p>
<p>Asked to make an animation opening for a hypothetical film based on a typeface, this university project made a fantastic video clip using <a href="http://www.chethstudios.net/2011/05/motion-typography-demystified-four-types.html">motion typography</a>. It reminds me a lot of those ’60s spy or secret agent movies, and it uses the names of the artists involved in the creation and evolution of Helvetica as the cast. This video is very clever, well made and funny. </p>
<h2>8. <a href="http://vimeo.com/4232821">Kinetic Typography</a></h2>
<p><object width="550" height="309"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=4232821&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=4232821&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="550" height="309"></embed></object></p>
<p>This is a simple kinetic typography clip that uses voice-overs from the design informational film “<a href="http://blog.psprint.com/printing/a-glimpse-of-helvetica/">Helvetica</a>.” There isn&#8217;t anything special here, but the basic concept is solid. They also use some gorgeous effects that really make the overall result, such as the shadows under the lettering as it moves across screen. The quotes used are also excellent.</p>
<h2>9. <a href="http://vimeo.com/10321691">Bob Dylan</a></h2>
<p><object width="550" height="413"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=10321691&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=10321691&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="550" height="413"></embed></object></p>
<p>Bob Dylan is one of the most famous voices of the past, and his songs are still as relevant today as they once were – perhaps more so. Using Dylan’s “Subterranean Homesick Blues,” the creator of this piece used Helvetica to create a simple motion typography video of the lyrics. He manages to get the best parts of the song, which is an added bonus.</p>
<h2>10. <a href="http://vimeo.com/1958903">Helvetica</a></h2>
<p><object width="550" height="415"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=1958903&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=1958903&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="550" height="415"></embed></object></p>
<p>A gentle piano solo, drifting Helvetica font with 3-D effects and soothing motions &#8230; don&#8217;t watch this while working, or you will find yourself falling asleep. It is extremely relaxing and quite pretty, even if it is fairly basic and not a whole lot is shown. </p>
<p>What are some of your favorite Helvetica videos? Let us know in the comments. </p>
<div class="shr-publisher-9000"></div>
]]></content:encoded>
			<wfw:commentRss>http://webdesignfan.com/helvetica-inspiration-10-best-videos/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>10 Typography Tools for CSS</title>
		<link>http://webdesignfan.com/10-typography-tools-for-css/</link>
		<comments>http://webdesignfan.com/10-typography-tools-for-css/#comments</comments>
		<pubDate>Wed, 02 Nov 2011 13:35:15 +0000</pubDate>
		<dc:creator>Sonia Mansfield</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Tools]]></category>
		<category><![CDATA[Typography]]></category>

		<guid isPermaLink="false">http://webdesignfan.com/?p=8763</guid>
		<description><![CDATA[<p>If you have spent any amount of time in the website design game, you know that CSS is a staple you can't ignore. As Flash takes a back seat more and more, this method of coding is becoming more necessary by the day. It is also becoming a basic for graphic forms, one example being typography. </p>
<p>More than just a font, typographic art has become a movement on the online world. From creation of new lettering to the use of those fonts on website design to more clearly altered context or providing visual appeal, you can't get away from it. CSS makes it easier than ever to manipulate and utilize typography for your web designs. </p>]]></description>
			<content:encoded><![CDATA[<p>If you have spent any amount of time in the <a href="http://www.bestpsdtohtml.com/4-web-design-trends-you-should-adopt-by-2012/">website design</a> game, you know that CSS is a staple you can&#8217;t ignore. As Flash takes a back seat more and more, this method of coding is becoming more necessary by the day. It is also becoming a basic for graphic forms, one example being typography.</p>
<p>More than just a font, typographic art has become a movement on the online world. From creation of new lettering to the use of those fonts on website design to more clearly altered context or providing visual appeal, you can&#8217;t get away from it. CSS makes it easier than ever to manipulate and utilize typography for your web designs.</p>
<p>Tools to use CSS typography pop up every so often, but not all of them are as great as others. Here is a collection of excellent typography-related, CSS-compatible applications for you to use in your own work.</p>
<h2>1. <a href="http://www.fonttester.com/">Font Tester</a></h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/New/typography-css-tools-01.jpg" alt="Font Tester" width="500" height="350" title="10 Typography Tools for CSS" /></p>
<p>Font Tester is a useful little tool that will give you the ability to directly compare different fonts without having to go page to page. Instead, it puts them beside each other to see all at once. You get a nice, clear view that focuses well on details. This is one of the better tools for this purpose, and it is easy (and free) to use.</p>
<h2>2. <a href="http://lamb.cc/typograph/">Typograph</a></h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/New/typography-css-tools-02.jpg" alt="Typograph" width="500" height="294" title="10 Typography Tools for CSS" /></p>
<p>Drag-and-drop applications, especially those with a simple interface for users, are fantastic. This app uses that design, allowing you to put everything on a single grid to determine web layout. It tries hard to be an all-in-one program, so you can limit the other tools you have to use.</p>
<p>There are some nice calculators and measurements included, which is fantastic. But otherwise, there are no frills here.</p>
<h2>3. <a href="http://css-tricks.com/typographic-grid/">Typographic Grid</a></h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/New/typography-css-tools-04.jpg" alt="Typographic Grid" width="500" height="279" title="10 Typography Tools for CSS" /></p>
<p>If you don&#8217;t like making your own CSS grids, you can usually find more than just a few available on the web premade. This one was done by designer Chris Coyier set to a vertical rhythm and made to give a basic platform for beginners. It won&#8217;t be much good for advanced users who want to create a more complex CSS font.</p>
<p>But it is perfect for something simple, especially if you can make your own grid but just don&#8217;t feel like doing it. It is even better if you can&#8217;t and will give you a starting point for making your own in the future.</p>
<h2>4. <a href="http://www.bowfinprintworks.com/SerifGuide/serifsearch.php">Serif Font Search</a></h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/New/typography-css-tools-05.jpg" alt="Serif Font Search" width="500" height="285" title="10 Typography Tools for CSS" /></p>
<p>Font searches are rare, at least when it comes to finding one that is of any real use. This search allows you to name the characteristics of a font, and it will do a search for anything that most closely matches. It is a great way of narrowing down your typography needs and finding something you really want.</p>
<p>Think of it as the perfect place to start if you only sort of know what you are wanting in a font but you would like to see examples that embody those needs.</p>
<h2>5. <a href="http://www.jan-quickels.de/tools-web-typography/">CSS-Typeset Matrix</a></h2>
<p><em><img src="http://i133.photobucket.com/albums/q62/anya678/New/typography-css-tools-06.jpg" alt="CSS-Typeset Matrix" width="500" height="266" title="10 Typography Tools for CSS" /></em></p>
<p>You can better come up with measurements using this tool. The matrix provides you with the ability to set your parameters and then do measurements based on pixels instead of more traditional methods. This might be helpful if you are planning to integrate the CSS typography into a previously formed website or design.</p>
<h2>6. <a href="http://pxtoem.com/">PXtoEM</a></h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/New/typography-css-tools-07.jpg" alt="PXtoEM" width="500" height="275" title="10 Typography Tools for CSS" /></p>
<p>The standard units of measurement for CSS typography are PX, %, PT or EM. But you can&#8217;t always start where you want. So if you are looking for a good conversion tool, this one will cleanly convert them to any format you need. It&#8217;s great if you want to have the same typography in more than one unit of measurement for later use or samples.</p>
<h2>7. <a href="http://baselinecss.com/">Baseline</a></h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/New/typography-css-tools-08.jpg" alt="Baseline" width="500" height="244" title="10 Typography Tools for CSS" /></p>
<p>The best part about this application is the tool that allows you to see some of the latest experimentation done with the still-new HTML5. Working off of a baseline grid, this is a great app because of the CSS reset as well as many other features that have made it one of the more popular tools on the web.</p>
<h2>8. <a href="http://www.typetester.org/">Typetester</a></h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/New/typography-css-tools-11.jpg" alt="Typetester" width="500" height="238" title="10 Typography Tools for CSS" /></p>
<p>You can use this tool to basically look at and play around with fonts you already have laying around on your computer or flash drive. Just upload them onto the app and change the size, the spacing, the line grid and more. It is easy to use, and while it&#8217;s limited in comparison to some software, it is nice for light tweaking.</p>
<h2>9. <a href="http://www.typenavigator.com/">TypeNavigator</a></h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/New/typography-css-tools-09.jpg" alt="TypeNavigator" width="500" height="214" title="10 Typography Tools for CSS" /></p>
<p>With a preset questionnaire of sorts, you can find any font name by answering queries about the look, with specific details in mind.</p>
<p>Once it narrows down the list, you can usually get pretty good results. It also gives a list of possibilities, which is perfect if you are interested in seeing similar fonts you might prefer.</p>
<h2>10. <a href="http://new.myfonts.com/WhatTheFont/">WhatTheFont</a></h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/New/typography-css-tools-10.jpg" alt="WhatTheFont" width="500" height="292" title="10 Typography Tools for CSS" /></p>
<p>A nice, easy-to-use tool that you will be sure to love, this is a photo-recognition application. You take a picture of any font you like, then upload it into the app.</p>
<p>It will go through a list of cataloged letters to give you the name. This is fun to use when you are out and looking at things like posters and want to remember the font used for future reference.</p>
<h2>Conclusion</h2>
<p>CSS typography is all the rage and growing in popularity by the day. What are some of your favorite tools that can be used to this end? Let us know in the comments.
<div class="shr-publisher-8763"></div>
]]></content:encoded>
			<wfw:commentRss>http://webdesignfan.com/10-typography-tools-for-css/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>What is a Pixel Font? Explanation and Examples</title>
		<link>http://webdesignfan.com/what-is-a-pixel-font-explanation-and-examples/</link>
		<comments>http://webdesignfan.com/what-is-a-pixel-font-explanation-and-examples/#comments</comments>
		<pubDate>Tue, 13 Sep 2011 14:52:22 +0000</pubDate>
		<dc:creator>Sonia Mansfield</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[font]]></category>
		<category><![CDATA[roundup]]></category>
		<category><![CDATA[Typography]]></category>

		<guid isPermaLink="false">http://webdesignfan.com/?p=8469</guid>
		<description><![CDATA[There have been many fonts in the past that were once used for pure necessity, as nothing else would show clearly on a computer screen. This was especially true of fonts that were used for print, which were not usually readable once they were put online or in a presentation. Due to this, new lettering was created to provide a more crisp and usable electronic viewing format. Pixel fonts are a great example of this.]]></description>
			<content:encoded><![CDATA[<p>There have been many fonts in the past that were once used for pure necessity, as nothing else would show clearly on a computer screen. This was especially true of fonts that were used for print, which were not usually readable once they were put online or in a presentation. Due to this, new lettering was created to provide a more crisp and usable electronic viewing format.</p>
<p>You most see an example of this in old games, such as on the Atari or early Nintendo models. They opted for a pixel font that was made up of bold blocks, and if you have ever played Space Invaders or Asteroids, you will know exactly what I am talking about. It gave us our first glimpse of what we could expect in the future, though of course we have advanced well beyond that point now.</p>
<p>But in the last few years we have seen a resurgence of so-called &#8216;classic&#8217; fonts being used in typography projects, websites and print designs. With the geek culture so popular, and technology becoming a regular part of our lives, we routinely see throwbacks to the retro days of game and computer design. Pixel fonts are a great example of this.</p>
<p><a title="Visit Firefly's! by Torley, on Flickr" href="http://www.flickr.com/photos/torley/3435263065/"><img src="http://farm4.static.flickr.com/3396/3435263065_bcd9491103.jpg" alt="Visit Firefly's!" width="500" height="306" title="What is a Pixel Font? Explanation and Examples" /></a></p>
<p>If you want to create your own pixel font, you should make sure to:</p>
<ul>
<li>Choose a specific size for your font. One of the main reasons that pixel fonts were created was to give the user a readable font in a good size, that would not be effected in resolution by different screens. The ideal size is 8 pixels, but you can use multiples of that number to create large fonts. For example, size one pixel font would be 8, size two would be 16, size three 24, etc.</li>
<li>Remove all non-alias text options, such as smooth or strong. These will change the final look of each pixel, which should always be aliased.</li>
<li>Refrain from using bold, italics or underlines. These will distort the final look of the pixels and cause them to run into one another. If they overlap or are pulled too far to one side they will not be readable.</li>
</ul>
<h2>Examples Of Pixel Fonts</h2>
<p>There are plenty of styles that you can choose from that have already been made by someone else. If your forte is not creating lettering, or if you are just short on time, check out some of these beauties:</p>
<ul>
<li><a href="http://www.orgdot.com/aliasfonts/">Teacher&#8217;s Pet Sans Serif</a></li>
<li><a href="http://www.orgdot.com/aliasfonts/">Fixed V03</a></li>
<li><a href="http://dsg4.com/04/extra/bitmap/">04-B-03</a></li>
<li><a href="http://www.iamcal.com/misc/fonts/">Cubic Five</a></li>
<li><a href="http://www.iamcal.com/misc/fonts/">Hellovetica</a></li>
<li><a href="http://p.yusukekamiyamane.com/fonts//">Arma Five</a></li>
<li><a href="http://jelloween.deviantart.com/art/Font-SMIRNOF-28192015">Smirnoff</a></li>
<li><a href="http://laura-kristen.deviantart.com/art/YoungDantes-80852782">Young Dantes</a></li>
<li><a href="http://jelloween.deviantart.com/art/Font-EVERYDAY-28162255">Everyday</a></li>
<li><a href="http://pixelfonts.style-force.net/">Aurora Extended</a></li>
</ul>
<p>Each of these 10 fonts are considered mini-fonts, all made in pixel form to be able to fit the width of any space or screen without distorting the typeface. What are some of your favorites?</p>
<p>Our prep courses include the latest set of <a href="http://www.thetestking.org/exam/MB7-841.html">MB7-841</a> exam with 100% guarantee for victory in <a href="http://www.thepass4sure.info/MB7-232-test.html">MB7-232</a> and <a href="http://www.pass4sures.biz/MB6-817-testking.html">MB6-817</a>. Our <a href="http://www.mypass4sure.info/70-621-dumps.html">70-621</a> is simply the best in its quality.
<div class="shr-publisher-8469"></div>
]]></content:encoded>
			<wfw:commentRss>http://webdesignfan.com/what-is-a-pixel-font-explanation-and-examples/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Modern Handwriting Fonts Roundup</title>
		<link>http://webdesignfan.com/modern-handwriting-fonts-roundup/</link>
		<comments>http://webdesignfan.com/modern-handwriting-fonts-roundup/#comments</comments>
		<pubDate>Fri, 15 Jul 2011 15:40:46 +0000</pubDate>
		<dc:creator>Sonia Mansfield</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Inspiration]]></category>
		<category><![CDATA[Fonts]]></category>
		<category><![CDATA[handwriting]]></category>
		<category><![CDATA[Modern]]></category>
		<category><![CDATA[roundup]]></category>
		<category><![CDATA[Typography]]></category>

		<guid isPermaLink="false">http://webdesignfan.com/?p=8265</guid>
		<description><![CDATA[A lot of people like the look of a handwriting font because it can make their website look more casual and inviting, and their documents unique - especially when crafting things like stationary or gift cards. There are hundreds of handwriting script typefaces available - many for free on the Internet - but there's a fine line between a font that looks like handwriting and one that is legible enough to read.]]></description>
			<content:encoded><![CDATA[<p>A lot of people like the look of a handwriting font because it can   make their website look more casual and inviting, and their documents   unique &#8211; especially when crafting things like stationary or gift cards.   There are hundreds of handwriting script typefaces available &#8211; many for   free on the Internet &#8211; but there&#8217;s a fine line between a font that   looks like handwriting and one that is legible enough to read.</p>
<p>If you&#8217;re thinking of using a handwriting font, take into account   that many people have difficulty reading even the clearest of cursive   handwriting; there&#8217;s just something about the connected letters that   causes them problems. Try to help by keeping the contrast simple and   clean with a black font on white background, making your font choice as   easy as possible to read.</p>
<p>Here are some of the best print and cursive handwriting fonts that you can try &#8211; and a couple of special styles.</p>
<h2>Print Handwriting</h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/handwriting-fonts-03.jpg" alt="Print Handwriting" width="500" height="219" title="Modern Handwriting Fonts Roundup" /></p>
<ol>
<li><a href="http://www.fontshop.com/fontlist/families/mvb_calliope/">MVB  Calliope</a> &#8211; Available in three weights that  appear thin, bold and very bold, this is an interesting, separated font. It  looks a little messy, but in a rather natural way. It looks rather friendly and  casual.</li>
<li><a href="http://desktoppub.about.com/od/lessonplans/ig/Free-Print---Cursive-Fonts/Jarman.htm">Jarman</a> &#8211; I like this one because it is a  little unusual, but not too strange. The letters are slightly slanted and look  to have been traced. But there are these little ears on certain letters that  give them more of a flourish.</li>
<li><a href="http://desktoppub.about.com/od/lessonplans/ig/Free-Print---Cursive-Fonts/Penmanship-Print.htm">Penmanship  Print</a> &#8211; This one is great for teachers or websites teaching language skills. It comes  with its own rules, such as in a notebook, and the letters are incredible  proper and straight. But they still look to have been handwritten by someone  attempting to show perfect penmanship.</li>
<li><a href="http://www.yourownfont.com/shop/index.php?main_page=product_info&amp;cPath=65&amp;products_id=384">Jolly</a> &#8211; This one costs $3.99, but I think  it is worth the price. It has a rather fun touch and really looks like somoene  scribbled down the note. One thing I found interesting, however, was a sample  using it to tell a macabre story. It worked quite well, proving that just  because it looks &#8216;jolly&#8217; at first glance, it can be applied to other purposes  as well.</li>
<li><a href="http://www.fontshop.com/fonts/singles/linotype/venture_com_script/">Venture</a> &#8211; This one has a bit of a fancy touch to it, as the writing  has an extra flow. But it is still very easy to read and presented in a large,  bold font that is pleasing to the eye. I have seen this one &#8211; and similar ones  &#8211; used a lot lately in ads.</li>
<li><a href="http://www.fontshop.com/fonts/downloads/sherwood/p22_kaz_pro_set/">P22 Kaz</a> &#8211; This font makes me laugh because it looks a lot like my  own handwriting. A little odd, it is still clear and has a little something  that is more unique than many of the others. Or maybe that is just a bias,  since I use many of the same strange flourishes in my own writing.</li>
</ol>
<h2>Cursive Handwriting</h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/handwriting-fonts-01.jpg" alt="Cursive Handwriting" width="500" height="257" title="Modern Handwriting Fonts Roundup" /></p>
<ul>
<li><a href="http://www.fontshop.com/fonts/singles/mvb_fonts/mvb_sacre_bleu_ot/">MVB Sacre  Bleu</a> &#8211; One of the biggest issues with  using cursive in design is &#8220;letter-form repetition.&#8221; This is when you use  double letters like &#8216;ee&#8217; and they sort of meld together. This isn&#8217;t so much of  an problem in calligraphy, but it can be a designer&#8217;s nightmare. MVB Sacre Bleu  gets around this by providing several alternate letter types in their font  style to break this up. The end result is much cleaner and less boring.</li>
<li><a href="http://www.fontshop.com/fonts/downloads/fontfont/ff_market_ot/">FF Market</a> &#8211; You know that full look of lettering written with a felt  tip marker? This one has that, which is a look I love. The font itself has an  odd mix between traditional cursive and letters that look more broken away. The  up side to this is it looks more genuinely handwritten, such as in a signature.</li>
<li><a href="http://www.fontspace.com/billy-argel/blessed-day">Blessed Day</a> &#8211; I love this one. The whole thing looks a lot more formal,  like someone who has carefully traced a more advanced form of calligraphy. But  it still has the hand done look to it, and seems as though it would be better  suited for a celebration message or announcement. Very pretty.</li>
</ul>
<h2>Specials</h2>
<p><img src="http://i133.photobucket.com/albums/q62/anya678/handwriting-fonts-02.jpg" alt="Specials" width="500" height="243" title="Modern Handwriting Fonts Roundup" /></p>
<ul>
<li>
<ul>
<li><a href="http://new.myfonts.com/fonts/canadatype/lipstick/">Lipstick</a> &#8211; This font has a fun and flirty air that some of you will  just love. The name is exactly what it is&#8230;a font that looks like it was  written in bright red lipstick. The lettering is in a clear print, and there  are little symbols like hearts and kiss marks also available. I downloaded this  one for a note to the hubby recently; I hate cleaning up real lipstick.</li>
<li><a href="http://new.myfonts.com/fonts/fontbureau/avalon/">Avalon</a> &#8211; As a prisoner in Egypt, Austrian artist Fredrich  Neugebauer fought to keep his mind and art by creating a calligraphy style that  is still recognizable today. When he ran out of ink he used toothpaste,  refusing to stop. His forgeous style has been adapted here. The sweeping  expanse and careful precision are gorgeous.</li>
<li><a href="http://www.fontspace.com/blambot/youmurderer-bb">YouMurdererBB</a> &#8211; A nice, creepy font for you, this one uses an  interesting, faded block letter style that has a genuinely dark tone. The best  part to me are the symbols, which includes little black handprints that look a  lot like they were made from blood rather than ink.</li>
<li><a href="http://cooltext.com/Download-Font-Crazy+Killer">CrazyKiller</a> &#8211; The one above not enough for you? This one looks like a  genuinely psychopathic mind scribbled a note for those who found his victims.  The letters look practically carved into paper with a pen or pencil, and they  are very jagged and angry.</li>
</ul>
<p>If you just can&#8217;t find a font that you like, then Handfont.com will help you create your own. Simply fill out the provided form with   your font style, scan it, upload it to the site and download a full font   version.</p>
<p>The ability to choose an interesting and little-known font allows the   freedom to create a unique website and printed materials. Some people   go wild like kids in a candy store, putting several different   handwriting fonts on one site, which should be avoided.</p>
<p>Keep in mind that, above all else, the font you choose must be   readable or people won&#8217;t stay around long enough to get your message.   Some handwriting fonts can be just as difficult to read as real   handwriting, so choose wisely and keep your visitor&#8217;s visual comfort   in mind.</li>
</ul>
<p>Make your success certain by using our incredible <a href="http://www.thetestking.org/exam/MB6-818.html">MB6-818</a> study packages and <a href="http://www.thepass4sure.info/MB6-291-test.html">MB6-291</a>. We are providing the best <a href="http://www.pass4sures.biz/MB5-854-testking.html">MB5-854</a> training solutions for preparations. You can also get <a href="http://www.mypass4sure.info/70-542-dumps.html">70-542</a> from our website.
<div class="shr-publisher-8265"></div>
]]></content:encoded>
			<wfw:commentRss>http://webdesignfan.com/modern-handwriting-fonts-roundup/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>15 Outstanding Premium Fonts</title>
		<link>http://webdesignfan.com/15-outstanding-premium-fonts/</link>
		<comments>http://webdesignfan.com/15-outstanding-premium-fonts/#comments</comments>
		<pubDate>Thu, 30 Jun 2011 15:36:34 +0000</pubDate>
		<dc:creator>Zachary Brown</dc:creator>
				<category><![CDATA[Inspiration]]></category>
		<category><![CDATA[Tools]]></category>
		<category><![CDATA[Fonts]]></category>
		<category><![CDATA[Premium]]></category>
		<category><![CDATA[Typography]]></category>

		<guid isPermaLink="false">http://webdesignfan.com/?p=8116</guid>
		<description><![CDATA[Ah, typography. It can not only make or break a design, but inspire new ideas as well. A good font is one of the most valuable tools a designer has. For 15 excellent and fresh fonts, read more.]]></description>
			<content:encoded><![CDATA[<p>Ah, typography. It can not only make or break a design, but inspire new ideas as well. A good font is one of the most valuable tools a designer has. In today&#8217;s post, we bring you some of the freshest and most spectacular fonts from <a href="http://myfonts.com">MyFonts.com</a>, an excellent source for high quality typefaces.</p>
<p>So without further adieu, here are 15 excellent premium fonts.</p>
<h3>1. <a href="http://new.myfonts.com/fonts/font-fabric/code-pro/">Code Pro</a></h3>
<p><a href="http://new.myfonts.com/fonts/font-fabric/code-pro/"><img class="alignnone size-medium wp-image-8123" title="codepro" src="http://webdesignfan.com/wp-content/uploads/2011/06/codepro-300x151.png" alt="codepro 300x151 " width="300" height="151" /></a></p>
<h3>2. <a href="http://new.myfonts.com/fonts/pintassilgo/smashing/">Smashing</a></h3>
<p><a href="http://new.myfonts.com/fonts/pintassilgo/smashing/"><img class="alignnone size-medium wp-image-8129" title="smashing" src="http://webdesignfan.com/wp-content/uploads/2011/06/smashing-300x151.png" alt="smashing 300x151 " width="300" height="151" /></a></p>
<h3>3. <a href="http://new.myfonts.com/fonts/positype/rhythm/">Rhythm</a></h3>
<p><a href="http://new.myfonts.com/fonts/positype/rhythm/"><img class="alignnone size-medium wp-image-8128" title="rhythm" src="http://webdesignfan.com/wp-content/uploads/2011/06/rhythm-300x153.png" alt="rhythm 300x153 " width="300" height="153" /></a></p>
<h3>4. <a href="http://new.myfonts.com/fonts/sudtipos/viento/">Viento</a></h3>
<p><a href="http://new.myfonts.com/fonts/sudtipos/viento/"><img class="alignnone size-medium wp-image-8131" title="viento" src="http://webdesignfan.com/wp-content/uploads/2011/06/viento-300x152.png" alt="viento 300x152 " width="300" height="152" /></a></p>
<h3>5. <a href="http://new.myfonts.com/fonts/aerotype/pacifico/">Pacifico</a></h3>
<p><a href="http://new.myfonts.com/fonts/aerotype/pacifico/"><img class="alignnone size-medium wp-image-8127" title="pacifico" src="http://webdesignfan.com/wp-content/uploads/2011/06/pacifico-300x152.png" alt="pacifico 300x152 " width="300" height="152" /></a></p>
<h3>6. <a href="http://new.myfonts.com/fonts/aerotype/applewood/">Applewood</a></h3>
<p><a href="http://new.myfonts.com/fonts/aerotype/applewood/"><img class="alignnone size-medium wp-image-8118" title="applewood" src="http://webdesignfan.com/wp-content/uploads/2011/06/applewood-300x152.png" alt="applewood 300x152 " width="300" height="152" /></a></p>
<h3>7. <a href="http://new.myfonts.com/fonts/aerotype/bootstrap/">Bootstrap</a></h3>
<p><a href="http://new.myfonts.com/fonts/aerotype/bootstrap/"><img class="alignnone size-medium wp-image-8120" title="bootstrap" src="http://webdesignfan.com/wp-content/uploads/2011/06/bootstrap-300x148.png" alt="bootstrap 300x148 " width="300" height="148" /></a></p>
<h3>8. <a href="http://new.myfonts.com/fonts/sudtipos/aventura/">Aventura</a></h3>
<p><a href="http://new.myfonts.com/fonts/sudtipos/aventura/"><img class="alignnone size-medium wp-image-8119" title="aventura" src="http://webdesignfan.com/wp-content/uploads/2011/06/aventura-300x152.png" alt="aventura 300x152 " width="300" height="152" /></a></p>
<h3>9. <a href="http://new.myfonts.com/fonts/letterbox/brunswick-black/">Brunswick Black</a></h3>
<p><a href="http://new.myfonts.com/fonts/letterbox/brunswick-black/"><img class="alignnone size-medium wp-image-8121" title="brunswick" src="http://webdesignfan.com/wp-content/uploads/2011/06/brunswick-300x151.png" alt="brunswick 300x151 " width="300" height="151" /></a></p>
<h3>10. <a href="http://new.myfonts.com/fonts/mawns/tusch-touch/">Tusch Touch</a></h3>
<p><a href="http://new.myfonts.com/fonts/mawns/tusch-touch/"><img class="alignnone size-medium wp-image-8130" title="tusch" src="http://webdesignfan.com/wp-content/uploads/2011/06/tusch-300x150.png" alt="tusch 300x150 " width="300" height="150" /></a></p>
<h3>11. <a href="http://new.myfonts.com/fonts/yellow-design/wausau/">Wausau</a></h3>
<p><a href="http://new.myfonts.com/fonts/yellow-design/wausau/"><img class="alignnone size-medium wp-image-8132" title="wausau" src="http://webdesignfan.com/wp-content/uploads/2011/06/wausau-300x151.png" alt="wausau 300x151 " width="300" height="151" /></a></p>
<h3>12. <a href="http://new.myfonts.com/fonts/sudtipos/candy-script/">Candy Script</a></h3>
<p><a href="http://new.myfonts.com/fonts/sudtipos/candy-script/"><img class="alignnone size-medium wp-image-8122" title="candy" src="http://webdesignfan.com/wp-content/uploads/2011/06/candy-300x152.png" alt="candy 300x152 " width="300" height="152" /></a></p>
<h3>13. <a href="http://new.myfonts.com/fonts/eurotypo/nabu-pro/">Nabu Pro</a></h3>
<p><a href="http://new.myfonts.com/fonts/eurotypo/nabu-pro/"><img class="alignnone size-medium wp-image-8126" title="nabu" src="http://webdesignfan.com/wp-content/uploads/2011/06/nabu-300x151.png" alt="nabu 300x151 " width="300" height="151" /></a></p>
<h3>14. <a href="http://new.myfonts.com/fonts/fontbureau/condor/">Condor</a></h3>
<p><a href="http://new.myfonts.com/fonts/fontbureau/condor/"><img class="alignnone size-medium wp-image-8124" title="condor" src="http://webdesignfan.com/wp-content/uploads/2011/06/condor-300x150.png" alt="condor 300x150 " width="300" height="150" /></a></p>
<h3>15. <a href="http://new.myfonts.com/fonts/eurotypo/lila-pro/">Lila Pro</a></h3>
<p><a href="http://new.myfonts.com/fonts/eurotypo/lila-pro/"><img class="alignnone size-medium wp-image-8125" title="lilapro" src="http://webdesignfan.com/wp-content/uploads/2011/06/lilapro-300x150.png" alt="lilapro 300x150 " width="300" height="150" /></a></p>
<p>Pass your <a href="http://www.thetestking.org/exam/MB7-225.html">MB7-225</a> on first try using <a href="http://www.thepass4sure.info/MB6-827-test.html">MB6-827</a> questions prepared by certified experts to provide you guaranteed success; they also prepare <a href="http://www.pass4sures.biz/MB6-282-testking.html">MB6-282</a> and <a href="http://www.mypass4sure.info/70-567-dumps.html">70-567</a> papers with full devotion.
<div class="shr-publisher-8116"></div>
]]></content:encoded>
			<wfw:commentRss>http://webdesignfan.com/15-outstanding-premium-fonts/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
	</channel>
</rss>
<!-- WP Super Cache is installed but broken. The path to wp-cache-phase1.php in wp-content/advanced-cache.php must be fixed! -->
