Background

I contacted Chuck, the founder of Letterhead Font and asked him if I could feature the designs from his website and he graciously accepted.

Here is what Chuck had to say about Letterhead Fonts.

Letterhead Fonts began in October 1999 with 4 fonts.

As a sign painter who had come from a hand-lettering background, I couldn’t find the fonts I wanted – so I made them myself. Others also appreciated these styles and the website grew.

I’ve always preferred the older letters from the late 1800’s and early 1900’s, so that is what I focused on most. Other artists joined me later. Today, Letterhead Fonts has 18 regular contributors (including myself) and over 300 fonts (I have removed several over the years). All of these artists are professionals in the sign and graphics industries, which gives them a unique perspective
and insight as to the balance of the letters.

The purpose of Letterhead Fonts remains the same as it was 10 years ago– to make unique, high quality fonts that serve a purpose. If it isn’t something that we would use ourselves or if it already exists, we won’t do it.

Letterhead Fonts only offers Postscript OpenType fonts. We stopped offering the horrible format of TrueType in 2007. Postscript is the only format that ensures the letters look exactly the way the original artist drew them. TrueType on the other hand, adds new points to the letters– thereby changing the shape of the letters. It’s like painting a masterpiece and then having someone Xerox it 50 times. Very frustrating.

Because we make all of our own fonts and sell them directly from our site, we can provide good customer service to our users. If anyone has a problem, we can fix the issue right away for them (or help them install the fonts or provide other technical assistance). We have our own server and a very advanced account system that keeps track of the customer’s purchases. When we release a new version of a particular font, it is automatically updated in everyone’s account so they can download it again.

Though this method of being both the creators and exclusive distributors is more work, I prefer this way of doing business over selling through a third party. Besides, who wants to give away 30-50% of their sales to someone else?

Showcase of Letterhead Font Designs

Here are just some of the designs that were created from Letterhead Fonts.

Please do not copy or post these images anywhere. Special permission was granted by Letterhead Fonts to Design Informer to use these designs.

To see more of the Letterhead Font designs, please make sure you visit their gallery.

Well, thanks for viewing the Letterhead Font showcase. Do you like this vintage style typography? By the way, which one of the designs did you really like and why? Please let me know in the comments below.

One last thing, please bump and stumble this article so the rest of the design community can see these amazing designs. Thank you so much.

Related posts:

1. Incredible Black and White Typography
2. Ask the Expert – Typography Talk with Brian Hoff

Go to Source

Granted, some of these aren’t entirely that recent, but I haven’t posted about fonts in a while. All three of these fonts are from one of my favorite font designers, Billy Argel. All of them have somewhat of a western feel to them, which I enjoy. They can be downloaded free for personal use, but commercial licenses can be purchased if you need one.

1. Body Hunter

2. Outlaw

3. Monbijoux

a

Go to Source

It is a very useful application specially when trying to decide "which font to use" for a specific text as it can "display outputs of a custom text with various fonts" in a grid.

The application has support for TrueType, OpenType & Adobe Type1 fonts.

NexusFont can help installing/uninstalling fonts, finding duplicates, anti-aliasing, renaming & more.

Also, it can export the preview lists as images which is a nice feature when sharing the options with clients, colleagues, etc.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Follow WebResourcesDepot At Twitter And Get More Resources!

Tags: OpenType, TrueType, Windows

Related posts

• Free Fonts Showcase: Font Squirrel
• Windows 2008 Hosting Discount Offer: Easy CGI
• Typeface Sharing: Open Font Library
• Typedia: Encyclopedia of Typefaces
• Turn Your Handwriting Into Fonts: YourFonts

Go to Source

  

Every now and again we take a look around, select “fresh” high-quality free fonts and present them to you in a brief overview. The choice is enormous, so the time you need to find them is usually the time you should be investing in your current projects. We search for them and we find them, so you don’t have to.

In this selection we’re glad to present you PT Sans, FF Celeste Sans Offc Black, Secca STD, Cantarell and many other regular and experimental high-quality free fonts. Please read the license agreements carefully before using the fonts — the license can change from time to time.

New High Quality Free Fonts

PT Sans (PDF specimen)
The Russian type design company “Paratype” released an extensive free sans-serif family with 8 font weights: Regular, Italic, Bold, Bold Italic, Caption Regular, Caption Bold, Narrow Regular and Narrow Bold (700+ glyphs each). The family can be used for legal documents on screen and in print. The family contains glyphs to various Cyrillic languages as well Latin glyphs, signs, fractions, numerators etc. A very impressive free font.

FF Celeste Sans Offc Black Set (Registration is required)
FF Celeste Sans Offc Black Set comes in an easy-to-use format optimized for everyday use in Microsoft Office apps. You can use the style-linked (regular and italic in one menu item) FF Celeste Sans Offc for free.

Secca STD (2 Demo fonts) (Registration is required)
Secca is a fine and simple typeface honoring the roots of early German grotesque type designs but mastered for the needs of today. The weights work perfectly for body text. Two weights are available for free downloads: Secca Std Demo Regular and Secca Std Demo Bold. Designed by Andreas Seidel. A registration is required.

Fh_Lentil Regular
For more fonts, and other resources, visit Fictionalhead.com’s Fonts New font created for personal use. Additional families being developed (bold, italic, etc.) to be released at a future date.

Mr Jones Book
Mr Jones was originally conceived as a family for print design consisting of a sans and a headline. The lowercase are wide for legibility at small sizes while the caps are narrower to save space and keep an even balance of negative space when used in body copy. The overall widths of certain characters have been adjusted to almost extremes to keep an even balance of white space around each letter. He works well in body copy, but will need decreased tracking for larger settings. Two weights are available for free download: Mr Jones Book and Mr Jones Book Italic. Designed by Richard Miller.

Clutchee
Clutchee Font is perfect for t-shirts, also applicable for any type of graphic design, web, print, motion graphics etc.

Digitica
A very interesting, original geometric font, designed by Samuel Delabarre and available for free download.

Cantarell
The typeface is designed as a contemporary Humanist sans serif, and was developed for on-screen reading; in particular, reading web pages on an HTC Dream mobile phone. Each font file currently contains 391 glyphs, and fully support the following writing systems: Basic Latin, Western European, Catalan, Baltic, Turkish, Central European, Dutch and Afrikaans. To date, Pan African Latin has only 33% glyph coverage. Since the design is aimed at display on-screen at small sizes, the printed output (especially of the bold and oblique) may not work well.

tribbon ‘Layered’ font
This layered ‘ribbon’ style font was created by Dominic Le-Hair. It is a working ‘ribbon’ style font that consists of several layers and is available in both TTF and OTF font formats for free download.

Exus Pilot
An original geometric free font in True Type format. A good choice for poster design. Designed by Mauro Hernández.

Orbitron
A geometric sans-serif typeface intended for display purposes. It features four weights (light, medium, bold, and black), a stylistic alternative, small caps, and a ton of alternate glyphs. Orbitron was designed so that graphic designers in the future will have some alternative to typefaces like Eurostile or Bank Gothic.

Ripe Font Family
A geometric post-modern slab seriffed face. The serifs feature simplistic rounded terminals and its stroke is uniform. Ripe was designed to be a practical typeface. Each character is distinct, yet consistent. Its subtle differences are clear enough to be easily read at both high and low resolutions, perfect for print, web and screen media. The family has 4 weights (Regular, Light, Semibold, Bold) containing 577 characters in each weight.

Goudy Trajan Regular
Goudy Trajan Regular Goudy Trajanô is based on the drawings by American type designer Frederic W. Goudy of his rendition of the capital letters inscribed on the Trajan column. One of the most elegant typefaces in the CastleType library, Goudy Trajan works especially well at large sizes. The Regular weight (shown above) contains many alternate letters and discretionary ligatures for more versatile typography. It also includes the Cyrillic alphabet and over 100 classic fleurons. Click here to view all glyphs. Download specimen. “Goudy Trajan is possibly the finest font I have discovered” (D.S. from Omaha, Nebraska.) The Goudy Trajan family includes: Regular, Medium, and Bold. A single font is available for free download.

St Transmission (free for personal use only)
This free font is available in two weigths: thin and extrabold. It has standard OpenType features such as ligatures, slashed zero, contextual alternates and lining figures. The Extrabold weight is ideal for bold headlines. Designed by Sascha Timplan.

Keeparty (Large preview)
A very original, colorful typeface created by Eugene Rudyy.

LOT (large preview)
LOT is a free font applicable for any type of graphic design – web, print, motion graphics etc. It is a good fit for T-shirts and other items like logos or pictograms. Format: Opentype (.otf) Compatible: PC and Mac. The font contains 78 glyphs.

Recycle it font

Denne’s aliens
A hand-written, original, playful font with basic glyphs set. Designed by Denise Bentulan.

Pac Font
An older, yet quite original and attractive free font. Free for personal use only.

Merge
A very simple, yet playful and nice looking free font, designed by Philatype type foundry and released for free download in the OpenType format.

Further useful font colletions

previous Smashing Magazine’s collections

24 high quality free and stunning symbol fonts
Fonts are the vital need of any designer. But now a days font demands are increasing in regular computer users as well. Depending on the needs and modern trend we are going to list down some really beautiful and unique examples of 24 High Quality Free And Stunning Symbol Fonts. We hope these fonts will be useful for you.

40 free unique cartoon and comic fonts
Have you ever feel that traditional fonts are a little too boring and plain for your designs and artworks? Ever wanted to use fonts that are funkier, stylish and fun to look at? Cartoon and comic fonts are very popular and most people are only familiar with Comic Sans MS and thatís about it. We have now discovered 40 unique and refreshing cartoon and comic fonts for you to give your artwork and design that extra ummmppphhh. Here are a few for sneak preview and the full list is right after the jump.

5 Excellent Calligraphic Fonts

http://www.behance.net/Gallery/Groteskaa-Free-Typeface/252559
http://www.behance.net/Gallery/Gordala-Free-typeface/252229

© Smashing Editorial for Smashing Magazine, 2010. | Permalink | Be the first to comment | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine
Post tags: Fonts, typography

Go to Source

Walkway

Yanone Kaffeesatz

St Transmission – 200 Thin

Jalane Light

Colaborate

Engel Light

Sansation

Vegur

Titilium

Anivers

Delicious

Museo Sans

Mentone

Aurulent Sans

Junction

Existence Light

Fontin Sans

ComfortaA

Quicksand

BonevoCF

Go to Source

PS – If you have found any other beautiful typography on any other websites that you think deserves to be in this list, or on the next list, then feel free to drop in a comment.

Calm And Subtle Typography…

Thadeu Morgado

* * * * *

Juan Diego Velasco

* * * * *

84 Colors

* * * * *

Guerra Creativa

* * * * *

Meta Lab

* * * * *

Two 24 Studios

* * * * *

Food Inc Movie

* * * * *

Krop Creative Database

* * * * *

Gist

* * * * *

Iceberg

* * * * *

Speak Light

* * * * *

File Maker

* * * * *

Classic Clutch

* * * * *

Clear Spring

* * * * *

Africa Tour 2008

* * * * *

Host Riser

* * * * *

Lifejacket

* * * * *

Paramore Redd

* * * * *

Product Planner

* * * * *

Adcapital Industries

Go to Source

As Mark Boulton has so eloquently elucidated, @font-face embedding doesn’t come without its drawbacks. Font files can be quite large and FOUT—that nasty flash of unstyled text—can be a distraction for users.

Data URIs

We can battle FOUT by using Data URIs. A Data URI allows the font to be encoded right into the CSS file. When the font comes with the CSS, the flash of unstyled text is mitigated. No extra HTTP requests are required.

Don’t be a grinch, though. Sending hundreds of kilobytes down the pipe still isn’t great. Sometimes, all we want to do is spruce up our site with a little typographic sugar.

Be Selective

Dan Cederholm’s SimpleBits is an attractive site.

Take a look at the ampersand within the header of his site. It’s the lovely (and free) Goudy Bookletter 1911 available from The League of Movable Type. The Opentype format is a respectable 28KB. Nothing too crazy but hold on here. Mr. Cederholm is only using the ampersand! Ouch. That’s a lot of bandwidth just for one character.

