A website's structure and organization play a huge role in making it user-friendly and optimizing its performance in places such as organic search results. The last few years have taught us a lot about URIs versus URLs.
Despite the fact that it might seem like something technical that you don't need to know, we find that understanding how these things operate helps us improve navigation and keep all content and user journeys organized.
Furthermore, there are a wide variety of resources available on the internet today, from web pages to images to weather reports and electronic documents. Identifying and retrieving these different types of resources is important. In order to do so, you'll need to understand what a URI and URL are.
What is a URI?
A URI — short for “uniform resource identifier” — is a sequence of characters that distinguish one resource from another.
For example, foo://example.com:8042/over/there?name=ferret#nose is a URI containing a scheme name, authority, path, query, and fragment. There is no need to include all these components in a URI. The only thing it needs is a scheme name and a file path.
Here’s the exact location the URI linked above brings you to:
Another example of a URI is telnet://192.0.2.16:80/. "Telnet" is the scheme name, and the numbers after the double slash are the authority numbers. There are no characters after the slash since the path is empty. This post will go into more detail about URI syntax.
Telnet isn't used anymore because it's not secure. As you can see in the screenshot below, this URI prompts my browser to open the connection within an app:
Types of URIs
URIs can be divided into two types: URNs and URLs.
Uniform resource names (URNs) are persistent and location-independent identifiers based on the "urn" scheme. The term "persistent" here refers to a URN that continues to identify the same resource over time.
This is an example of a URN provided by RFC 3986: urn:oasis:names:specification:docbook:dtd:xml:4.1.2
URLs, on the other hand, are location-dependent identifiers that are not necessarily persistent. As a result, URLs do not have to identify the same resource over time. The "urn" scheme is also not followed by URLs.
In most cases, you won't need to use URNs much and will be mostly concerned with the structure and syntax of URLs. However, understanding how they differ and work is still valuable.
How do uniform resource identifiers (URIs) work?
Our ability to pull resources from the web and access them relies on uniform resource identifiers (URIs). A resource is uniquely identified by its structure framework. The document could be a file, an image, or an API endpoint.
Here is a quick breakdown of how a URI works based on its structured framework:
In the address bar of the browser, the user enters a URI.
A browser then parses the URI into its individual components (scheme, authority, path, query, and fragment, if any).
By using the components of the URI, the browser sends a request to the server and displays the resource.
As an example, a URI using the scheme "data" and a medium type of "text" means your browser will display the content of the URI as text. As an example, if you paste data:text/plain,Hello%20World! Here's what you see when you enter this into your browser:
URI Syntax
There are five components to a URI, of which two are optional. Because we use URIs so frequently when browsing online, we think this is the best way to understand them. To compare the differences between the two, we'll also discuss the syntax of a URL later in the post.
1. Scheme
The protocol for accessing the resource is described here. You might also recognize protocols like "mailto" or "ftp." These tell the browser what path to take to access a resource. "https" tells the browser to use Hypertext Transfer Protocol Secure.
2. Authority
Browsers receive information about the location of the resource from the authority. Most commonly, this would be a domain name (e.g., the "hubspot.com" part of this website's address). If the resource is an app or service using a custom server setup, this could also be an IP address or have a port number, depending on its type.
3. Path
The path tells browsers where the resource can be found within the domain. It's usually the most part of the resource address after the domain name, such as "/blog/this-is-the-blog-title". Our goal would be to tell the browser where a specific blog post can be found within a domain. The path to a particular document would be everything after "file:///" in a link that points to a file on a computer, such as "file:///C:/Users/JaneDoe/Documents/example.txt.".
4. Query
The query parameter is an optional addition to the URI that can be used to refine or modify the request. Most commonly, we'll see these when searching within a domain.
Let's say you're working on an ecommerce website with an internal search function that users can use to find products. A URI with a query attached to it might look like “https://ecommercewebsite.com/products/search?query=leather&limit=10.” In this case, the query the user has entered is “leather” and the “limit=10” refers to settings that indicate only 10 results should be returned.
5. Fragment
Fragments are also optional, but are most commonly used for locating specific parts of a resource. Jump links within blog posts are the most common example we use. In URIs, they are followed by a "#". Let's say we wanted to bring your attention to this specific section. It would look like this: "https://blog.hubspot.com/website/uri-vs-url#URI-syntax."
Browser-specific schemes can also be used to use URIs. Most of the time, we use Google Chrome, but you can also use Microsoft Edge and other browsers. Google Chrome's settings can be found by entering "chrome://settings". "Chrome" is the scheme and "settings" is the path.
What is a URL?
A URL — short for “uniform resource locator” — is a specific type of identifier that not only identifies the resource but tells me how to access it or where it’s located. For example, a URL might contain ftp:// or https://. This tells me that the resource can be located and accessed via File Transfer Protocol (FTP) or Hypertext Transfer Protocol Secure (HTTPS).
Here are some examples of URLs:
ftp://ds.internic.net/internet-drafts/draft-ietf-uri-irl-fun-req-02.txt
https://blog.hubspot.com/website/application-programming-interface-api
You'll notice that they look similar to the URI examples above. They share many components, including path and query, because they contain many of the same components.
However, URLs also contain unique components, such as protocol and domain. In the last URL example, “https://” is the protocol. "Offers" is the subdomain, and "hubspot.com" is the domain name. “How-to-run-seo-audit” is the path, and the question mark and everything after makes up the query.
How do uniform resource locators (URLs) work?
URLs are like online bridges. They provide what browsers need to access specific locations and files on the web accurately and securely. It is through URLs that browsers are able to parse information and guide users to resources based on protocols, domains, and paths.
Here's how it works.
Our first step will be to paste the URL of the page we want to access into the address bar of an internet browser.
In order to locate what we're trying to access, the browser takes my URL and applies the syntax. By using the domain name in the URL, the browser contacts a domain name system (DNS) to translate the domain name into an IP address. Browsers can find the resource at this address because it is the actual location of the server.
When the browser establishes a connection to the server using the protocol indicated in the URL (e.g., "https"), it sends a request using other information in the URL, such as path. Upon receiving the request, the server processes it and returns the information, such as a web page, to the browser for display.
URL Syntax
Since a URL is a subtype of URIs, its syntax is the same as what we described when going through the syntax of a URI. But let’s take a look at a specific URL example before I go on to describe the differences.
1. Scheme (or “Protocol”)
Browsers use the scheme or protocol to access a page or resource. "http://" is less frequently used these days, for example. This is because https is a newer protocol that encrypts information as it is sent between browsers and servers, making it more secure.
2. Domain
Name of the main website, such as hubspot.com or google.com. However, the browser must also take into account any subdomains.
As an example, we're currently on blog.hubspot.com. We would get a "Page Not Found" message if we tried entering the URL for this page without the subdomain.
3. Path
Again, this is the section of the URL that comes after the domain and points to the specific page on that site. It can include multiple subfolders that might indicate things like a version of a page in a specific language.
4. Query
This optional section of the URL comes up when accessing a page through results on a search engine.
5. Fragment
Another optional piece of a URL, this tells browsers to go to a specific point on the page.
Now, let’s take a closer look at the difference between a URI and a URL.
What is the difference between URIs and URLs?
The key difference between URIs and URLs is that URIs are identifiers, whereas URLs are locators. In other words, a URI simply identifies the resource. It does not describe or imply how to locate the resource. A URL does.
Thus, URLs are a subset of URIs. In other words, all URLs are URIs, but not all URIs are URLs.
Comparing a person's name to their address is the most common analogy used to explain the difference between URIs and URLs. As a URI, a person's name identifies them without providing any information on how to find them. Addresses, on the other hand, identify a person as a resident and provide their physical location. This is why it's like a URL.
Additionally, URIs can be used to distinguish HTML, XML, and other files. On the other hand, URLs are only used to identify and locate web pages.
Identifying and Locating Resources on the Web
Professionals didn't pay too much attention to things like link structure and protocol in the early days of website optimization. Online, however, has become a competitive landscape where visibility is the key to success.
It might seem pretty mundane to discuss the technicalities of URIs and URLs. Understanding URIs and URLs is the foundation for building website architecture that puts user experience and discoverability at the forefront of your digital initiatives when it comes to technical specs and performance.