After including it in your page, and jQuery of course, you create an empty DOM element to hold the QR code (a DIV, for example) and then you just do something like this:

jquery('#somediv').qrcode("http://www.webmaster-source.com");

The plugin is available on GitHub, and is released by the author under an MIT license.

An alternative, for those of you who don’t mind using a third-party service—and prefer simply including an image rather than extra JavaScript—can use the wonderful Google Chart API.

A QR code can contain any sort of textual information, which will be decoded by a QR reader. A web address, a simple message, a phone number, etc.. A good QR reader should figure out what the decrypted data is and act upon it accordingly. If it’s a web address, it will display the web page. If it’s a phone number, it should display the number and offer to call it.

Users of the iPhone or fourth-generation iPod Touch can use a free app like QR Reader to scan QR codes.

What can you use a QR code for? There are plenty of possible applications. Magazines could print QR codes that let you quickly jump to a web page. (Anyone remember the CueCat?) Advertisements could have QR codes that offer more information. You could put a QR on your business card. Want to move a web page you’re reading from your computer to your phone? Create a quick QR matrix and scan it right off the screen!

Now for the fun part… How do you make your own QR codes?

Google has a nifty API for dynamically generating charts. A simple (if messy-lookig) URL request will instantly generate an image containing a pie chart or a line graph. While QR codes aren’t exactly charts, the service has an option to generate them all the same. All you have to do is use a URL like this:

http://chart.apis.google.com/chart?cht=qr&chs=500x500&choe=UTF-8&chld=H&chl=http://www.webmaster-source.com

If you visit the above URL in your web browser, you should see a huge 500×500 pixel QR code that will take you to Webmaster-Source if you scan it. You could easily copy and save the image, print it, or embed it in a web page by using the URL in an <img> tag.

The key/value parameters in the URL are as follows.

• cht=qr — This tells the API that we’re creating a QR code instead of a pie chart or whatever.
• chs=500×500 — The size of the chart, in pixels. (I imagine “chs” stands for “CHart Size.”) 500×500 seems to be the maximum size.
• choe=UTF-8 — The content encoding. You should probably leave this as-is.
• chld=H — This seems to set the type of QR code. If you remove it, a different pattern will be used. I would recommend keeping the default unless you know what you’re doing.
• chl=[…] — The data you want to create a QR code for, such as a web address. If it is a URL, just paste it verbatim after the equality sign.

The beauty of the API is it’s simplicity. If you know you’re building some sort of web app, you could easily use your language of choice to mash your data up into a URL request and spit out an image tag with a QR code. Google already does this with their Goo.gl URL shortener. If you look at one of their URL info pages, it displays a small QR code and a link to a larger one. (Actually, adding “.qr” to the end of any Goo.gl URL will display the QR code.) It’s a very easy way to get a quick QR.