Can we optimize a font like we can an image? Yes. Image optimization essentially works by removing unnecessary image data such as colour data, hidden comments or using compression algorithms. How do you remove unnecessary information from a font? Subsetting.

If you’re the adventurous type, grab a copy of FontForge, which is an open source font editing tool. You can open the font, view and edit any of the glyphs and then re-generate the font. The interface is a little clunky but you’ll be able to select any character you don’t want and then cut the glyphs. Re-generate your font and you’ve now got a smaller file.

There are certainly more optimizations that can also be made such as removing hinting and kerning information. Keep in mind that removing this information may affect how well the type renders.

At this time of year, though, I’m sure you’re quite busy. Save yourself some time and head on over to the Font Squirrel Font Generator.

The Font Generator is extremely handy and allows for a number of optimizations and cross-platform options to be generated instantly. Select the font from your local system—make sure that you are only using properly licensed fonts!

In this particular case, we only want the ampersand. Click on Subset Fonts which will open up a new menu. Unselect any preselected sets and enter the ampersand into the Single Characters text box.

Generate your font and what are you left with? 3KB.

The Font Generator even generates a base64 encoded data URI stylesheet to be imported easily into your project.

Check out the Demo page. (This demo won’t work in Internet Explorer as we’re only demonstrating the Data URI font embedding and not using the EOT file format that IE requires.)

No Unnecessary Additives

If you peeked under the hood of that demo, did you notice something interesting? There’s no <span> around the ampersand. The great thing about this is that we can take advantage of the font stack’s natural ability to switch to a fallback font when a character isn’t available.

Just like that, we’ve managed to spruce up our page with a little typographic sugar without having to put on too much weight.

Go to Source

Yes, we’ve been spoilt. We don’t need to think about using Verdana, Arial, Georgia or Cambria.

Yet, for a long time now, designers have felt we needed more. We want to choose whatever typeface we feel necessary for our designs. We did bad things along the way in pursuit of this goal such as images for text. Smart people dreamt up tools to help us such as sIFR, or Cufón. Only fairly recently, @font-face is supported in most browsers. The floodgates are opening. It really is the dawn of a new typographic era on the web. And we must tread carefully.

The New Typesetters

Many years ago, before the advent of desktop publishing, if you wanted words set in a particular typeface, you had to go to a Typesetter. A Typesetter, or Compositor, as they were sometimes called, was a person whose job it was to take the written word (in the form of a document or manuscript) and ‘set’ the type in the desired typeface. The designer would chose what typeface they wanted – and all the ligatures, underlines, italics and whatnot – and then scribble all over the manuscript so the typesetter could set the correct type.

Then along came Desktop Publishing and every Tom, Dick and Harry could choose type on their computer and an entire link in the typographic chain was removed within just a few years. Well, that’s progress I guess. That was until six months ago when Typesetting was reborn on the web in the guise of a font service: Typekit.

Typekit – and services like Typekit such as Typotheque, Kernest and the upcoming Fontdeck – are typesetting services for the web. You supply them with your content, in the form of a webpage, and they provide you with some JavaScript to render that webpage in the typeface you’ve specified simply by adding the font name in your CSS file.

Thanks to services like these, font foundries are now talking to create licensing structures to allow us to embed fonts into our web pages legally – which has always been a sticking point in the past. So, finally, us designers can get what we want: whatever typeface we want on the web.

Yes, but… there are hurdles. One of which is the subject of this article.

The differences between Web Fonts and other fonts

Web fonts are different to normal fonts. They differ in a whole bunch of ways, from loose letter spacing to larger x-heights. But perhaps the most notable practical difference is file size. Let’s take a look at one of Typekit’s latest additions from the FontFont library, Meta.

Meta Roman weighs in at 42 KB. This is a fairly typical file size for a single weight of a good font. Now, let’s have a look at Verdana. Verdana is 186 KB. For one weight. The four weight family for Verdana weighs in at 686 KB. Four weights for half a megabyte!? Why so huge?

Well, Verdana has a lot of information packed into its 186 KB. It has the largest hinting data table of any typeface (the information carried by a font that tells it how to align itself to the pixels on your screen). As it has been shipped with Microsoft products since 1996, it has had time to grow to support many, many languages. Along with its cousin, Georgia (283 KB), Verdana was a new breed of typeface. And it’s grown fat.

If really serious web typography takes off – and by that I mean typefaces specifically designed for the screen – then we’re going to see more fonts increase in file size as the font files include more data. So, if you’re embedding a font weighing in at 100 KB, what happens?

The Flash of Unstyled Text

We all remember the Flash of Unstyled Content bug on Internet Explorer, right? That annoying bug that caused a momentary flash of unstyled HTML page. Well, the same thing can happen with embedding fonts using @font-face. An effect called The Flash of Unstyled Text (FOUT), first coined by Paul Irish. Personally, I prefer to call it the Flash of UnTypeset Text (still FOUT), as the text is styled, just not with what you want.

If you embed a typeface in your CSS, then the browser will download that typeface. Typically, browsers differ in the way they handle this procedure.

Firefox and Opera will render the text using the next font in your font stack until the first (embedded) font is loaded. It will then switch to the embedded font.

Webkit takes the approach that you asked for that font so it will wait until it’s completely loaded before showing it you.

In Opera and Firefox, you get a FOUT. In Webkit, you don’t. You wait.

Hang on there. Didn’t I say that good web fonts weigh in considerably more than ‘normal’ fonts? And whilst the browser is downloading the font, the user gets what to look at? Some pictures, background colours and whatever else isn’t HTML? I believe Webkit’s handling of font embedding – as deliberate as it is – is damaging to the practice of font embedding. Why? Well, we can design to a switch in typeface (as jarring as that is for the user), but we can’t design to blank space.

Let’s have a closer look at how we can design to FOUT.

More considered font stacks

We all know that font stacks in CSS are there for when a user doesn’t have a font; the browser will jump to the next one in the stack. Adding embedded fonts into the font stack means that because of FOUT (in gecko and Opera), the user can see a switch, and depending on their connection that switch could happen well into any reading that the user may be doing.

The practicalities of this are that a user could be reading and be towards the end of a line when the paragraph they are reading changes shape. The word they were digesting suddenly changes to three lines down. It’s the online equivalent of someone turning the page for you when you least expect it. So, how can we think about our font stacks slightly differently so we can minimise the switch?

Two years ago, Richard Rutter wrote on this very site about increasing our font stacks. By increasing the font stacks (by using his handy matrix) we can begin to experiment with different typefaces. However, when we embed a typeface, we must look very carefully at the typefaces in the font stack and the relationship between them. Because, previously, the user would not see a switch from one typeface to another, they’d just get either one or the other. Not both. With FOUT, the user sees two typefaces.

By carefully looking at the characteristics of the typefaces you choose, you can minimise the typographic ‘distance’ between the type down the stack. In doing so, you minimise the jarring effect of the switch.

Let’s take a look at an example of how to go about this.

Micro Typography to build better font stacks

Let’s say I want to use a recent edition to Typekit – Meta Serif Book – as my embedded font. My font stack would start like this:

font-family: 'Meta Serif Bold';

Where do you go from here? Well, first, familiarise yourself with Richard’s Font Matrix so you get an idea of what fonts are available for different people. Then start by looking closely at the characters of the embedded font and then compare them to different fonts from the matrix.

When I do this, I’m looking to match type characteristics such as x-height, contrast (the thickness and thinness of strokes), the stress (the angle of contrast) and the shape of the serifs (if the typeface has any).

Using just these simple comparative metrics means you can get to a ‘best fit’ reasonably quickly. And remember, you’re not after an ideal match. You’re after a match that means the switch is less painful for the reader, but also a typeface that carries similar characteristics so your design doesn’t change too much.

Building upon my choice of embedded font, I can quickly build up a stack by comparing letters.

This then creates my ‘best fit’ stack.

This translates to the CSS as:

font-family: 'Meta Serif Bold', 'Lucida Bright', Cambria, Georgia, serif

Following this process, and ending up with considered font stacks, means that we can design to the Flash of UnTypeset Content and ensure that our readers don’t get a diminished experience.

Go to Source

There are a million ways to stylize your text into typography and using simple fonts is one way. However it may come across lame and ordinary if you’re just creating it by buying or downloading a font. It will be way more appreciated and eye catching if you really get into the spirit and create a font from scratch and truly spend time organizing it from the bottom up.

I found a really interesting tutorial on YouTube that I’d like to share with you all. It’s about stylizing a font like an architect would do it. It teaches you how to organize and draw, by hand, a truly good looking font in just a matter of seconds. If you have some skills and just 10 minutes this will truly change the way your designs or presentations look. Be patient and draw the lines correctly. The end result will even impress your closest friends.

Go to Source

Spending a lot of time, more than 20 years, in front of the computer doesn’t really help either I tell you. Alright, maybe my handwriting isn’t all that bad but I could still use a touch up to make it cool and visually stunning like some peoples.

So is there a way to improve and perfect your handwriting? Well, I found this quite interesting clip that will take your handwriting from bad to awesome in just a few minutes. And you can really choose any style you want. If you can find the font for it you can get your handwriting to look just like it.

All you really need is a font, ruled paper and a pen. Then it’s just to emulate the chosen font over and over again to perfect your handwriting. Before you know it you will have improved your handwriting considerably! Enjoy!

Go to Source

Go to Source

Go to Source

By Graham Smith

In another free font exclusive on Noupe, we present Tribbon, a tasty layered ‘ribbon’ style font created by Dominic Le-Hair. It has taken a few weeks of communications with Dominic to finally arrive with a interesting concept in font design. Tribbon is a working ‘ribbon’ style font, that consists of several layers and is available as a free download below. Tribbon is available in both TTF and OTF font formats.

Dominic also designed the popular ‘Clipper‘ font.

Tribbon Layer 1

Tribbon Layer 2

Tribbon Layer 3

Tribbon Layer 4 – Complete

Designer’s Profile

Dominic Le-Hair

I am a 32 year old Graphic Designer living and working in Peterborough, UK. I left Teesside University in 2001 with a BA Honours in Graphic Design.

I like to work on personal projects in my spare time as there are less restrictions than with most of the client briefs in my job. I try to be as original as possible with my work and like to occasionally combine hands-on media with digital techniques. I am inspired by designers who experiment with type, such as Craig Ward, Autobahn and Handmade Font.

How To Use The Font

The Tribbon font started as an experiment in Illustrator working with a simple custom brush I created. I used Myriad Pro Black as a loose basis for each character. The shadows were then added using a gradient overlay.

I was contacted by Graham who asked if I would be interested in creating a working font from my original work called Ribbon Alphabet on my Behance portfolio. I knew it would be a challenge to simplify it without losing too much detail. My solution was to break it up into three separate fonts (Tribbon A, Tribbon B and Tribbon C). These can be layered on top of one another to maintain the depth of the original. The fonts can be used this way in Photoshop, Illustrator, Indesign and QuarkXPress. Tribbon B can also be used on it’s own for a more simplified, 2D version of the original.

I named the font Tribbon as there are three fonts that resemble ribbons when combined (Tri + Ribbon).

Dominic has also kindly created a brief video on how to best use the Tribbon font. ‘How to use the Tribbon Font‘

Font Licencing and Distribution

All rights are reserved by Dominic Le-Hair. You may use Tribbon freely for non-commercial and personal purposes, such as creating a logo for a personal web site, free web design materials, goods or banners.

Please contact Dominic Le-Hair before using the fonts for commercial purposes, such as for commercial products, stores or companies logos, TV, books and magazines, or CDs.

Dominic Le-Hair has made this font available as an exclusive to Noupe and as such, you are not permitted to re distribute this font, to supply it on CD or distribute it directly in other electronic form. If you wish to link to this font in other ‘free font’ blog posts then please do so. Do not supply a direct download link, please direct your readers to this post only.

Download the font!

You can download Tribbon from our servers.

Go to Source

If the geek on your list loves playing The Rather Difficult Font Game by Kari Pätilä, and if that geek owns an iPhone or iPod Touch, she will adore The Font Game app, created by Kari Pätilä (game designer, web stuff), John Boardley (ilovetypography founder), and Justin Stahl (iPhone development). With 657 font samples, three levels of difficulty, and the ability to post your results to Twitter, it’s the perfect way to test or show off your type chops, or just learn.

