QR Code Best Practices

As a web developer, this article is going to focus on the use of a QR code (Quick Response Code) to point to a website URL.

The first step in properly implementing your QR code, which points to a website URL, is to ask yourself, “Does this need a QR code?” Hint: the answer is almost always no.

In the United States less than 0.01% percent of all QR codes are ever scanned (full disclosure: I made up that number but I suspect it is actually much lower).

Nevertheless, you may find yourself in the rare situation where a QR code is helpful (in which case, please let me know in the comments) or the even more likely the situation where you have a client who insists on a QR code.

In either case, your QR code should be:

• Permanent
• Flexible
• Short
• Trackable
• Scannable

Permanent

Many of us spend our time in the world of the web where changes can be made at the click of a button. In the world of print, things change much more slowly (and more expensively). You want to get your QR code correct on the first try.

QR codes can represent many different things but when representing a URL, you want to use a URL that will be around forever. I own salcode.com so I might use http://salcode.com/qr, which will always be under my control. Pointing at a third-party puts the QR code outside your control. In 2009, free URL shortening service tr.im stopped supporting their existing shortened URLs. If you had a QR pointing at one of them, it would have been bad news.

Flexible

Rather than put content directly at http://salcode.com/qr, it is best to setup that URL to forward to another URL. For example, I could redirect this to a blog post called Save Time by Following My Cereal Box Protocol. Then I could distribute my printed QR code with a teaser like, Learn How to Spend More Time Doing What You Love. In the future, I may have a new time saving article called Save Time by Never Having to Tie Your Shoes. By modifying the redirect, I can continue to use the same QR code and point it to the new article (or even a page listing all of my Time Saving articles).

Example .htaccess Rule for Redirect

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTP_HOST} ^salcode.com$
RewriteRule ^qr$ https://salferrarello.com/qr-code-best-practices/?utm_source=blogPostSalFerrarelloCom&utm_medium=websiteOnTheWorldWideWeb&utm_campaign=howToSaveTimeWithQRCodes&utm_term=QRCode&utm_content=tatooCoveringMyEntireBack [R=302,L]
</IfModule>

Short

The less information stored in a QR code, the bigger the blocks used in the QR code. The bigger the blocks, the easier the QR code is to scan.

Examples

http://salcode.com/qr

https://salferrarello.com/qr-code-best-practices/#comment?utm_source=blogPostSalFerrarelloCom&utm_medium=websiteOnTheWorldWideWeb&utm_campaign=howToSaveTimeWithQRCodes&utm_term=QRCode&utm_content=tatooCoveringMyEntireBack

Trackable

In the above example, you’ll notice I include Google Analytics tracking parameters in the long version. These parameters have a lot of value but are at odds with our goal to keep our URL short.

This is where we get further value out of using a redirect for our URL. We can still use our short URL salcode.com/qr and set its redirect to point to a new URL with the Google Analytics tracking parameters. In other words, we can use the simpler QR code (salcode.com/qr) but still get the value of the longer URL by including the tracking parameters in the redirect.

Scannable

We’ve already taken steps to make our URL scannable by keeping the URL short. In addition, we’ll want to make sure the QR code is large enough. For a complex analysis of this topic, see A Guide to Creating Optimal QR Codes. For a rough guideline,

• Determine the approximate distance a user will be scanning from (it should be no less than 5 inches)
• When scanning from the typical distance, the QR code should take up approximately half the width of the screen

Finally, you’ll want to test your QR code both for scanning and for accuracy (you don’t want your funny test that points to nyan.cat to end up in your final product).

Review of Best Practices for QR Codes

• Permanent – use your own web server
• Flexible – point to a URL that redirects somewhere else
• Short – use a short URL
• Trackable – add Google Analytics tracking parameters when you redirect
• Scannable – QR code should take up approximately 1/2 of your screen width from typical scanning distance

Photo Credit

https://www.pexels.com/photo/sea-ocean-horizon-water-7321/

Sal Ferrarello (@salcode)

Sal is a PHP developer with a focus on the WordPress platform. He is a conference speaker with a background including Piano Player, Radio DJ, Magician/Juggler, Beach Photographer, and High School Math Teacher. Sal can be found professionally at WebDevStudios, where he works as a senior backend engineer.