Google, the search engine giant, is now taking initiatives with fonts and just launched:

Google Font Directory: It provides high-quality open source web fonts. You can browse their catalog of available fonts and copy the code required to use them on your web page.

These fonts also support HTML5 and CSS3 styling options like drop shadows, rotation, etc…

Google Font API: It provides a simple, cross-browser method for using any font in the Google Font Directory on your web page. Applying a font is easy: just add a special stylesheet link to your web page, then use the font in a CSS style.

Its similar as we add stylesheets in our web pages, the difference here is: the stylesheet is hosted at Google and comes with a parameter.

A new JavaScript library called WebFont Loader is also launched with the collaboration of Typekit and the Google. It gives you more control over font.

Being a designer, I know the importance of Icons in website design & user interface design. Many times, a layout turned to a master piece only by using few appropriate professional icons.

Today, I am presenting a Free icons collection with multiple file types like Vector, ICO, PNG, GIF & PSD.

9 Icon & PNG Cake Icons

Twitter PSD Icons

Read the rest of this entry »

A collection of high quality free ecommerce icons for an online shop. Multiple categories of online shopping has been covered in this great icon collection.

typism is a web-based font editor. It is a public site where anyone can create a font for others to use and to study, to modify and to copy.

You write the description of a typeface, design the outlines of a glyph, track the development history and publish any revision in human-readable format to store locally. All it takes to run it is a browser supporting a few open standards.

Typism uses SVG and runs on Google App Engine.

Website: http://typism.appspot.com/fonts/index

A Free serif font Available in light, regular and bold flavors.

Download Sansation

Andrew Paglinawan is a self-employed graphic designer, working in the fields of logo design, print design, web design and branding. He has released a free sans serif typeface called Quicksand with 7 weights including a dashed version. The font looks really nice and professional.

Read the rest of this entry »

Let’s be honest. Typography and the web do not go hand-in-hand. You’re limited to a choice of about 5 fonts, most of which are cheap knockoffs of ‘proper’ typefaces. You’ve got practically no fine control over kerning or line spacing, and – worst of all – there’s a very good chance that no matter what you do, no matter how hard you try – your type is going to look different on every single browser and operating system. So what is an avid graphic designer-cum-web designer to do when faced with the seemingly insurmountable task of making web type look good?

Tip 1: Don’t limit your size options

Once upon a time, we were limited to a mere 7 sizes via use of the <font> tag – thankfully current incarnations of CSS grant us much better control, so quite a fine level of control over the size can be had.

Figure 1: Newer methods of specifying sizes in CSS allow for more flexibility when choosing type size. Don’t stick to standard sizes – experiment!

Relative sizes work best- don’t forget your visitors may have a different font size setting to the default, so specifying fixed point or pixel values may make things look awfully strange. ‘Em’ units – so called as 1em is equal to the width of the lowercase ‘m’ character, are one of a few ways to scale your text proportionally. All things being equal, at default settings 1em is the same size as 12 points.

You’re not limited to while numbers, either – 0.8em is a good body font size, typically being rendered at 10pt. You can specify any number you like, and as large as you like – don’t limit yourself to sub-24pt sizes if the design warrants a larger size. Read the rest of this entry »

Good font to let you have maps of all countries. Stop searching for maps. Instead, install this font and get a key to every country and state on the world for free.

Download Map Font

Font Squirrel is a growing Collection of free fonts which can be used in commercial work. Feel free to download and use in any of your project. Font Squirrel has collected very nice (looks premium) fonts for us and categorized them beautifully for our ease.

Website: http://www.fontsquirrel.com

Instead of creating images or using flash just to show your site’s graphic text in the font you want, you can use typeface.js and write in plain HTML and CSS, just as if your visitors had the font installed locally.

As the fonts that can be used in websites are limited, there are several solutions to this problem like sIFR or FLIR. typeface.js is another open source solution which uses JavaScript.

Website: http://typeface.neocracy.org

Demo: http://typeface.neocracy.org/examples.html