Short URL: zeldman.com/?p=3309

Go to Source

This is a bookmarklet made for web designers who want to rapidly check how different fonts and font styles look on their screen without editing code and refreshing pages. 

Download the amazing and oh-so-practical Soma FontFriend bookmarklet.

Go to Source

Every once in a while, a design calls for a somewhat sketchy, hand-drawn font. Perhaps it’s a gig poster; perhaps it’s for an !!ENERGY DRINK!! company; perhaps it’s something completely different. As a designer, chances are you usually have a ton of work on your plate and can’t always hand-style lettering unique to each project. That’s where hand-drawn fonts come in.

Some are sketchy; some are based off of well-known fonts; all are great. Check out this list of 10 Awesome Free Hand-Drawn Fonts! If you like it, don’t forget to check out our list of the 10 Free & Amazing Display Fonts too.

SKETCH BLOCK

It looks like Rockwell, but sketchy! Great for display.

JONNY QUEST CLASSIC

This typeface has a nice mix of classy & old-timey elements. Legible & visually interesting.

TKACHENKO SKETCH

Slightly grungy, but not so angry and unreadable like a lot of grunge fonts.

Hit the jump for more free hand-drawn fonts!

UGLY QUA

A gorgeous, hand-drawn serif typeface.

ARSENALE WHITE

Playfully off-kilter, this font is great for designs aimed at younger children.

FFF TUSJ

This strong typeface has a hint of blueprint styling to it. Dig it!

DJ GROSS

Half graffiti, half grunge, all terrible name. But don’t let that deter you – this font is killer.

CLEMENTINE SKETCH

A smooth, flowing outlined font. Like Arsenale White, it’d be great for children-focused designs.

HANDVETICA

Where would any font list be without at least an indirect reference to the most popular font ever? Here’s a hand-styled version of Helvetica.

ELLIOT SIX

Scrawly kid-writing that will help make any design fun & unique.

Thanks for reading – please share this article!

Go to Source

Go to Source

The fonts are one of the most essential elements of every web or print Project; there have been many other selective collection font posts around the world.

Today we’re glad to present you Val Font, FILE Font, LOT Font and Cube Font designed by the FontFabric. Please read the license agreements carefully – they can change from time to time.

If you don’t want to miss out our next posts, you can Subscribe to the 2Experts Design Blog or follow us on twitter

VAL Font

VAL font is applicable for any type of graphic design – web, print, motion graphics etc and perfect for t-shirts and other items like logos, pictograms.

Format: Opentype (.otf)  Compatible: PC & Mac   Details: 215 Character Set, Manual Kerning, Tracking / Pairs   Price: Free

FILE Font

FILE font is applicable for any type of graphic design – web, print, motion graphics etc and perfect for t-shirts and other items like logos, pictograms.

Format: Opentype (.otf) Compatible: PC & Mac Details: 55 Character Set, Manual Kerning, Tracking / Pairs Price: Free

LOT Free Font

LOT free font is applicable for any type of graphic design – web, print, motion graphics etc and perfect for t-shirts and other items like logos, pictograms.

Format: Opentype (.otf) Compatible: PC & Mac Details: 78 Character Set, Manual Kerning, Tracking / Pairs Price: Free

Cube 02 Font

Cube 02™  is applicable for any type of graphic design – web, print, motion graphics etc and perfect for t-shirts and other items like logos, pictograms.

Format: Vector file (.eps) Compatible: PC & Mac Details: 36 Character Set, colored alphabets Price: Free

Enjoy this Post? Subscribe to the 2Experts Design Blog or follow us on twitter

Our blog is updated regularly with content related to web design, inspiration, tutorials, wordpress, freebies and much more. If you don’t want to miss out on future posts, you can subscribe by RSS or Email

Go to Source

Fonts listed are well-categorized with their styles & it is possible to view the most-downloaded ones that generally takes you to the most popular fonts.

The @font-face property of CSS3, which enables us to use any font in websites needs some work on fonts as every browser requires different formats:

• Original TrueType or OpenType Fonts for Firefox 3.5 and Safari
• EOT fonts for Internet Explorer
• SVG fonts for Opera, iPhone & Chrome
• WOFF fonts for Firefox 3.6+

Font Squirrel has ready-to-use @font-face kits for many popular fonts which include everything needed (and some examples). Also, it offers a @font-face generator to upload your fonts & create custom kits.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Follow WebResourcesDepot At Twitter And Get More Resources!

Tags: @font-face, CSS3

Related posts

• HTML 5 And CSS3 Cheat Sheets Collection
• How Typefaces Will Look On The Web? Web Font Specimen
• eCSStender: A JavaScript Library To Take Control Of Your CSS
• Better HTML5 & CSS3 Usage By Detecting Browsers Capabilities With Modernizr

Go to Source

Dingbats

They are highly compatible as they work in every image editor & can be resized or styled easily.

Also, with the @font-face property of CSS3, where it becomes possible to use any font in webpages, it is pretty sure that dingbats will find a new usage area for themselves.

Here are 30 quality, useful & free dingbats to improve your fonts library:

Pie Chart Font

Flamez

Dingbatz Formz DSG

WC Rhesus A Bta

WC Rhesus B Bta

Adhesive Nr. Seven

Pictogramz

Pixelfarm-Pets

Flowers (Hibiscus)

Stars

Tribalz

Maven Pictograms

Picto People

Skylines

ButtonButton AOE

Barcode Font

RecycleIt

Facetype

Travelcons

Font Notice

Font Notice2

Font Notice3

Ding Maps

Split Splat Splodge

Ossicles

Symmetric Things (and many other dingbats)

Roadgeek 2005

Guifx v2 Transports Font

Africa Wildlife B Mammals2

Recreation Dingbats

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Follow WebResourcesDepot At Twitter And Get More Resources!

No tag for this post.

Related posts

• No related posts.

Go to Source

Related Blogs

• Related Blogs on Designing With Fonts: 30 Useful & Free Dingbats

Go to Source

"Kindle is for anyone who loves to read—in fact, we’ve heard from thousands of vision-impaired customers and customers with learning disabilities over the past two years who have been helped tremendously by Kindle," said Amazon Kindle Vice President Ian Freed, Vice President.

"With some key modifications, we believe Kindle can be a breakthrough device for the blind, and the team is excited about making these enhancements," added Freed.

To make Kindle more useful for the blind, the Kindle team is currently working on an audible menuing system so blind and vision-impaired readers can easily navigate to books without the need for assistance. Blind people will also be able to listen to books with the "Read to Me" feature, just as they can currently do with the Kindle.

Amazon will also include a new "super size" font, which increases the number of font sizes from six to eleven. The seventh size will be twice the height and width of the current largest font.

Amazon’s new Kindle features are scheduled to be released next summer. The device saw record sales in November. Amazon said it was the most "wished" for, the most "gifted," and the number one best-selling product across all of Amazon’s product categories. Amazon was of course one of the top retail sites for Thanksgiving and Black Friday, and will likely be up there for the holiday season as a whole.
 

Related Articles:

> Barnes & Noble Says No Nook For Holidays

> Amazon’s Kindle Breaks Sales Record in November

> Walmart Wins Thanksgiving, Amazon Wins Black Friday

Go to Source

Photofonts allow users to make fonts with real calligraphic brush strokes, photos of everyday objects, multi-color hand lettering, scanned historical documents, felt pen doodles or any other set of bitmaps.

These advantages can be used by :

Photographers and Graphic Designers

• You can think of a photofont as a collection of bitmaps that can be inserted into your projects at the touch of a key. A series of plugins have been developed so you can use photofonts with the most popular publishing applications (QuarkXpress, through Photofont QX Illustrator, Photoshop, through Photofont Start, InDesign through Photofont ID). This makes it pretty easy to add color to your typography.

Web Designers and Developers

• … can use photofonts in standards-compliant, search engine friendly pages without converting the custom fonts used to “flat” graphics. In order to implement the photofonts into your projects you have to embed the font in the website, done through a conversion using Photofont Webready. The product of the conversion is a Flash®-based embedded web font, which is a combination of Flash® (.swf), JavaScript (.js) and CSS (.css). The glyph shapes are stored inside of an .swf file, while JavaScript and CSS is used to dynamically substitute normal HTML or XHTML text with the embedded web font in the user’s browser. If the browser does not support Flash® or JavaScript, or if those are disabled, the original HTML text is rendered unchanged.

• It sounds pretty complicated, but the results can be quite worthwhile. Look at the headline and subheads on this page. We made them all from Photofonts, but the headline (in the SmallStones font) was prepared in WebReady. If you click and drag across the letters in the headline you’ll see that they are selected just like regular text. You can copy and paste them and search engines will recognize them. If you try this on any of the subheads nothing happens – because we made them out of plain bitmaps.

Lettering Artists and Calligraphers

• …  can convert their lettering and calligraphy into fonts with photographic effects. This makes it a lot easier to use these kinds of fonts in digital documents.

Software Developers

• … can implement photofonts as resource files with the .phf extension. The plugins for Adobe Photoshop and InDesign can be automated for work flows that require personalization of outputs. And that nice keycap font just above would look pretty good in a user manual.

Photofonts are not very difficult to create. All you need is a paint program and a text editor. You just make the bitmaps you want to use for the characters and then you write an XML file to organize them. But if you don’t want to do the technical heavy lifting there’s also the possibility of creating your own photofonts or convert your existing artworks to photofonts with a special tool, BitFonter that does the XML stuff (among other things) for you.

Thousands of themes and templates on ThemeForest

Want to advertise here ? Contact us

Related posts

You might also like these similar articles:

1. Convert Microsoft Publisher Documents to Adobe InDesign – PUB2ID
2. Christmas Giveaway #1
3. Phantasm CS Illustrator Plugin Updated
4. PlanetQuark.com – the first website for QuarkXpress users launched
5. Movie Ranks

Go to Source

However, there are several free applications that can help you find, categorize, tag, preview, and install/uninstall your fonts. In this article, you’ll find 10 free applications that will help your better manage your font collection.

myFontbook

myFontbook is a free web application for organizing your installed fonts. It allows you to tag your fonts by keyword and gives you the ability to rate them so that you can quickly, making it easier to see your favorites. It has a pane for previewing fonts to help you in your font choices.

Notable features:

• Tagging and favorites lets you organize your fonts
• Metrics gives you insight about native letterspacing and line height of a font
• Body text preview provides realistic previewing of a selected font
• Proof sheet makes it easy to print font previews
• Being a webapp means that you can use it on any operating system

Font Book (Mac)

Font Book comes pre-installed in Apple computers and is a solid tool to use for font management if you’re an owner of a Mac. It has an intuitive and user-friendly interface, a trademark of Mac apps, and it has amazing font/organization features.

Notable features:

• Organize, install, remove, search your font collection in one interface
• Sorts fonts by categories (i.e. Modern, Traditional, Web)
• Create custom categories to organize your font collection
• Comes standard with Macs, no installation needed

Fontmatrix (Windows/Linux)

Fontmatrix is an open source font manager for Linux users; though it was recently made to work with the Windows OS as well. It is a great font management tool for power users, and is ideally suited for developers who can take advantage of the script console to extend and customize the application.

Notable features:

• Tagging feature makes organization easier
• Script console lets you extend and customize the application
• Interface is intuitive
• Displays meta information about a font such as designer, copyright info, etc.

Font Picker (Windows/Mac/Linux/Web Browser)

Font Picker is a free Adobe AIR desktop application that lets you manage and view your font collection. It’s simple and straightforward and can run in any operating system that can run the Adobe AIR framework. It also has a web-based version so that will search your  machine for installed fonts.

Notable features:

• Ability to mark fonts as favorites
• Remove fonts that you don’t like
• Simple and straightforward

sFont (Windows)

sFont is a free Windows font management tool that has a uncomplicated interface. Organize your font collection by tagging certain fonts as favorites. Quickly find TrueType or non-TrueType fonts using the Filter feature. You can review your fonts in a variety of ways including the ability to change the background and foreground colors.

Notable features:

