The everyday problem:

You really like the layout of a web page.  You want to build a wireframe mockup based on it, and it takes too long. 

Why not just screencapture the page?  Mainly because images and text distract your vision when you’re trying to figure out the best layout possible.  You may also want to compare different layouts and having everything mocked up on wireframe instead of screencaptured may provide a more unbiased view of things.

The simple solution:

Wirify is a cross-browser bookmarklet which instantly turns full blown web pages into wireframe mockups with a single click.

Step 1: Visit the Wirify webpage

Step 2: If you’re using Chrome or Firefox, just drag and drop the bookmarket onto your browser bookmark bar.  (If you’re using Internet Explorer switch now for a better experience)

Step 3: Click on the bookmarket whenever you want to turn the website into a wireframe mockup.

That’s it!  So simple :)

Check out the YouTube video below for a step-through Wirify

1. How to identify any font

Seen font which you’d like to use but don’t know what it is?  Answer a series of questions from Identifont and it will help you find out what it is and get your hands on it. 

2. How to determine which the most common fonts are

It’s common knowledge that if you use a set of fonts that a user doesn’t have installed on their own system – your user will be looking at another font, which may or may not be aesthetically pleasing.  

How sure can you be that the font you specify will be present on the end user’s machine?  Codestyle has an ongoing survey which tracks the most commonly used fonts for every platform so you can best make that decision. 

3. How to preview every font on your system without installing anything

Want to take stock of what fonts you already own?  Web based STC fontBrowser scans your system, and with its user friendly interface allows you to preview all your fonts directly from your browser.

4. How to compare fonts side by side

If you’re going to make tight decisions about which fonts to use, sometimes it’s better to have all the choices displayed next to each other.  Most sites only allow you to preview one font at a time – Typetester allows you to do 3 side by side.

5. How to make your own font from handwriting

The whole idea of using a ‘handwriting font’ revolves around adding that personal touch.  Well if that’s the case, you can’t get more personal that actually using your own handwriting as the font itself.  Fontifier is a service which can translate your handwriting into workable fonts.  Note that it isn’t free (USD$9), but considering the prices of competing products, it’s a good place to start.

6. How to find and download good fonts for free

Free font sites are a dime a dozen.  1001fonts may not have the largest collection out there (Although it’s still pretty extensive) but what I liked about it was the usability of the whole site.  Sections on top rated, and most popular fonts, as well as different categories allows anyone to quickly pick up something they like.  

7. How to manage fonts on your computer

Previewing and even using fonts is one thing… efficient management of fonts is something else altogether.  AMP Font Viewer gives you complete control over your fonts.  Here are some of my favourite features.

• Installation of fonts from a folder (one by one or from a list)
• Deletion of installed fonts
• Organize fonts in categories and manage them
• You can print a list (or selection) of installed fonts with an example of each font.

What is your favourite font?  Tell us in the comments!