A URL link is the web address you type into a browser, built from a protocol, domain name, and optional path
A URL (Uniform Resource Locator) is the complete address that tells a browser where to find a page or file on the internet. When you create a URL link, you are writing out that address in a format the browser can read. The simplest URL has three parts: the protocol (usually https://), the domain name (like example.com), and optionally a path to a specific page (like /about/contact). Understanding how these pieces fit together is the foundation for building links that actually work.
Most of the time, you will not type a raw URL into code yourself. Instead, you will use a text editor or website builder to create a link, and the tool handles the formatting. But knowing what goes into a URL helps you spot mistakes when a link breaks, and it helps you understand what you are looking at when you see a URL in the address bar.
Key Takeaways
- Every URL needs a protocol (https:// or http://), a domain name, and optionally a path to a specific page or file.
- In HTML, you create a clickable link using the <a> tag with an href attribute that holds the URL.
- Relative links (like /about or ../images/photo.jpg) point to pages within your own site; absolute links (like https://example.com/about) point to a full web address.
- Common mistakes include forgetting the protocol, using spaces in URLs, and mistyping the domain or file path.
- You can test whether a link works by clicking it in your browser or using browser developer tools to inspect the href value.
The three parts of every URL
The protocol is the first part and tells the browser how to fetch the page. https:// is the find version (encrypted) and is now the standard for almost all websites. http:// is the older, unencrypted version and is rarely used for new sites. You must include one of these at the start, or the browser will not know what you mean.
The domain name comes next and is the human-readable address of the website. Examples: google.com, wikipedia.org, yoursite.com. This is the part you register with a domain registrar. The domain can include a subdomain at the front (like mail.google.com or docs.google.com), which points to a different service on the same domain.
The path is optional and comes after the domain. It points to a specific page or file on that site. For example, in https://example.com/blog/post-one, the path is /blog/post-one. If you leave out the path, the browser loads the home page (the root) of the site. Paths are case-sensitive on most web servers, so /About and /about are different.
How to write a link in HTML
In HTML, you create a clickable link using the <a> tag (the "a" stands for "anchor"). The tag has an href attribute that holds the URL. Here is the basic shape:
<a href="https://example.com">Click here</a>
The text between the opening and closing tags (Click here in this example) is what the reader sees and can click. The href attribute holds the URL. When someone clicks the text, the browser navigates to the URL in the href.
You can also add other attributes to the tag. The target attribute controls where the link opens. target="_blank" opens the link in a new tab instead of replacing the current page. The title attribute adds a tooltip that appears when someone hovers over the link: <a href="https://example.com" title="Visit our home page">Home</a>
Absolute links versus relative links
An absolute link is a complete URL that includes the protocol and domain. Use absolute links when pointing to a different website. Example: <a href="https://wikipedia.org/wiki/URL">Learn about URLs</a>. The browser can follow this link from any page, on any site.
A relative link is a shortened path that points to a page within your own site. It does not include the protocol or domain. If your site is example.com and you have a page at example.com/about, you can link to it with just <a href="/about">About Us</a>. The browser fills in the protocol and domain automatically.
Relative links are useful because they keep working even if you move your entire site to a different domain. They are also shorter and easier to read in your code. Use ../ to go up one folder level. For example, if you are on example.com/blog/post-one and want to link to example.com/images/photo.jpg, you would write <a href="../images/photo.jpg">See the photo</a>.
Common mistakes that break links
Forgetting the protocol is one of the most common errors. If you write <a href="example.com"> instead of <a href="https://example.com">, the browser treats it as a relative link and looks for a folder called example.com on your own site. The link will not work.
Spaces in URLs break links because browsers encode spaces as %20. If you have a file called my photo.jpg, the URL becomes my%20photo.jpg, which is harder to read and can cause problems. Use hyphens or underscores instead: my-photo.jpg or my_photo.jpg.
Typos in the domain or path are invisible until you test the link. A single wrong letter in example.com or /about will cause a 404 error (page not found). Copy and paste URLs when possible to avoid typing mistakes. Also check that your path matches the actual folder structure on your server—if the folder is called blog-posts but you link to /blog, the link will break.
Using uppercase letters in paths can also cause problems. On Windows servers, /About and /about are the same. On Linux servers (which host most websites), they are different. To be safe, always use lowercase in your paths.
How to test whether a link works
The simplest test is to click the link in your browser and see if the page loads. If you get a 404 error or a blank page, something is wrong with the URL.
You can also use your browser's developer tools to inspect the link without clicking it. In most browsers, right-click the link and select "Inspect" or "Inspect Element". The developer tools will show you the HTML code, including the exact href value. Look for typos or missing parts of the URL.
If you are linking to a file (like a PDF or image), make sure the file actually exists on your server at the path you specified. You can test this by typing the full URL directly into the address bar. If the file loads, the link should work. If you get a 404, the file is in the wrong location or has a different name.
Special characters and query strings in URLs
Some URLs include a question mark followed by parameters, called a query string. Example: https://example.com/search?q=web+design. The query string passes information to the server. In this case, it tells the search page to look for "web design". You can include query strings in your links just like any other URL.
Special characters like spaces, ampersands, and equals signs need to be encoded in URLs. A space becomes %20, an ampersand becomes %26, and an equals sign becomes %3D. Most of the time, your browser or website builder handles this encoding automatically. But if you are building a URL by hand and it includes special characters, you may need to encode them manually.
Fragments (also called anchors) let you link to a specific section within a page. They start with a hash symbol: https://example.com/guide#section-two. The browser jumps to the element with id="section-two" on that page. You can link to fragments on other sites or within your own site.
Frequently Asked Questions
Do I need to include www in a URL?
No. Most modern websites work with or without www. The domain registrar or hosting provider usually sets up both example.com and www.example.com to point to the same site. You can use either one in your links, though https://example.com (without www) is becoming more common.
What is the difference between http and https?
https encrypts the data sent between your browser and the server, protecting passwords and personal information. http does not encrypt. Always use https for new links. Most browsers now show a warning if you try to enter a password on an http site.
Can I link to a file on my computer instead of a website?
Yes, using a file path like <a href="file:///C:/Users/Name/Documents/file.pdf">. However, this only works on your own computer. If you upload the HTML to a website, the link will break because the server cannot access files on your local machine. For web links, always use https:// or relative paths.
What does a 404 error mean?
A 404 error means the server could not find the page at the URL you requested. This usually happens because the path is wrong, the file was deleted, or the domain does not exist. Check your URL for typos and make sure the file is actually on the server.
How do I link to an email address?
Use the mailto: protocol: <a href="mailto:name@example.com">Email us</a>. When someone clicks this link, their email client opens with a new message to that address. You can also add a subject line: <a href="mailto:name@example.com?subject=Hello">Email us</a>