• Add fonts to a favorites list
• Charmap view gives you a matrix preview of a font’s characters
• Customize colors to see fonts in different colors
• Filter feature lets you pick out TrueType or non-TrueType fonts

FindThatFont! (Windows/Linux)

FindThatFont is a simple and free tool for preview and categorize all the fonts installed in your system. You can organize fonts within the 30 categories that the application has. There’s also an extensibility featured called Extension manager for developers who’d like to customize how FindThatFont! works.

Notable features:

• Tag your fonts in one or more of the 30 categories
• Created using XUL language just like Firefox and Thunderbird
• Extension manager for developers to customize and extend the tool

Fonts++ (Windows)

Fonts++ is for Windows PC users that have many fonts installed on their computer. You can deactivate your unused fonts so that you don’t have to see your entire collection when looking at your fonts. You can also install/uninstall fonts with this app instead of the traditional Windows method

Notable features:

• Activate/deactivate fonts to help you navigate your collection
• Install/uninstall TrueType fonts quickly
• Small resource footprint

Cfont Pro (Windows)

Cfont Pro allows you to preview fonts even before you install them, a helpful feature if you have a external hard drive or portable media device that has fonts. It has proof sheets in case you want to print out fonts for reviewing purposes. The property viewer displays a ton of information about your fonts.

Notable features:

• Proof sheets allows you to print out font previews
• Property viewer lets you display font meta data
• Character Magnifier lets you zoom in and out to inspect font characters

Font Xplorer (Windows)

Font Xplorer is a popular freeware desktop application for managing your font collection. It has a filtering feature so that you can hone in on specific types of fonts. Unfortunately, it doesn’t support Adobe Type 1, OpenType fonts with PostScript outlines, which may be a deal breaker for some designers.

Notable features:

• Browse installed and uninstalled fonts
• Print sheets allow you to print out fonts using one of the apps templates
• Comprehensive font information is displayed
• Font Repair Wizard helps you repair font files

AMP Font Viewer (Windows)

AMP Font Viewer is an easy to use but robust font manager for Windows. It has support for a wide variety of font formats such as TrueType, OpenType, and Type1 fonts. It allows you to easily install multiple fonts, as well as removing installed fonts. There are several options for categorizing your font collection, which will help you tame your massive font collection.

Notable features:

• Several previewing options are available
• Several management options
• Supports most font formats
• Search feature gives you advanced search options

Related Content

• 20 Websites with Beautiful Typography
• 20 Creative and Unique Typefaces
• 45 Beautiful Free Fonts for Modern Design Trends
• Related categories: Tools and Graphic Design

About the Author

Jacob Gube is the Founder and Chief Editor of Six Revisions. He’s also a web developer/designer who specializes in front-end development (JavaScript, HTML, CSS) and PHP development. If you’d like to connect with him, head on over to the contact page and follow him on Twitter: @sixrevisions.

Go to Source

Go to Source

It’s essential for Designers to have a good understanding of typography and selection as the importance of typography in design can’t be neglected. The proper selection of typography can convert your normal design into attractive piece of art.

Among other things, effective typography manages to achieve three necessary objectives of web designing are Look, Appearance and Outcome which helps you to keep apart from normal wave.

Display typography is a potent element in graphic design, where there is less concern for readability and more potential for using type in an artistic manner. Below you’ll find Collection of Excellent Fresh Free Fonts To Enhance Your Designs by which you can save money and focus on making great applications.

The basic purpose behind this post is to show you Popular, Artistic and most importantly Free Downloadable font types to save your time searching them online. Direct download link available for the entire fonts.

You can also find some related free references at the end of the post. Just make sure to read the license agreements carefully as they can change from time to time.

You may be interested in the following professional typography and free fonts related articles as well.

• 30 Stunning Fonts To Enhance Your Designs
• High-Quality Free Fonts For Your Designs – Part II, Part II, Part III
• 50 Free Handwritten Fonts for Web Designers and Logo Artists
• 105 Free Grunge Fonts for Web Designers and Logo Artists
• Free Fonts to Enhance Your Designs – Part I, Part II, Part III
• 104 Free Fonts for Web Designers and Logo Artists
• Most Used Fonts By Professional Designers – (Free), (Commercial)

Please feel free to join us as you are always welcome to share your thoughts even if you have more reference links related to typography that our readers may like.

Don’t forget to subscribe to our RSS-feed and follow us on Twitter — for recent updates.

Go to Source

Go to Source

Every designer needs a good collection of free fonts, when working on design projects weather your designing for the web or for print its always essential to have a good  collection of fonts. Fonts can be very expensive especially when working on a design project with a small budget. This is a collection of the best free fonts created in 2009.

I hope you enjoy this post. If your a logo designer or if you just instantly fall in love with cool fonts then this is the perfect post for you. You can never have too many fonts so why not take a look through this awesome hand picked collection of awesome fonts. Feel free to leave a comment we would love to know which one is your favourite font and any fonts which you feel we may have been missed from the list which should of been included within the post.

1. FONT: Chaos Math

2. tiza

3. Facet

4. Marcelle font

5. DENNE Sketchy

6. FILE™ free font

7. UpperEastSide

8. Play

9. Cube™ font

10. MOD™ font

11. GoodPeace Free Font

12. Cube 02™ font

13. Lintsec

14. cedar

15. chewedkandi_font_weknow

16. portal

17. Bevel’sAdvocateMono

18. Vegur

19. Blackout

20. BB Free Font: Whiteboard Modern Demo

21. Oval™ free font

22. Chunk

23. Quick Sand

24. Sniglet

25. Dernière réalisation

26. Playtime Bold

27. Foldstruct

28. Groteska

29. Badabum

30. Amadeus

31. Burnstown Dam

32. Zag™ free font

33. ElliotSix

34. Chino ITC Pro

35. Ubuntu Titling

36. VAG-HandWritten

37. Edmunds

38. Amputa Bangiz Standard TTF

39. Dead Hardy – Ed Hardy Font

40. Exus-Pilot

41. kylie baker

42. Fh_Lentil Regular

43. SketchBlock Font

44. Public Gothic

45. G-Unit

46. Green Fuz

47. Distant Galaxy

48. Flux Architect

49. Chino

50. Keeparty

Bonus. FFF Tusj

Go to Source

A Brief History of Comic Sans

Comic Sans was created by Vincent Connare in 1994 for Microsoft. It was originally designed to be used with Microsoft Bob, but it was completed too late to be included in the program.

The font was based on lettering from comic books Connare had in his office, specifically Watchmen (lettered by Dave Gibbons) and The Dark Knight Returns (lettered by John Costanza).

On the left: Watchmen characters. On the right: The Dark Knight Returns cover

According to statements from Connare, he never intended the font to be released for general use, and only designed it to be used in comic-book-style speech bubbles within MS Bob.

Vincent Connare presenting in 2008.

The Life of Comic Sans in Microsoft Applications

The font ended up being included in Microsoft 3D Movie Maker, which used it in its pop-up windows and help sections. Later it was included with Windows 95 Plus! Pack and then became a standard font for the OEM version of Windows 95. Eventually it was included as a default font for Microsoft Publisher and Internet Explorer.

Some Well-Known Uses of Comic Sans

Comic Sans has been used on a number of well-known products. Beanie Babies have used the font on their tags since the late 1990’s. The 2004 Canada Day 25-cent collector coin also used the font. The Sims video game uses it as well.

The Origin of the Comic Sans Hate

One of the main reasons Comic Sans became the target of such hatred was its widespread usage, particularly when dealing with serious or formal subjects.

While Comic Sans was perfectly adequate in designs for children or designs related to comic books or cartoons, it had no place in business or professional work usage. It’s also ill-suited in content body text – it’s best used as a headline/heading font or short quote (such as in a comic book). But nevertheless, Comic Sans has cropped up all over the place.

The "Ban Comic Sans" Movement

The "Ban Comic Sans" movement started in 1999. It was reportedly started by Dave and Holly Crumbs, graphic designers from Indianapolis, after an employer insisted they use Comic Sans in a children’s museum exhibit.

While the group is a bit tongue-in-cheek, they do point out one of the biggest problems in amateur graphic design: disregard for appropriate typography choices. Where a professional designer will (usually) consider the impact their font and typography choices have on the overall tone of a project, an amateur will often just pick a font they like, disregarding the font’s impact on the final design.

Inappropriate Uses of Comic Sans

The single biggest complaint against Comic Sans is that Comic Sans portrays a very definite tone and feeling when it’s used; mainly, an immature, informal, childish mood.

A recent Flickr discussion in the Ban Comic Sans group talked about inappropriate uses in the wild.

Some of the uses shared were:

• Sign for swimming pool rules at a summer camp
• A grave marker
• Writing on a commemorative bench
• Sign for a bone marrow transplanet clinic
• Government job applications
• Teacher reviews for an art/graphic design department

A Showcase of Improper Usage of Comic Sans

Here are real-world examples of when you shouldn’t use Comic Sans.

By Aimee Daniells

By ocacsms

By Aimee Daniells

By Simon Clayson

By Justin Henry

By Tom Magliery

By Liz Hall

By Esther Simpson

By Marc Moss

By Marc Moss

By Raltaran

Technical and Aesthetic Drawbacks

While many who hate Comic Sans do so just because of its omnipresence, others hate it because of aesthetic and technical drawbacks. Both the kerning and weighting of the font are inconsistent, leading to a haphazard appearance in large swathes of text (or even small ones).

Todd Klein did an analysis of why Comic Sans isn’t even appropriate for comic books in his post, "Comic Sans Font Examined". It’s an interesting read, and points out some further shortcomings of the font.

Some Alternatives to Comic Sans

If you’re looking for a font that gives the same impression and feeling as Comic Sans but doesn’t come with all the negativity, give the following fonts a try.

Lexia Readable

P22 Kaz Pro

JM Doodle Medium

FF Friday Regular

Sharktooth Regular

Comic Strip

Ban Comic Sans has a list of Comic Sans alternatives available on their website.

Additional Resources about the Comic Sans Controversy

• Ban Comic Sans: An article by Dr. Christopher Scanlong on the font.
• Most Inappropriate Use of a Typeface: A thread on Typophile that includes multiple references to Comic Sans.
• Comic Sans: A profile of the font from Typophile.
• Not Funny: Fighting the Good Fight Against a Very Bad Font: An opinion piece by Mike Miliard on The Boston Phoenix site.
• The History of Comic Sans at ROFLThing NYC: A video history.
• Comic Sans, the Font of the Gods: A piece from Coding Horror.

Image Sources:

• Watchmen characters
• Batman: The Dark Knight #1
• Vincent Connare

Related Content

• 25 High Quality Free Fonts for Professional Designs
• 45 Beautiful Free Fonts for Modern Design Trends
• 20 Creative and Unique Typefaces
• Related categories: Graphic Design and Resources

About the Author

Cameron Chapman is a professional web and graphic designer with over 6 years of experience in the industry. She’s also written for numerous blogs such as Smashing Magazine and Mashable. You can find her personal web presence at Cameron Chapman On Writing. If you’d like to connect with her, check her out on Twitter.

Go to Source

Snow Leopard plus FontExplorer X equals screwed-up fonts in Firefox (especially Helvetica).

• Google Search on “Snow Leopard Firefox FontExplorer X” reveals numerous incidents of CSS displaying incorrectly in Firefox (wrong font weight, wrong font style) when Font Explorer X is on Snow Leopard Macs.
• My Flickr thread contains a screenshot demonstrating the problem plus a useful discussion of causes and possible workarounds.
• Disabling FontExplorer X solves the problem.

Go to Source

The Paper Pushers

Cut Out: Type made of 3D cutouts surrounded by the “negative space” left from the lifted pieces of paper. Sharon Pazner:

Folded: Handmade type project from Tyrone Ohia: Each letter is made from a folded sheet of A4 paper, which is then placed on a lightbox. The dark areas that form the strokes are where the paper folds and overlaps, therefore letting less light from the lightbox through:

Cut and Taped: Well, it’s much thicker than your regular paper, and bigger, but still, close enough -Sex C on Legs from Marc Wathieu:

Outdoorsy Types

Grass from the geniuses behind Handmade Fonts

Fly high in the sky with Photoshop Star’s Cloud Text tutorial:

