QR Codes Explained

QR codes are everywhere — restaurant menus, product packaging, event tickets, payment systems, business cards, and marketing campaigns. They provide a fast, reliable bridge between the physical and digital worlds with a single scan. Instead of manually typing long URLs or contact details, users can instantly open websites, connect to WiFi, save phone numbers, or complete payments.

Their popularity has grown dramatically because modern smartphones can scan QR codes directly from the camera app without needing extra software. Businesses use them to improve customer experience, while developers integrate them into applications for authentication, onboarding, inventory tracking, and secure information sharing.

This guide explains how QR codes work technically, what kinds of data they can store, how error correction works, and the best practices for generating QR codes that scan reliably across devices.

What Is a QR Code?

QR (Quick Response) code is a two-dimensional barcode invented by Denso Wave in 1994. Unlike traditional 1D barcodes that store data horizontally, QR codes store data both horizontally and vertically, allowing them to contain far more information in a compact space.

A QR code consists of black and white squares called modules arranged on a square grid. The three large squares visible in the corners are finder patterns. These help scanners quickly identify the code's position, orientation, and size, even if the QR code is rotated or viewed at an angle.

Additional alignment patterns and timing patterns help scanners interpret the grid accurately. The remaining modules encode the actual payload data using binary encoding techniques.

Static vs Dynamic QR Codes

Static QR codes are ideal for personal use, WiFi sharing, and permanent links. Dynamic QR codes are more suitable for businesses that need editable content, scan analytics, or campaign management.

What Can a QR Code Store?

The more data you store, the denser the QR code becomes. Dense QR codes are harder to scan, especially on low-resolution screens or small print surfaces. Keeping encoded data short improves scanning speed and reliability.

How QR Code Scanning Works

When a smartphone camera scans a QR code, image-processing software first detects the finder patterns in the corners. The scanner then corrects perspective distortion, identifies the grid layout, and converts the black and white modules into binary data.

Once decoded, the embedded content is interpreted according to its format. For example, a URL opens in the browser, a WiFi payload triggers a network prompt, and a vCard opens the contact application.

Modern QR scanners are optimized for imperfect environments. They can often read codes that are slightly blurry, tilted, partially covered, or printed on curved surfaces.

Error Correction Levels

QR codes include built-in error correction using Reed–Solomon algorithms. This allows scanners to recover data even if part of the QR code is damaged, dirty, scratched, or obscured.

Higher error correction improves resilience but increases QR code density. For most websites and printed materials, Level M provides the best balance between size and reliability.

Best Practices for QR Codes

• Keep URLs short: Shorter content produces cleaner and easier-to-scan QR codes.
• Test across devices: Scan your QR code using both Android and iPhone devices before publishing.
• Use sufficient size: Small QR codes may fail to scan from a distance or on low-quality prints.
• Maintain contrast: Dark modules on a light background work best for scanners.
• Leave a quiet zone: Add white spacing around the QR code so scanners can isolate it correctly.
• Avoid over-designing: Excessive gradients, logos, or decorative effects may reduce readability.
• Use HTTPS links: Secure URLs build user trust and avoid browser warnings.

Common Real-World Uses

Generate a QR Code

QR Code Best Practices for Developers

Creating a QR code that works is easy. Creating one that works reliably across all devices, environments, and use cases requires careful attention to technical details. This section covers the engineering decisions that separate a QR code that sometimes fails from one that scans perfectly every time.

Choosing the Right Error Correction Level

Error correction is not a "set it and forget it" decision — it directly affects both reliability and scannability. Higher error correction means the QR code can survive more damage, but it also means more modules (black and white squares), making the code denser and harder to scan at small sizes.

• Level L (7%): Use for digital-only QR codes displayed on clean screens where damage is unlikely. Produces the least dense code.
• Level M (15%): The best default for most applications — website links, business cards, and marketing materials.
• Level Q (25%): Use for QR codes in industrial environments, outdoor signage, or warehouse labels where dirt and wear are expected.
• Level H (30%): Required if you plan to overlay a logo in the center of the QR code. The logo covers part of the data area, so the higher redundancy compensates.

Optimal Size and Quiet Zone Requirements

The "quiet zone" is the white border around a QR code that helps scanners distinguish the code from its surroundings. The QR specification requires a minimum quiet zone of 4 modules wide on all sides. Without this margin, scanners may fail to detect where the code begins and ends.

For print, the minimum recommended size is 2cm × 2cm (about 0.8 × 0.8 inches) for a simple URL. For scanning from a distance, follow this rule of thumb: the QR code should be at least 1/10th the scanning distance. For a QR code scanned from 1 meter away, make it at least 10cm wide. For digital screens, ensure the QR code is at least 240 × 240 pixels.

Testing with Multiple Scanner Apps

Never assume your QR code works just because it scans with your phone's camera. Test with at least three different scanning methods: the native iOS camera, the native Android camera, and a third-party QR scanner app. Each uses different decoding algorithms with varying tolerance for edge cases like low contrast, small size, or unusual data formats.

Also test at different distances, angles, and lighting conditions. A QR code that works perfectly on your monitor may fail when printed on glossy paper under fluorescent lighting due to glare.

Dynamic vs Static QR Codes for Production

For any production deployment where the destination might change, use dynamic QR codes. A dynamic QR code points to a short redirect URL that you control (e.g., qr.yourdomain.com/abc123). You can update the destination without reprinting the QR code. This is essential for printed marketing materials, product packaging, and restaurant menus.

// Dynamic QR code redirect server (Express.js)
app.get("/qr/:code", async (req, res) => {
  const { code } = req.params
  const entry = await db.findQRCode(code)
  
  if (!entry) return res.status(404).send("QR code not found")
  
  // Track the scan
  await db.recordScan(code, {
    timestamp: Date.now(),
    userAgent: req.headers["user-agent"],
    ip: req.ip
  })
  
  // Redirect to current destination
  res.redirect(302, entry.destinationUrl)
})

URL Shortening Considerations

Shorter URLs produce simpler, less dense QR codes that scan faster and more reliably. However, using third-party URL shorteners (like bit.ly) adds a dependency — if the shortener service goes down, your QR codes break. The best practice is to use your own domain for short URLs. This gives you full control over uptime, analytics, and redirect destinations.

Keep the total encoded data under 100 characters when possible. Every additional character increases the QR code's version (size), making it denser and harder to scan in imperfect conditions.

Tracking Scans with UTM Parameters

For marketing campaigns, append UTM parameters to your QR code URLs so you can track scan performance in Google Analytics or other analytics platforms. Use distinct UTM campaigns for each physical placement (e.g., poster vs business card vs product packaging).

// Example QR code URL with UTM tracking
https://example.com/landing?utm_source=qr&utm_medium=print&utm_campaign=spring-sale&utm_content=poster-a

// For shorter URLs, use your redirect server with tracking built in
https://qr.example.com/spring24
// → Server logs scan metadata and redirects to the full URL with UTM params

Accessibility Considerations

QR codes are inherently inaccessible to users who are blind or have low vision, users whose phone cameras are broken, and situations where scanning is not practical. Always provide a text alternative alongside every QR code. This can be a short URL printed below the code, an NFC tag as a fallback, or a text instruction describing where to find the linked content.

In digital contexts, include descriptive alt text for QR code images (e.g., "QR code linking to example.com/menu") and provide a clickable link as a fallback. Never make a QR code the only way to access important information or complete a required action.