• Skip to primary navigation
  • Skip to main content
Sal Ferrarello
  • About Sal Ferrarello
  • Speaking
  • Connect
    Mastodon GitHub Twitter (inactive)
You are here: Home / Dev Tips / QR Code Best Practices

QR Code Best Practices

Last updated on September 19, 2016 by Sal Ferrarello

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

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

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
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.

Share this post:

Share on TwitterShare on FacebookShare on LinkedInShare on EmailShare on Reddit

Filed Under: Dev Tips Tagged With: QR, redirects

Reader Interactions

Comments

  1. Corey says

    September 19, 2016 at 10:13 pm

    I don’t track whether this actually happens, but here’s a use-case where I believe a QR code I’ve deployed can provide value: window stickers on car lots for after-hours shoppers.

    These people can’t see the interior of the car because the dealership is closed, but the car’s web page has interior photos.

    I think the challenges are that most people have no idea how to use QR codes, and those that do don’t trust them to lead to valuable content.

    Reply
    • Sal Ferrarello says

      September 20, 2016 at 9:35 am

      I think your scenario would be a great use of a QR code and I think there are many more.

      Unfortunately, in addition to the lack of understanding around QR codes, the requirement of downloading a specific app to scan them is, I think, the biggest obstacle to their adoption. If iOS integrated a QR scanner into their camera, the popularity of QR codes would sky rocket.

      Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Copyright © 2023 · Bootstrap4 Genesis on Genesis Framework · WordPress · Log in