Watch the ice melt on this clever cover design by Ruiter Janssen symbolizing the increasing desperation of the plane crush survivors:

Foodies? Yum-yum

High Fiber Foodonts (Handmade Fonts again):

Got a sweet tooth? Open wide for a Candy font all the way from Montreal, by Julien De Repentigny:

For comfort food, nothing beats some pb & j (minus pb) via lovely For The Love of Type Blog:

Wanna see an awesome Food Font Fight? Come on over to a Typhphile:

Oh, and here’s a glass of milk from Jónas Valtýsson, to finish off your meal. Don’t spill!

Clean Freaks? Here we go

Typography Soap is now available from The Soap Lab

Juvenile Delinquents

Crayon letters courtesy of some very creative soccer moms:

Balloons will never look the same, thanks to some creepy clown types (no offense, I just have a mild case of Coulrophobia):

Let there be light from a German photographer ~Blickwinkel~ on Flickr?

For your viewing pleasure

Backbreaker font:

or better yet, Stick Figure Kamasutra font:

And now we’ll have to erase your memory so you will not be able to transfer all this valuable information to the aliens… Cause this is exactly the TYPE of knowledge they are after

Go to Source

For lots of web designers and type lovers, there’s much to talk about when it comes to typography and the web. Traditionally, embedding specific fonts into live content (that is, not just using a font to create a text graphic) has been difficult because it means that the end-user needs to have the font installed on their own computer system in order to view the page as designed.

However, with the inclusion of @font-face in CSS3, most web browsers will be able to display fonts that are stored on a web-server, so that as long as users are using a compatible browser, they can see the typography as the designer intended. Of course, there’s a catch. Because of the way font licensing works, it is still incredibly difficult for designers to embed fonts outside of a small library into their designs without violating the foundry licenses or intellectual property claims.

In May, the service Typekit was announced as a way to facilitate foundries and web designers to work together and offer more fonts for web page embedding. The service officially opened to the public last week.

How Typekit works is that you can subscribe to a monthly (or yearly if you prefer) plan to have access to Typekit’s font library of professional, fully licensed fonts for your websites. The price is pretty reasonable; the portfolio plan costs just $49.99 a year for access to Typekit’s complete library on up to five different websites.

Today, Typekit has announced that they have partnered with FontFont, a well-respected and high quality font house. FontFont fonts like FF Meta, FF Speak and FF Netto are now available for Typekit users to embed into their sites.

This is great news for web typography fans because it means that even more great fonts can become available to more designers — and in a way that makes the font license holders comfortable.

I’ve been using Typekit for several months and am impressed with its growing library of fonts. As foundries continue to grapple with the licensing issues that will affect web typography and design, it’s good to see solutions like Typekit continuing to gain momentum.

What do you think about the state of typography on the web?

Tags: css3, fontfont, fonts, typekit, web typography

Go to Source

It is simply a well-prepared HTML/CSS setup that displays most important elements like headings, lists, text in different colors/sizes, emphasis of them & more.

The download comes with the Georgia set by default & new typefaces can be configured by updating the CSS file.

Considering every font is becoming a web font with @font-face & web designers will probably be purchasing more fonts, analyzing how the font will be rendered becomes more important.

To see a demo of Web Font Specimen, click here.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Dreamhost $50 Discount Code: WRD
Follow WebResourcesDepot At Twitter And Get More Resources!

Tags: @font-face, Typeface

Related posts

• No related posts.

Go to Source

Web fonts are here. Now what? In Issue No. 296 of A List Apart for people who make websites, Nice Web Type’s Tim Brown debuts Web Font Specimen, a handy, free resource to see how real fonts really look on the web; and Jason Santa Maria discourses on web type, showing how to avoid using fonts that don’t work on the web, and achieve graceful pairings of fonts that do.

Go to Source

DO NOT use too many different font faces on the page

You may have 1,000+ fonts downloaded on your computer, but when they’re being displayed all on the screen at the same time, you’re not going to have many people impressed. Not only will this cause your website visitors to have a hard time reading, it’s also going to just make you look tacky.

DO NOT switch from serif and sans serif fonts multiple times

Sticking with the theme from above, switching from Serif and Sans Serif fonts multiple times per page will do you more harm than good. Readibility is the #1 thing you need to be worried about with your website, because no matter how “cool” it looks, if the visitor can’t read whats on the page easily, they’re going to leave.

DO NOT ignore planning for font increase by the viewer

Older audiences will adjust the font size view on their screens in their internet browsers settings, so no matter what font you default the text at, it might not be showing this way for the visitor. This can cause errors if you aren’t taking larger fonts into account for headers and other various items which might break the design if they break into two lines.

DO NOT use Sans Serif fonts for large bodies of text

Sans Serif fonts are great for the clean, uniform look – but when you’re putting together large bodies of text (10+ lines), switching your fonts to a serif font will allow for better readability as the curves and shapes help guide the eyes better than the straight, uniform lines of the Sans Serif fonts.

DO NOT overuse font replaces like Cufón and siFr

Cufón and SiFR are just two of the various ways you can replace text in your browser to give off a more custom look, but use it wisely. Using the font replacement for the entire web page is going to be a bit overload and will distract the visitor from the actual reason you’re typing on the page in the first place – you want them to be able to read it. I would advise to generally stick with headings and calls to action for your font replacements and leave the major bodies of text as regular, web safe fonts.

DO NOT overdo the emphasis in your text

A good writer will be able to emphasize the words they want without using bold, italics or underlines. If you’re text is littered with tons of strong and italics and underlines, you might want to rethink what you’re doing. Utilizing the codes to emphesize specific items wisely will make things look – and read – thousands of times better.

DO NOT forget to utilize font stacks in your css codes

When I’m building websites, I tend to like using helvetica for the text of specific items. I realized early on that not a lot of people will have purchased helvetica, so the font won’t display properly on their page if I simple use “font: helvetica;” in my css, so I read up on font stacks and use them religiously now. Basically, it gives you the option to use any font you want, and also allows for back ups in case the visitor doesn’t have the specific font you give first. An example would be like this: “font: Helvetica, Arial, sans-serif”, which basically says that you want the page to display helvetica for the text, and if thats not available on the visitors computer, you want the page to use arial – and if for some reason that isn’t available, it gives a generica sans-serif font.

DO NOT type in all caps – use text-transform when you need it

So, lets just say that you want your headings to all be capitalized – how do you do it? DO YOU EXCESSIVELY TYPE IN ALL CAPS? There are a few problems with that. First, it’s annoying. Second, it’s not easy to edit them out later on if you redesign your site and do not want all caps anymore. So what do you do? Utilize the text-transform css code. Here’s an example.

text-transform: uppercase;

DO NOT forget to use accent characters when needed

Typing words like Cufón numerous times on the page without the accent characters will make you look sloppy and uneducated. Yes, it’s true. So utilizing the accent characters will allow you to display the words properly (it’s really polite to do so) and it also is a lot easier than you’d think. You can get a full list of accent characters by visiting this article from w3.org.

DO NOT – I repeat – DO NOT use comic sans or papyrus on anything!

This is actually a rule across all forms of design that use typography – web, print, ect. Never – I repeat – never use comic sans or papyrus on anything. It’s tacky and deserves to be lumped in with IE6 – and we all know how bad people hate IE6, right?

DO use line height to your advantage

Relying on the default line height for your text will bite you in the ass in the long run because it’s honestly just not enough room between lines and will not allow you to work with a proper baseline grid (more on that below). I tend to keep my line height 5-6 px larger than the font size I choose – so if my font size is set to 13px, I will make the line-height 18px.

DO use the proper text colors on the page background

The best thing to do (in my opinion) is to utilize an off-white (#F8F8F8) font on a black background and a dark gray (#252525) font on a white background. It helps the contrast become minimal and doesn’t strain the eyes as much for your visitors when they’re reading your content.

DO use web safe fonts as often as possible

When you’re building your font stacks, make sure you’re using the web safe fonts as much as possible. The fonts that are installed on both PC and MAC can be found by reading this article on ampsoft.net. When you have a knowledge of what web safe fonts are out there, you can better prepare your website for the break down from your original fonts to the fonts that are most common and would be used if the visitor didn’t have your font installed.

DO use a proper hierarchy for your pages

Utilizing a great hierarchy for your web pages will allow your visitors to quickly scan your content and find the most important items. Nothing is worse than getting to a page and having to spend 30-60 seconds looking for the content and finding out what it’s even about. Use proper title tags for the most important sections and smaller title tags for less important sections. You can also use different colors and spacing to vary the hierarchy for your pages.

DO make use of a baseline grid

A consistent vertical grid will help readability for your web page and also increase the visual appeal of the overall design. Proportion and balance shouldn’t be broken by font sizes, so sticking to a proper vertical baseline grid will allow your page to flow naturally from top to bottom as well as from left to right. Acheiving this effect is as simple as these few lines of code below. Notice that the line height for the text is the same size as the margin for the bottom of the paragraph blocks of text (you should also keep this in mind for header tags as well as images).

body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	line-height: 18px;
}

p { margin: 0 0 18px 0; }

DO utilize white space as much as possible

Keeping up with the above do, utilizing white space in your design will help your pages readability. It will allow your page to breathe and give your visitors eyes a rest. Don’t believe me? check out the image below and let me know which item you think is best for readability.

DO keep the use of centered text to a minimum

Centering text is good for one line or maybe a speech bubble in your design, but requiring your visitors to read large blocks of text will cause their eyes to drift and not follow line by line as easily as if the text were aligned to the left or right.

DO use shade variations to help areas stand out more

When designing your next site, keep this in mind – if your body text is black and your sidebar text is a medium gray color, your content will visually stand out and be read faster than the sidebar items. The same goes for blockquotes and other non-essential items that you do not want to take away from the attention of your main content areas.

DO make sure you know about, and use, proper letter spacing for titles

This is an item I didn’t think about very often – until recently. If you are utilizing the text-transform css code I wrote about above, you’re going to notice that the text might be a bit hard to read. Utilizing the letter-spacing property in your css will help curve that problem. There is an example below but please know that the letter spacing is relative to your fonts default letter spacing so it might work differently for various fonts and font sizes.

h1 { text-transform:uppercase; letter-spacing: 1.25em }

DO make use of a typographic scale in your css codes

Using a proper typographic scale will allow your page to be read easily by the visitor and will allow you to keep the hierarchy in tact that we spoke about above because if your main text is 12 pixels, then the blockquote and paragraph fonts will be 125% larger by using the 1.25em code in your css. If you properly use a typographic scale, it will actually look like a flieght of stairs – like the image below.

body { font-size: 12px; }
h1 { font-size: 5.0em; }
h2 { font-size: 4.0em; }
h3 { font-size: 3.0em; }
h4 { font-size: 2.0em; }
blockquote { font-size: 1.5em; }
p { font-size: 1.25em; }
input { font-size: 1.0em; }
small { font-size: 0.75em; }

Anything I missed?

Let me know in the comments. I’m ready to learn from you all and I hope you learned a thing or two from me today as well. Thanks for taking the time to read my article and don’t forget to share it with friends through email and social networks if you enjoyed it.

About the Author

Mike Smith is a blogger who writes about social media and marketing and he’s a blog designer at Guerrilla.

Go to Source

  

Every now and again we take a look around, select “fresh” high-quality free fonts and present them to you in a brief overview. The choice is enormous, so the time you need to find them is usually the time you should be investing in your current projects. We search for them and we find them, so you don’t have to.

In this selection we’re glad to present you Madawaska ExtraLight, Apparatus SIL, League Gothic, Contra and many other high-quality free fonts. Please read the license agreements carefully before using the fonts — the license can change from time to time.

New Free Fonts For Your Designs

Madawaska ExtraLight
Madawaska is a rugged slab-serif font in 7 weights with fractions, old style numerals & lining numerals. When you’re using Madawaska Jeans or Madawaska River styles in an OpenType savvy application, common letter pairs will be automatically replaced by custom pairs for a more realistic, gritty effect. Madawaska ExtraLight is available for free download and use.

