The UX of URLs

Ryan Freebern / @rfreebern
Union Street Media

What is a URL?

RFC 1738

“This document describes the syntax and semantics for a compact string representation for a resource available via the Internet. These strings are called ‘Uniform Resource Locators’ (URLs).”

HTTP Spoken Here

“We are building clans around languages we speak to the Machine.”

Why Design URLs?

Why Paint Cats
  1. Because people care.
  2. Because machines care.
  3. Because we can.

People Care


People Care

“[P]eople spent 25% of their time looking at the URL in navigational tasks vs. 22% in informational tasks.”

People Care

“[S]earchers are particularly interested in the URL when they are assessing the credibility of a destination. If the URL looks like garbage, people are less likely to click on that search hit. On the other hand, if the URL looks like the page will address the user's question, they are more likely to click.”

People Care

One does not simply click on

Machines Care

Pixar’s Wall-E and EVE

Because We Can

Climbers at Khumbu Icefall

What Makes a URL?

  • http
  • https
  • ftp
  • data
  • file
  • mailto
  • tel
  • ws/wss
  • about

What Makes a URL?

  • gTLD: .com, .net, .org, .edu, .aero., .asia, .biz, .cat, .coop, .gov, .info, .int, .jobs, .mil, .mobi, .museum, .name, .post, .pro, .tel, .travel, .xxx
  • ccTLD: .us, .uk, .au, .ca, .mx, .cc, .cx, .ws, .io, .ly, .es, .fr …and hundreds more.
  • Infrastructure TLDs: .arpa
  • Reserved TLDs: .test, .example, .invalid, .localhost, and .local
  • http://ws, http://uz
  • Internationalized domain names: http://xn--zkc6cc5bi7f6e.xn--hlcj6aya9esc7a (http://உதாரணம்.பரிட்சை)

What Makes a URL?

What Makes a URL?

What Makes a URL?


What Makes a URL?

What Makes a URL?

What Makes a URL?

What Makes a URL?;param=123/resource?query=data&another=parameter#fragment

What Makes a URL?;param=123/resource?query=data&another=parameter#fragment

What Makes a URL?

What Makes a URL Good?

    Known knowns
    Planned for from the start
    Known unknowns
    Auto-generated from user interaction
    Unknown unknowns
    Added in the future, after you get hit by a truck

A Good Domain

  • Short
  • Memorable
  • Speakable
  • Readable

Good Domains are


  • “Real hyphen estate dot com”
  • “Real estate online dot com”

Good Domains are



A Bad Domain

An odd sex tractor

← Freud

A Bad Domain

A Good Path

  • Reflects information structure
  • Consistent
  • Predictable
  • Most general → most specific


“[L]ong strings of characters that exist only to satisfy some technical constraint, detracting from the effectiveness of our URLs as communication tools.”

A Good Query

  • Query strings are intimidating
  • Keep 'em simple,or.r_qf.&bvm=bv.49478099,d.dmg&fp=f0de797458b9bb2a&biw=1149&bih=660


A Brief Tangent╯°□°)╯︵ ┻━┻

“%2B or not %2B?”

A Good Fragment

  • Fragment = location in a document
  • That is all
  • Use history.pushState()

The Rest of the Puzzle

  • Scheme
  • Domain
  • Path
  • Query
  • Fragment
  • Everything

A Good URL is


Skeptical chihuahua

Credibility is based on



Credibility is based on



Processing Fluency

The ease with which your brain can parse information.

Good URLs are


“A hackable URL is one that makes sense to a human reader, and where the human reader can guess what to change to get to another page.”

Good URLs are


Not hackable:


Who cares?

Good interfaces are habitual.

Habitually Hackable

Not Hackable, No Habit





Canonical URL:

Requested URL:


                            HTTP/1.1 301 Moved Permanently
                            Location: /documents/12345/title-of-the-document

Slug Rules

  1. Stick to alphanumerics and hyphen
  2. Get rid of common words (conjunctions, articles, etc.)
  3. Include something unique (an ID or a date)
  4. (or store the slug with the document)

Good URLs are


Sharing is Caring



A long URL

Avoid Ambiguity

  • O 0
  • G 6
  • 1 I l
  • 2 Z

New-Fangled Sharing

Pictures of People Scanning QR Codes

Should I use a QR code? No. But what if.... OMG NO.




“URL shorteners may be one of the worst ideas, one of the most backward ideas, to come out of the last five years. ... [T]hese general-purpose URL shorteners, with their shady or fragile setups and utter dependence upon them, well. If we lose TinyURL or, millions of weblogs, essays, and non-archived tweets lose their meaning. Instantly. To someone in the future, it’ll be like everyone from a certain era of history […] started speaking in a one-time pad of cryptographic pass phrases.”

I Want Short URLs Anyway


  • One URL for one document
  • 301 any alternates
  • Rewrite trailing slashes

URLs are forever

“When someone follows a link and it breaks, they generally lose confidence in the owner of the server. They also are frustrated—emotionally and practically from accomplishing their goal.”

Know Your Redirects

  • 301 Moved Permanently
  • 302 Found
  • 303 See Other
  • 307 Temporary Redirect
  • 308 Permanent Redirect (Experimental)

Drop the .php

  • Bad:
  • Good:

Pay Up

“Pretty much the only good reason for a document to disappear from the Web is that the company which owned the domain name went out of business or can no longer afford to keep the server running.”

Making a Plan

  • Good
  • Memorable
  • Readable
  • Speakable
  • Credible
  • Hackable
  • Shareable
  • Robust
  • … times a hundred thousand.

URI Templates

RFC 6570


uri_template PHP extension

Less Formal

“User profiles will be located at<username>. We will reserve a number of usernames for future usage, such as "about", "contact", "admin", "stats"…”

Why Should I Care About URLs?

“We are building clans around languages we speak to the Machine.”

Thank you!

Ryan Freebern / @rfreebern
Union Street Media


Image Credits

  1. Why Paint Cats 2006 Calendar” by Ten Speed Press, used without permission.
  2. Love URL” from The Independent, used without permission.
  3. Boromir Meme” based on still from “The Lord of the Rings: The Fellowship of the Ring, from Warner Bros., via, used without permission.
  4. Wall-E and Eve” from “Wall-E” from Pixar, used without permission.
  5. Climbers at Khumbu Icefall” by Mahatma4711 on Flickr, CC-By-2.0
  6. Freud Driving a Tractor” by Von Crunch Design, used without permission.
  7. The Skeptical Chihuahua, Taipei” by Yi Chen on Flickr, CC-By-2.0
  8. Mom's Friendly Robot Company” by, used without permission.
  9. Slug-50051” by Glenn on Flickr, CC-By-SA-2.0
  10. Sharing birthday cake.” by Eric Fleming on Flickr, CC-By-2.0
  11. Long URL” from, used without permission.
  12. QR Code” from Kaywa QR Code
  13. No!” by mslavick on Flickr, CC-By-2.0

Software Mentions