Web designers spend a lot of time looking up different fonts on their website that can be used. Fonts are very important for two reasons. First is that a good font allows users to read content on the website without any issue. Also the font styling usually should also fit in with the general theme of the website.
If you are using Chrome, Google Font Previewer looks like a great extension. It allows the user to look up different fonts and styling on the website you are viewing on your browser.
Google Font Previewer Features
Download the Font Previewer extension on your Chrome browser. Now while on any page your are viewing, you click on Previewer icon.
ADVERTISEMENT
A pop-up will allow you to tweak the fonts family and text styling to play around on the webpage your are viewing.
We can even specify a CSS selector and most impressively a HTML code is ready for developers to paste into their website.
If you are looking up fonts for your website – this extension is a probably the most handy one around on Chrome. Do give it a try and drop in your comments.
Usually what I do to find font details like font family, font size, its color etc I open Firebug(F12) and start inspecting with it but this becomes time-consuming. What if we get something that provides font details with just a single click. It can be done with the help of Mozilla extension i.e. Font Finder which provides font details in a pop up window.
Restart your browser and you will find an icon at bottom-left in the status bar.
As you can see in the image below there is a font finder icon. Click once on it and then click on the font whose details you need. In a pop up window it provides all details about Color, Font, Spacing, Decoration, Transformation and Element.
After I made blogging as my profession, I confess I do read many blogs. I usually do this by subscribing to RSS feeds or sometimes visit my favorite website regularly.
Most website have different fonts. Certain fonts seem to be easier to read than others. Sometimes websites can be viewed better in a different Font. This is very useful if you are doing a lot of reading online.
Just visit the FontFonter URL and enter the address of the page you want to see.
The page is displayed in its original font. Options are available in the format of a tool bar.
The drop-down options allow changing the Font and Font family with a click of the button.
The fonts that this website shows are WebFonts. Web Fonts unlike other fonts are more screen friendly. They are optimized for reading online. 😉
FontFonter in a way replaces the normal CSS of the website you are viewing to show you the different fonts. This mean it will not work with JScript. On the downside this FontFonter does not support Internet Explorer and Opera browsers. 🙁
Do try out FontFonter and drop in your comments. Do you think website pay less attention to Font than the amount of attention they pay to design elements?
YourPC’sFontViewer is an online service which tells you about all the fonts installed on your computer. You don’t need to do tweak any settings or click any button to know about the fonts. Just open the website and it automatically analyzes all the fonts and displays them on the homepage.
You can change text, color, and size of the fonts and test them quickly. To change these parameters, there are boxes given on the left. In the text field, enter the text you want to display. Similarly enter the color and size of text and hit the “Click Me!!” button.
The good thing about this service is it doesn’t reload the page while you change any text. It displays the change immediately after clicking the “Click Me” button.
The other great use of this tool is for testing purpose. Install any new font and go to this service to check the font immediately by changing the size and color.
This service is free to use and no sign up is required. This is also a great tool for testing the fonts for websites purpose.
Check out YourPC’sFontViewer to quickly view the fonts installed on your PC.
Do you like to use different Fonts available on your computer? Do drop in your comments.
We are in the Web 2.0 era, where there is a big focus on fonts. Especially for the fonts that we use in the logo, they are smoother, bigger and much cleaner. This has definitely increased the number of fonts used now a days. In our day to day activities, we often stumble over to the websites that have awesome designs and logos, that we desperately want to know the font used in it!
To figure out a font type isn’t easy, especially when there are ten’s of thousands of fonts available to search from. MyFonts.com has a service named WTF – WhatTheFont, to recognize the mysterious font in an image. What you have to do is simply upload the image or provide the url to the image. You will be provided with a set of closest matches available in their database.
Upload the image containing the font that you wish to recognize. The service providers suggest that the characters in the image should not be touching, have a height of about 100 pixels, have a distinct shape and as horizontal as possible. After uploading the image, they may ask you to enter the text corresponding to some of the characters in the image, which their system wasn’t able to detect accurately.
Moving on to the next step, you will be provided with a few fonts that closely match the font used in your image. If it does not provide you with the accurate font, it will surely take you very close to the font your wish to use.
I am a fan of this service, and it has never let me down. If such a thing happens to you, submit your image to WhatTheFont forum for it to be reviewed by font geeks world over!
Being a blogger and a fan of latest design aspects, I am often attracted to the designs on web. The recent case being the logo for my own website. I remember, I had to search all the fonts in my photo-shop, and still wasn’t able to decide on the font. Then I came across an image logo on a website and at once decided to end my search. Knowing that I had a back-up service, that will help me recognize the font used in the image. This post was about my experience with fonts that helped me to make use of this wonderful website WhatTheFont!
What’s your experience with the fonts? How do you tackle them, when you need to recognize one in a million. Let us know through your comments.
Gmail is one of the widely used Email application and it’s one of my favorite. Though one thing which I never liked about it its default font and text style. I personally reformat it every time to Verdana font style to make it look better. Though it’s my personal choice. I always wanted a feature in Gmail which will help me to select default font style, so that I don’t have to manually select it all the time.
Gmail introduced this new feature in which you can select default font style and text style while compiling any email. You can change the setting under Setting tab.
I’m sure those who are loved of Gmail like me will like this new feature. Have you changed your default font settings or you still using the same default font and text style?
Every time I write an email from my Gmail account, I prefer the Comic Sans font for my message instead of the default one which is Sans Serif. This means every time I start composing an email I have to change the default font.
I came across on the internet, a neat feature which allowed me to change the default font I had with Gmail.
Change default font in Gmail
The new feature has to be enabled under the Labs section within settings for Gmail. In the Labs section you need to look up Default Text Styling and select Enable along with saving the changes (see image below).
Now after you have saved the changes, Gmail goes back to your Inbox. Again click on Settings and under the General tab you can see a new option enabled for changing the default font within Gmail (see image below).
Select the font from the drop down menu and again save changes. This way you can change the default font you have on Gmail.
Hope you liked this and let me know your thoughts on default fonts with Gmail through your comments. 🙂
Have you ever thought to use your own fonts in your website but you couldn’t do so because it is a rare font and is installed rarely in all the computers?
So, I have got a quick solution for you and that is called Cufon. It makes possible fast and easy replacement of text with the font of your wish. It is very easy to set up and supports nearly all major browsers. And also it is SEO friendly.
The above lines of code will replace all your h3 elements with images rendered by Cufon with the font given by you.
You can take a look at a more detailed guide to replace text with cufon here (http://wiki.github.com/sorccu/cufon/usage).
Rendering your text (Styling)
ADVERTISEMENT
You can also add linear gradients to your text with cufon. Here is a sample code
The above code will cause the text to fade from black (#000) to grey (#777) and then back for h2 (<h2>) tags. For a detailed guide to styling using cufon refer to : http://wiki.github.com/sorccu/cufon/styling
And the most important feature of this is its so simple than sFIR.
Tips
If you are using some commercial fonts or fonts which you think not to give to your visitor 😀 . use this feature.
[Editor’s Note: This post is submitted by our guest blogger Kranthi, alias EverBlogger. Kranthiblogs on Devils Workshop about blogging and website optimization tips. You can follow Kranthi on Twitter.