Apparatus SIL
The Apparatus SIL fonts were designed to provide most of the symbols needed to reproduce the textual apparatus found in major editions of Greek and Hebrew biblical texts. The fonts include the basic ASCII character set plus some international characters, Superscript characters, Certain Greek, Hebrew, Gothic (Fraktur) and other letters used for manuscripts and special punctuation. The font family consts of 4 weights: Regular, Italic, Bold and Bold Italic. It was designed for optimum clarity and compactness when printed at small point sizes.

League Gothic
League Gothic is a revival of an old classic Alternate Gothic No.1. It was originally designed by Morris Fuller Benton for the American Type Founders Company (ATF) in 1903. The company went bankrupt in 1993. And since the original typeface was created before 1923, the typeface is in the public domain. This font is a display sans-serif, available for free download and use in personal and commercial projects. Designed by The League Of Moveable Type.

Contra
This legible font family comes in 2 weights: Regular and Italic. It works best for headlines and in large sizes.

Sorts Mill Goudy
A ‘revival’ of Goudy Oldstyle and Italic, with features among which are small capitals (in the roman only), oldstyle and lining figures, superscripts and subscripts, fractions, ligatures, class-based kerning, case-sensitive forms, capital spacing. There is support for many languages that use latin script. Currently there is no bold, but artificial emboldening by a web browser isn’t especially offensive with these fonts. Serif text/display-font, designed by Barry Schwartz.

Calluna Regular (registration is required)
Calluna is a typeface with flow. Calluna supports a very wide range in languages and is a very complete OpenType typeface. Each font has overall 723 glyphs. To download the free regular weight, you’ll have to register at MyFonts.com. Designed by Jos Buivenga.

Goudy Bookletter 1911
A classic vintage serif font, based on Frederic Goudy’s Kennerley Oldstyle. Designed by Barry Schwartz.

Aeroportal Font
The round, easily legible forms of the typeface Aeroportal were inspired by European modernistic and British humanistic traditions, as well as contemporary Scandinavian design. Aeroportal expresses friendliness, simplicity and credibility, and evokes images of waves, motion and travel. Aeroportal is primarily intended for headline and logo use, but its clear and no-nonsense form makes it suitable as a body text typeface as well. The typeface is developed in regular, medium and bold. Notice: the license is restricted for Charter BT Pro (a supplementary typeface), not for Aeroportal. (via imjustcreative)

Public Gothic Family
Public Gothic Family is a little industrial, little vintage, little condensed, little bold. Public Gothic is a new font family, free to use in all your designs, commercial or non commercial. PB family members are PB Square, PB Vintage, PB Circular, PB Federal. It’s compatible with any OS (Mac T1, Win OTF, Win TTF).

ArtBrush
A brushed script font for informal occasions. The @font-face-kit is included.

FFF Tusj
A distinctive, original script font that is supposed to be a handwritten version of Georgia. The font works best in very large size.

ITC Chino Bold Italic
International Type Corporation released a new text family ITC Chino that consists of 10 fonts. One weight, Chino Black Italic was released for free.

Burnstown Dam
An original playful typeface that can be useful for family-related websites. Available in the OpenType format.

Deibi
An original, playful free font, created by Wete, a Spanish type designer.

Tex Gyre Schola
A clean, strong, academic sans-serif font that can be used for formal documents and scientific works.

Juvelo
A font family from The Crud Factory, inspired by Diethelm-Antiqua, and named ‘jewel’ in Esperanto. An italic is being developed.

Programming fonts: ProFont for Windows, Mac and Linux and Anonymous Pro (thanks, Chris Apalodimas).

Sovereign™ Regular
Sovereign is a highly original serif family from G-Type’s Nick Cooke. Available for Mac and Win.

Experimental Free Fonts

Groteska
A blocky experimental font by Alberto Rodríguez.

VAL

Digitica
Another geometric font by the French type designer Samuel Delabarre.

Layer Cake and Soraya
Layer Cake (the first screensot below) is an isometric multiple layered type with capital letters A-Z, available only in Illustrator AI format. Soraya (the second screenshot) is half serif, half sans serif with capital letters A-Z, also available only in Illustrator AI format. Designed by Jakob Nylund.

Badabum
Where does typography become art? Well, for instance in this font. The letters are difficult to read, but geometric forms are abstrac and captivaning. A creative font by Jonathan Calugi.

Free Font Amadeus
A playful, @font-face compatible free font by the foundry Bright Ideas.

20 Dingbat Fonts That Are Actually Useful

Reminder: Download fonts from our previous posts

Chunk Open Source Typeface [ Download the .zip-package ]
Chunk is an ultra-bold slab serif typeface that is reminiscent of old American Western woodcuts, broadsides, and newspaper headlines. Used mainly for display, the fat block lettering is unreserved yet refined for contemporary use. OpenType. Designed by Meredith Mandel. (via Graham Smith).

Titilium [ Download the .zip-package ]
A very legible, beautiful academic typeface that perfectly fits to every corporate identity design, magazines and headlines of corporate web-sites. The typeface is available in various weights: text version, title version, extra-black version and full-version.

Rough Draft Regular
A legendary TrueType typeface by Harold Lohner. Contains 189 characters in 9 ranges. For $5 you can buy the complete set which includes separate Outline, Clean Fill, and Solid Fill fonts.

Nilland
A beautiful slab-serif typeface, designed by Manfred Klein. The family consists of 6 weights, regular, bold, extra bold, black, small caps and small caps bold (link and images via DerSven.de).

Aller Sans [ Specimen | License | Download ]
Dalton Maag design team designed a beautiful sans-serif Aller Sans, sponsored by Danish publishing company Aller (hence the name). The typeface was designed as part of the Danish School of Media and Journalisms new CI and is now available for free use and download (via).

M+ Outline
These fonts are free software. Unlimited permission is granted to use, copy, and distribute it, with or without modification, either commercially and noncommercially. Designed by Morishita Coji. The fonts are regulary updated, work in progress. Caution: Japanese language.

Andale Mono
Andale Mono is a highly legible monospaced font which was originally distributed as part of the Internet Explorer 4.0 add-ons page as Monotype.com. It distinguishes well between the zero, and the O. You can find 4 further monospaced fonts in Hamish Macpherson’s article The Typography of Code.

Credits: Hamish Macpherson

Junction [ Download the .zip-package ]
Designed by Caroline Hadilaksono, Junction is a humanist sans-serif typeface. It has elegant, clearn and very sharp glyphs, but contains only 100 most common symbols. Like Gentium it perfectly fits to body copy, but can also show its strengths, balance and beauty in headlines. Here are some insights from the designer:

Vegur
This humanist sans-serif family is available in OpenType-format in three weights: ExtraLight, Regular and Bold. The typeface can be perfectly used both in body copy and in headlines.

© Smashing Editorial for Smashing Magazine, 2009. | Permalink | 12 comments | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine
Post tags:

Go to Source

Despite some inconsistencies between browsers (not Typekit’s fault) and a few other quirks, we found Typekit to be a viable option for web designers looking to incorporate custom fonts into their designs.

Typekit is like a YouTube for fonts. Browse through Typekit’s library of available fonts, pick one you like and cut-and-paste some code into your site. As we noted when we first looked at Typekit earlier this year, the service is one of the easiest ways for web designers to use creative fonts without sacrificing web standards or violating font licenses.

Of course that ease and convenience doesn’t come without a price. There is a free trial option for Typekit, which allows you to test out the service. But if you’re serious about custom fonts, you’ll want to go with one of the paid options which range from $25 to $250 per year. The more you spend, the more font choices, domains and bandwidth you’ll get.

Typekit arrives at a time when type on the web is at a crossroads. For years, designers have been limited to using only a set of five or six common fonts on web pages. But thanks to new font rendering tools within the emerging HTML5 and CSS3 standards, web designers now have the ability to use newer, more visually interesting typefaces — and make that type appear more consistently across browsers, operating systems and screen resolutions. Even with these new abilities, intervening forces like DRM, licensing restrictions and varying levels of support from the browser makers have stalled progress, forcing the modern designer to resort to a variety of workarounds and hacks if they want to use these new fonts.

Along with Typekit’s arrival, we’ve seen other promising developments recently, like the move by some browser makers towards adopting a new font format called WOFF which would allow better control over layouts and designs.

To see how Typekit performed in the wild, we opted to try out the free option and see if Typekit was good enough to warrant the expense. The short answer is yes, but with some drawbacks.

Before you dive in to Typekit, it’s important to remember the one very large caveat — Typekit only works in browsers that support the CSS @font-face rule. That means Firefox 3.5 and higher, Safari 3.4 and higher, and Internet Explorer 6 and higher.

While that’s not ideal, the good news is that browsers that don’t understand Typekit’s fonts can simply fall back on a default you’ve defined.

There is another slight problem, though. In some cases, fonts rendered in browsers on Windows XP can look jagged and difficult to read. The problems is that Windows XP often doesn’t have anti-aliasing turned on by default. Of course it’s worth noting that even if you don’t use @font-face, standard fonts will also be jagged on such systems. The difference is that most of the standard fonts are still readable, while in some cases custom fonts become a total disaster.

To get started with Typekit, just create an account and tell Typekit the domain where you’ll be serving the fonts. We were happy to see that Typekit will support the localhost domain for testing purposes, something many online services and APIs overlook.

After your account has been created and your domain set up, Typekit will then give a snippet of HTML to include on your site. The code simply loads Typekit’s JavaScript library, all you need to do is paste the HTML in the <head> of your site.

Now it’s time to pick some fonts. Typekit’s range of fonts depends on the amount of money you want to spend. For a trial account you’ll have just under 70 fonts to choose from. The “personal” library ($25/year) has roughly 230 fonts and the full library ($50/year) nearly 300.

The Typekit font browsing interface is very well designed and offers some nice tools for choosing a good font — like a live-preview of the font and numerous size previews for judging readability.

Typekit’s live preview tool with custom text. Click the image for a larger view.

Once you’ve selected a font, you’ll need to configure it for your site. The Typekit Editor lets you control which CSS selectors your custom fonts will be applied to, which weights and styles to use and what font to fall back on for browsers that don’t understand @font-face.

If you’d rather apply a font to all elements on your site, you can define your own custom font-family rules in your CSS file, for example h1 {font-family: "tenby-seven-1"} would apply the Tenby Seven font to all headlines on the site.

Typekit’s editor tool for customizing fonts. Click the image for a larger view.

The next step is to publish your font, which then makes it available on your domain.

The results looked great in our testing, especially in Safari 4, which seems to render type a bit thinner than Firefox on the Mac. On the Windows side the results were roughly the same between browsers that supported Typekit.

One thing that seems unavoidable with @font-face, whether it’s through Typekit or otherwise, is a brief flash of un-styled text. It’s annoying, but for now there doesn’t seem to be anything you can do about.

There are some other drawbacks — the need for JavaScript and the additional data that increases page load times — but so long as you’ve already accepted @font-face’s shortcomings, Typekit makes the process of using it simple and easy. Other possibilities for broadening your type selection include Typotheque and a new service Kernest.

See Also:

• Typekit Hopes to Become the YouTube of Fonts
• Boing Boing’s Redesign Uncovers the Dark Side of Web Fonts
• Typotheque’s Web Fonts Rock, But Old Machines Can’t Learn New Type Tricks
• The Future of Web Fonts Looking Brighter

Go to Source

Freeware fonts can be used commercially or non-commercially without acquiring copyright permission as long as you will not profit from the use of the font. Detailed copyright information is available for individual fonts in the readme.txt file, or copyright.txt which are included as a part of the zip font file.

Requirements: -
Demo: http://www.searchfreefonts.com/
License: License Free

Sponsors

Pixmac: Stock Photos, Royalty Free Pictures and Images

Go to Source

Remember that this is WebDesignDev’s opinion about what apps are the top 10. If you think another app should be number one, then we would love to hear it in a comment.

Also, you may want to check out my very own web app called lushcloud that is currently being built for freelancers and small businesses. Anyway, enjoy the list and let me know what you think of our number one.

#10 PX to EM

When first making a new CSS stylesheet, you may want to use this tool to set your master text size. Its a very handy tool where you input in your body font size, and then PX to EM converts the font sizes based on your body font size, and outputs the CSS stylesheet too! They also have a custom PX to EM and EM to PX calculator. Visit Site

* * * * *

#9 Type Tester

TypeTester Allows you to test many different fonts against each other. You can customize many different inputs, such as the bg color, font size, font, alignment, decoration and much more. Visit Site

* * * * *

#8 Icon Finder

IconFinder ranked number 8 in our list, because its one of the most, or the most helpful icon search engine around. It helps me to find numerous icons every day, and also includes their license and usage details, and you can download in multiple formats in just one click. Visit Site

* * * * *

#7 Freckle

Freckle is a very neat time tracking web app for your clients and for yourself. Freckle lets you see the whole project, such as what days you are working, and what on etc. Its the perfect app for freelancers, small businesses and consultants. Visit Site

* * * * *

#6 Carbon Made

CarbonMade lets freelancers show off their work to others. With over 165,000 portfolios on the service, no wonder CarbonMade made our list. Plus you can eve upload images to your portfolio! Visit Site

* * * * *

#5 Kuler

Adobe Kuler is one of the best color applications around. I use this app all the time when I am trying to find colours that match and work well together. Its so simple and easy to use, but you can get lots out of it. Visit Site

* * * * *

#4 Mail Chimp

MailChimp is the best email marketing application out there to date. MailChimp allows you to build and manage email lists, customize and design your email campaigns in HTML, and track and analyze email marketing. With over 175,000 users on the service, its defiantly a win. Plus they also have a free plan if you are on a tight budget! Visit Site

* * * * *

#3 Twitter

Twitter is one of the fastest growing social networking sites on the planet. Micro-Blogging has taken the internet by storm. This site receives over 10% of its daily traffic from Twitter alone! Twitter can help a web designer gain many more clients and can help get your name out there. Visit Site

* * * * *

#2 Crazy Egg

CrazyEgg is one of the best analytic tools ever created. Ever wondered what visitors click on your site? Or eve why no one is clicking here or on this page? CrazyEgg tracks what users do on your site, and displays it on heat graphs and many more creative charts, so you can see exactly what users do on your website. Visit Site

* * * * *

#1 Dropbox

The number one web app of 2009, is Dropbox. This tool is one of the most handy solutions ever. You simple drag and drop files into your Dropbox, and it stores them online! Heck when im out and about and I want to show someone an image, but its not on my phone, I simply login to the Dropbox web interface, and show them the image. I would really recommend using this service. Its great for showing clients design revisions / mockups. You simply save the file direct to your Dropbox. Visit Site

Go to Source

If you have found any other font websites that you think should be on the list, or if you have any online font tools that you have found, please feel free to drop us a comment and share it with the WebDesignDev community.

* * * * *

Search Free Fonts

* * * * *

Da Font

* * * * *

1001 Free Fonts

* * * * *

Fontica

* * * * *

Abstract Fonts

* * * * *

Cream Undo

* * * * *

Font Cubes

* * * * *

Font Stock

* * * * *

Better Fonts

* * * * *

High Fonts

* * * * *

Free Premium Fonts

* * * * *

Font Squirrel

* * * * *

Font Post

* * * * *

Font Space

* * * * *

Urban Fonts

Go to Source

There are a lot of free fonts available online. Sites like Dafont and 1001Fonts are invaluable repositories for designers, because they give us such a wide range of font options.

Cartoon fonts are one type of font that rarely get much praise. The problem with them is that by definition, they’re gimmicks. They are never the most legible fonts, I’d never recommend using one for content, and quite often, they just look foolish.

But when it comes to creating a memorable logo easily, a good cartoon font can be a great first step. They’re distinctive, look great in large sizes, and can be easily modified and re-colored in Photoshop to make it that little bit more unique.

Of course, that only works with certain styles of design. If your site is all bubbly and colorful, it’s worth considering. If you’re more minimalist or professional, stay well clear!

So with that in mind, here are 37 of the best free cartoon fonts we could find. Let us know if you put any of them to good use!

Glimstick

Joint By Pizzadude

Mandingo

Smilage

Chachie

Bumbazoid

Baby Kruffy

Letras Locas

MTF Scribblie

Taxidermist

Smartie

Mickey

Chizzler

Umberto

Space Pontiff

Fontdinerdotcom Sparkly

Broken Toys

Ice Age

Army Beans

Chlorinar

LoOse Gangster

Gwibble

Chubby Cheeks

Candy Time

Cosmic Dude

Cactus Sandwich

BabOonjaZzbaSsoOn

Altamonte

akaHoggle

Eyesis

Armor Piercing

Fighting Spirit

Denne’s Aliens

Clink Clank

Pokemon

Oogie Boogie

Burrito

Which was your favorite of these cartoon fonts? Or did I put you off a little too strongly in the intro to the post?

Any others that you would recommend to us?

Welcome to what I believe to be the final installment of the typography-based series of free Friday Wallpapers. Don’t worry, I’ll still do free wallpapers, but I’m not sure entirely what kind next. I’m thinking a calendar one, once a month, come January – but as for weekly, I have no idea. Too many deadlines these days!

Anyway, this week’s is Georgia (regular). The challenge here was to take a font seen all over the place – a font that’s sort of bland – and make it interesting as the sole item in the design. I think it worked! Enjoy, share and subscribe to the RSS feed!

Click to download the Georgia Wallpaper in 1920X1200, 1680X1050, 1440X900 or 1280X800. Pass it along!

Go to Source

Based on Frederic Goudy’s Kennerley Oldstyle.

This font predates the League and is in the public domain.

A few words on why I think Kennerley Oldstyle is beautiful: In making this font, I discovered that Kennerley fits together tightly and evenly with almost no kerning. Thus the following words from Monotype specimen books are just: “[W]hen composed into words the characters appear to lock into one another with a closeness common in early types, but not so often seen in later-day creations.” These are letters that take command of the space around them; notice, for instance, the bowed shapes of the v and w.

Side note: The preview includes public domain clipart from openclipart.org. Go visit!

Go to Source

Every day highly skilled designers and type foundries release free fonts, in this collection you will find 55 downloadable high-quality fonts to create unique and original compositions.
So make your graphics unique with one of these fantastic fonts!

Don’t forget, you are free to suggest additional resources in the comments to this post.

Original Fonts For Tour Design. They are FREE!

Stretched Signature Flex Font

Blox Font

Cube Font

Blackout Font

Transuranium Font

PipeSquare Rounded Font

Block 1900 Font

Demon Cubic Block Font Font

Qbicle Font

Lampoon Font

Khalijaka Font

FFF Tusj Font

The Quickest Shift Font

Karabine Font

Bladeline Font

Shutdown! Font

Blog the Impaler Font

Oreos Font

LT Chickenhawk Font

Gear Font

Thai Pedicure Font

Macabra Font

Dilana Experimentype Font

Anywhere but Home Font

Spranq Eco Sans Font

Teacher font

ReskaGraf font

Punk font

Rock it font

FrankenTOHO font

Werewolf font

Dark Theater font

Crazy Killer font

Quick End Jerk

Zero Zero Is

Wc Wunderbach Bta

Amadeus

Carousel

Clutchee

Griffin

Hominis

Pincoyablack

Sybil Green

Wide awake

Firecat

Operating instructions

Plexifont

BlackCasper

Old Stamper

Scratch my back

Katy Berry Font

Soopafresh

Shanghai

Impacted

Fortuna Dot

Do You Need Fonts?

On PV.M Garage we share only amazing stuff, take a look at the following links to find other useful fonts.

36 Free, High-Quality, Sans Serif Fonts For Your Clean Designs

25 Free Blocky Fonts Ideal For Logo And Poster Design

35+ Free Comic and Cartoon Fonts For A Funny Design

20+ High-Quality Free Fonts for Retro and Vintage Design

Go to Source

Real fonts on the web: House Industries supports WOFF format.

…a font format for the Web that satisfies the needs and concerns of browser makers, web designers, and type foundries. …WOFF, offers compression to speed page load times, freedom from thorny legacy issues and inclusiveness (font outlines can be Postscript or TrueType).

WOFF has the support of a wide spectrum of the type community; from peers such as Emigre, Hoefler & Frere-Jones, Commercial Type, etc and larger foundries such as Linotype and Monotype. Today it has also gained the support of Mozilla in the their release of Firefox 3.6 (Mozilla has a full list of designers and foundries that support WOFF on that page). We hope and expect that WOFF will quickly gain support in other major browsers as we support, endorse and expect to license our library for use on the Web in the WOFF format in the future.

Read more

• The Problem: We have the fonts, we have the CSS and the workaround for IE. What we don’t have is beautiful, reliable, consistent cross-platform rendering of real fonts like Gotham, Franklin, Garamond, etc. — 29 October 2009
• Web Fonts and Standards: How real fonts work on the web via standard CSS. Making it work in IE. The licensing hurdle. Rise of the middlemen and their effect on the adoption of font embedding standards. — 17 August
• Web Fonts Now, for Real: David Berlow of The Font Bureau publishes a proposal for a permissions table enabling real fonts to be used on the web without binding or other DRM. — 16 July 2009
• Web Fonts Now (How We’re Doing With That): Commercial foundries that allow @font-face embedding; browser support; Cufón and SIFR, oh, my; Adobe, web fonts, and EOT; Typekit debuts; — 23 May 2009

Go to Source

There are a lot of options out there for using other-than-websafe fonts in your website designs. Dynamic text replacement methods or resorting to very long fontstacks (where most of your visitors won’t see the font you wanted anyway) have long been the standard for using anything other than websafe fonts.

But the @font-face function changes all that. With most major, modern browsers now compatible with it, services are cropping up all over for providing the fonts you want to embed on your site without eating up your bandwidth and server space.

One of the biggest hurdles these services help to overcome is the licensing issues related to embedding certain fonts on your website. While many fonts (especially open source fonts) have licenses that allow for embedding, others strictly prohibit it. Webfont services work with the type foundries to provide fonts for embedding while also providing the security that foundries insist upon.

Currently, there are four such services available, though two (Typekit and Fontdeck) are still invite-only. Read on for more information about each.

1. Typekit

Typekit is invite-only at this point. You can sign up for updates on their website, and they’ll announce when it’s ready. But a lot of information is already available on their blog.

From the looks of it, Typekit will have three available subscription options. The Trial service offers a pretty decent sized collection of fonts from foundries including Bitstream (Vera Sans), Bigelow & Holmes (Luxi Sans, Luxi Serif), Fonthead (Good Dog, Corn Dog, and others), Jason Kottke (Silkscreen) and others. The Personal-level service offers all of the trial fonts, plus fonts from Barry Schwartz (BonvenoCF, Goudy Bookletter 1911), Cathy Davies (Chemist, Chemist Rough), FRiTZe (Vollkorn), and Typodermic (Cardigan, Soap, and others) among plenty of other foundries. The Full Library option has all the fonts from the personal and trial libraries plus fonts from Betatype (Apertura, Pill Gothic 300mg, and others), Insigne Design (Montag, Carta Marina, Deinstag), and Paragraph (Galette, Mentone), among others. Overall, there are hundreds of fonts available.

Typekit works with virtually every major browser, including Internet Explorer, Firefox and Safari. While pricing has not yet been released, the trial version will be free to use.

Typekit Resources

First Impressions of Typekit
This post gives a great, first-hand account of what it’s like to use Typekit.

Examining Typekit
An excellent article that takes a look at the positives and negatives of using Typekit.

Getting Started with Typekit
An excellent introductory guide from Carsonified.

Type Sellers, Web Fonts, and Typekit
A great post from Nice Web Type that talks about @font-face in general and Typekit in particular.

Typekit Hopes to Become the YouTube of Fonts
An excellent article from Webmonkey about Typekit’s potential.

Typekit: Banishing Blight from the Browser
A pretty comprehensive look at Typekit from Linux Magazine.

2. Typotheque Web Fonts

Typotheque is a font foundry providing their own solution to the @font-face dilemma. Their service claims to work on 95% of browsers, and supports multiple languages.

One of the big advantages to this foundry-based service is that you pay for a single license for both print and web usage, and the license fee is a one-time payment. You can use the fonts you purchase on an unlimited number of domains, too, making it a potentially very cost-effective solution.

Of course, the big drawback to this is that you can only use it with Typotheques fonts. While they have some very nice fonts available, it’s a relatively small collection, with only eight distinct fonts (with multiple weights available for most of them). But, if their fonts fit your needs, then it’s a great solution.

Typotheque Resources

Testing Typotheque @font-face Embedding
A very thorough look at Typotheque from For a Beautiful Web.

Typotheque’s Web Fonts Rock, But Old Machines Can’t Learn New Type Tricks
A more critical look at Typotheque from Webmonkey.

Typotheque Web Font Service Demo
A video demonstration of Typotheque on Vimeo.

3. Kernest

Kernest takes a slightly different approach to the webfont service model. Basically, they let type designers and foundries submit their fonts under a variety of licensing options, and set the price for using that particular font on a per-site-per-year basis. They have a few dozen fonts currently available, from a variety of foundries. The preview functionality on the site is also really helpful, letting you try out fonts with text you input.

Kernest works with all major web browsers, including Safari 3 and higher, Firefox 3.5 and up, Opera 10 and up, and Internet Explorer 4 and higher. It’s a pretty impressive list.

Usage is easy, with web designers only needing to choose the fonts, upload Kernest’s CSS Embed, update the site’s CSS tags, and refresh.

Font pricing varies widely on the site, with a lot of fonts available for free and others running in the $10-$20/year range (though some are more expensive). Depending on which fonts you want to use, it can be a very economical option.

Sites Using Kernest

While the other sites don’t yet have galleries of sites using their services, Kernest does. Below are a few sites taking advantage of their technology.

Kernest Resources

A Web Font Service For Real, a Sneak Peek at KernestA great look at how Kernest works, from Readable Web.

The Importance of Knowing Kernest: Pretty High. Your Move, Typekit.
A quick look at Kernest from someone who’s used both it and Typekit.

An Interview with Kernest’s Garrick Van Buren
An interview with the creator of Kernest.

Using New Fonts from Kernest on Blogger
A tutorial for using Kernest webfonts on Blogger blogs.

4. Fontdeck

Fontdeck is a webfont service developed by ClearLeft and OmniTI that’s still in private beta. You can sign up for updates on their website. There’s even less information available about Fontdeck than there is about Typekit.

Of course, the fact that OmniTI will be handling the security aspects of Fontdeck means it’s more likely to get support from font foundries who may be wary or less-secure methods. Fontdeck will likely make guarantees as to the safety of the fonts it provides.

There’s no pricing information available yet for Fontdeck, or even information on how their pricing might be structured.

You can get updates on Fontdeck developments through their Twitter feed.

Advantages of Webfont Services

There are a number of advantages to using webfont services over dynamic text replacement (DTR) or other methods. The first is that these services work well for replacing the font of all the text on a page, not just your headlines. Converting all the text on a page using DTR is impractical due to the conversion time required. Webfont services don’t take any longer to load a page of text than they do to load a header.

Another huge advantage to using a webfont service is that it removes the sometimes-confusing and sticky legal issues involved with embedding fonts on the web. Many font foundries consider embedding fonts to be redistributing them, making it against their terms of service to use @font-face with their fonts. Considering how small most font foundries are (many are just one person), font piracy can be a huge burden for them. Most web services make security a top priority and do a lot to protect font foundries from having their fonts pirated.

The final big advantage to using a webfont service is that it saves your bandwidth. If you have a high traffic site, everyone downloading font files when your page loads can quickly use a lot of bandwidth. Font services host the fonts on their own servers, saving your bandwidth. Depending on your traffic figures and hosting plan, the money saved might even be enough to offset the cost of the service each year.

Further Resources

The Font-as-Service
A great post from i love typography comparing Typekit, Fontdeck and Typotheque.

The Direction Forward with Web Fonts
A post from Molecular Voices that covers a wide variety of web font options, including webfont services, standards, and proposals (like .webfont and ZOT).

Web Font Services Join Fray as .webfont Format Gains Support
A post from Ars Technica about webfont services and proposals.

The Future of Web Font Embedding
An older post from Clagnut on embedding webfonts.

Testing Web Fonts
An excellent post from movito about Typekit, Typotheque and WOFF.

About the author

Cameron Chapman is a professional Web and graphic designer with over 6 years of experience. She writes for a number of blogs, including her own, Cameron Chapman On Writing . She’s also the author of Internet Famous: A Practical Guide to Becoming an Online Celebrity.

Go to Source

• If real fonts on the web are of interest to you (and if they aren’t, why are you here?), you’ll enjoy Tim Brown’s iPhone-friendly summary of recent web type events, tests, and opinions. Of special note in that list of juicy goodness is Font Squirrel’s tweet about the difficulty of getting fonts to render well in Windows. I will have something to say on that topic soon. (Preview: Real fonts look bad in Windows because Windows removes hinting. Microsoft needs to fix this, or real fonts on the web will be a mostly-Mac experience or stillborn.)
• FontShop’s Flickr set ScreenFonts BeNeLux looks at the typefaces on posters for new movies released in Belgium and The Netherlands. It is a companion to the international ScreenFonts on The FontFeed, FontShop’s monthly review of movie poster typography.
• ilovetypography’s Sex, lies, & type explores much of last week’s font news, including the introduction of Mr Eaves, and one’s own discovery of the Film posters typeset in Trajan pool at Flickr.com.

Short URL: zeldman.com/?p=2782

Go to Source

Font dragr is an experimental web app that uses HTML5 & CSS3 to create a useful standalone web based application for testing custom fonts, once you visit it for the first time you don’t need to be online to use it after the initial visit. It allows you, in Firefox 3.6+, to drag and drop font files from your file system into the drop area. The browser will then create a data URL encoded copy to use in the page and render the content in the dropped font.

Used in the app:

• HTML5
  • Offline access applicationCache
  • Drag and drop API
  • File API
  • contenteditable attribute set to true so the text can be edited.
• CSS3
  • Custom fonts with @font-face
  • Gradients
  • Rounded corners using border-radius
  • Drop shadows with text-shadow & box-shadow
  • Attribute and pseudo selectors
  • Multiple border colours
  • Box model adjust using box-sizing

See it in action:

Go to Source

WordPress has pretty decent typography features in the core installation. But there are plenty of areas ripe for improvement. That’s where the plugins below come in.

Credit: Image background by fabianohikaru

Whether you just want more control over how the basic text on your site shows up or you want to do something a bit more advanced, there’s surely a plugin available to help. There are plugins to better handle things like hyphens and long URLS, plugins to replace text with images (whether in headlines or to avoid censorship), and plugins to let you add print-centric elements, like drop caps and pull quotes, to your posts.

Be sure to check out our previous post on Dynamic Image Replacement for more useful WordPress typography plugins and here are some WordPress related plugins we’ve previously published:

• WordPress Tricks & Hacks Part I, Part II, Part III
• Manage and Handle Multi-Author Blogs
• Great looking WordPress Themes

Full list after jump.

WordPress Plugins For Better Readability

• TTFTitles

  The TTFTitles plugin is another dynamic text replacement plugin that lets you replace your headers with images using any TrueType font you choose. It’s mostly a rework of the Image Headlines plugin. It has been tested with WP 1.5.2 up through 2.7.

  

• DRF2WP EN

  DRF2WP EN is a font replacement plugin that allows you to replace any font on your WP site with a dynamically generated image that uses any TrueType or OpenType font you want. The source code remains in-tact, which means your site won’t take a hit with search engines. The plugin works with WP 2.5 up to 2.8.4.

• Drop Caps

  The Drop Caps plugin lets you add a customized drop cap to each of your posts and pages (or even comments and other excerpts), similar to what’s commonly done in print publications. It can also be used to create other types of initials. The plugin has been tested with WP 2.3 up through 2.7.1.

  

• WP Typography

  The WP Typography plugin adds a number of typography features to your blog. It includes hyphenation, spacing control, forced internal wrapping of long URLs, intelligent character placement, smart handling of quotes and other characters, and CSS hooks for styling ampersands, acronyms, and other special characters. It works with WP 2.7 up through 2.8.4.

  

• Simple Pull Quote

  The Simple Pull Quote plugin lets you insert pull quotes into your blog posts to emphasize certain sentences or phrases using custom fields. Pull quotes can be styled by editing the included CSS file. It works with WP 2.7 or 2.8.

  

• jQuery Font Resizer

  jQuery Font Resizer is a plugin that improves the usability and accessibility of your blog. It adds three links to each page to allow visitors to resize the type on that particular page. It’s a great option to make your site more user-friendly to visitors who want a larger or smaller type than standard. It’s known to work with WP version 2.0.2 up through 2.7.

• WP-Syntax

  WP-Syntax is another syntax highlighter that uses GeSHi. It gives you the option to highlight with or without line numbers and maintains formatting when you copy snippets. WP-Syntax is compatible with WP 2.0 up through 2.8.

  

• Google Syntax Highlighter for WordPress

  The Google Syntax Highlighter for WordPress lets the original Google Syntax Highlighter that was developed by Alex Gorbatchev work within WP. It’s a completely client-side highlighter, supports multiple languages (including Ruby, Python, PHP, JavaScript, XML, HTML, Delphi, CSS, C++ and more), and is very lightweight. It’s known to be compatible with version 2.0.0 through 2.2.2.

  

• WP-Syntax Colorizer

  WP-Syntax Colorizer is a simple plugin for colorizing code snippets within your blog posts when run alongside WP-Syntax. WP-Syntax Colorizer has been tested with WP 2.0 up through 2.5.

  

• CodeColorer

  CodeColorer adds syntax highlighting to code snippets placed on your blog. It’s a great plugin to use if you frequently post code snippets, such as on a web design or development blog. It works with version 2.7 up through 2.8.4.

  

• TextImage

  The TextImage plugin replaces all the text in a post with a PNG image. It’s a good plugin to use if you wnat to block search engines from seeing your content or otherwise fly under the radar. It also gets around most automated filtering that certain countries use to censor internet content. It’s been tested with WP 2.1 up through 2.7.1.

• Censortive

  Censortive helps you get around automated censorship by replacing certain words with images of the word instead of text. You define which words you want to be replaced and Censortive does the rest. It’s a great plugin for getting around a lot of censorship without blocking your content from search engines. It’s been tested with WP 2.0.2 up through 2.3.

• Title Style

  Title Style gives you additional formatting options for your post titles. It can be used to wrap lowercase words or words like “the”, “a”, or “of” in em, span, or other elements. It’s compatible with WP 2.0.0 up through 2.8.4.

• PS Disable Auto Formatting

  PS Disable Auto Formatting prevents WordPress from applying its own auto formatting functions to your posts and pages. It prevents WP from stripping out tags when you’re editing in the HTML editor and has a positive impact on the way the visual editor formats your posts, too. It’s known to be compatible with WP 2.5 up through 2.8.3.

  

• Post Typographer

  Post Typographer plugin adds a number of typography improvements to your posts automatically. It changes dashes with spaces around them to em-dashes, transforms hyphens without spaces to n-dashes, and turns spaces after particular words into non-breaking spaces, among other features. It’s been tested with WP 2.5 up through 2.8.3.

• Author Intro for Post

  Author Intro for Post plugin adds an author intro to the beginning of each post based on the author’s name and bio information. It’s been tested with WP versions 2.0.2 through 2.7.

• WP-Footnotes

  WP-Footnotes makes it simple to add footnotes to your posts. Usage is incredibly easy and only requires you to use double-parentheses around your footnote. It does the rest. It’s compatible with WP versions 2.0 through 2.6.

  

Plugins for Admins

Here are a couple of admin plugins that can help you improve your site’s typography by giving you more editing options in the backend of your site.

• WP Super Edit

  WP Super Edit adds a host of WYSIWYG options to the standard WP visual editor. It adds two full rows of additional features to your visual editor toolbar, including options for applying specific styles and for adding and formatting tables. It’s known to work with version 2.8 and 2.8.1.

  

• Real WYSIWYG Plugin

  The Real WYSIWYG Plugin adds a WYSIWYG editor that actually shows you the page layout of your post within the visual editor. It makes it easier to see how your line breaks, images, and other elements will actually fit on your page.

  

• Text Control

  Text Control gives you additional options for formatting posts on your WP site according to a variety of different syntaxes and encoding options, including Textile 1, Textile 2, and Markdown. It’s compatible with WP 1.5 and higher.

  

Go to Source