Using URLs

Uniform resource locators are an extremely important part of the web—they’re how we address nearly everything.


Why do URLs matter

The whole web is built on URL—everything has a URL. Without URLs there would be no links—and links are everything to the web. At the top of every web browser us the URL where you can see the URL of the current page.

Many modern browsers are starting to hide the URL bar, or at least make it less important—which is a real disappointment. But, I suppose, they are a little bit of a power user feature—that you should be using.


Pieces of a URL

A URL is comprised of a few different pieces, mostly human readable:

scheme://hostname:port/path?query#fragment
  • scheme — usually “http” or “https”, the communication method the computers use to speak with each other
  • hostname — also known as the domain, the name given to a computer on the network
  • port — can use to different ports for communication on the computers, the default port for websites is 80 for http and 443 for https
  • path — the file that you’d like to see on the computer
  • query — a query that allows the file to dynamically change
  • #fragment — also known as the hash; where in that file you want to jump to, jumps down the page

Each of these pieces should make sense to a human and should be adjustable—hackable—to change the web page that’s being viewed.


URLs should be hackable

URLs are supposed to be human readable and when considered and made properly by humans—for humans—URLs are greatly manipulatable to change the page.

The most important shortcut key you should remember for your browser is ⌘L—get to the URL bar.

HTTP vs HTTPS

Having a website over HTTPS is almost always better—☛ Learn more about HTTPS

http://www.algonquincollege.com

A URL without HTTPS: http://www.algonquincollege.com—can be easily snooped on.

https://duckduckgo.com https://learn-the-web.algonquincollege.ca

URLs with HTTPS, like https://duckduckgo.com and https://learntheweb.courses, are encrypted for your protection.

https://github.com

Some companies have authenticated organization information in the HTTPs certificate.

WWW is useless

The www part of URLs is completely useless—and as far as many people are concerned—outdated. You should be able to safely remove it from the URL without the page breaking—if the page stops working the developer did a really poor job.

http://www.adobe.com

URLs with www in them, like http://www.adobe.com, are adding extra, unneeded information.

Domains

First, if you know the domain for something just type it in: instead of going to Google and searching for “Facebook”—just type facebook.com into your URL field.

Typing the domain directly is significantly faster because you don’t have to wait for Google to load, then display the results, then click the first entry.

Paths

I use paths all the time to move around a website. By just tweaking the information in the path we can move between pages and back and forth much more quickly than clicking.

https://learn-the-web.algonquincollege.ca

Let’s start at the top of Learn the Web.

https://learn-the-web.algonquincollege.ca/courses/

Add /courses/ to the end will take us to the “Courses” page.

https://learn-the-web.algonquincollege.ca/courses/web-dev-1/

Add /web-dev-1/ to the end will take us to the “Web Dev 1” weekly details.

https://learn-the-web.algonquincollege.ca/courses/web-dev-1/week-01/

Add /week-01/ afterwards will take us directly to the “Week 1” information.

https://learn-the-web.algonquincollege.ca/courses/web-dev-1/week-05/

Change the week number to 05 and we can jump to another week in the term.

https://learn-the-web.algonquincollege.ca/courses/web-dev-3/week-05/

Or change the course number to jump to that week in another course.

Location hashes

By adding a # to the end of a URL we can just to a specific location on the page, assuming you know what it’s called.

https://en.wikipedia.org/wiki/Dinosaur https://en.wikipedia.org/wiki/Dinosaur#Size

Jump down to the “Sizes” section of this Wikipedia page by adding #sizes to the end.

Query strings

Query strings always start with a ? and are usually used to manipulate the content of the page in some way.

https://duckduckgo.com/?q=ceres

One really common use is for searching.

https://duckduckgo.com/?q=dinosaurs

We can change the term after the ?q= to get different search results.

Pages with query strings

Often the search results page is also visible in the URL, here’s an example of changing page results on Amazon:

https://www.amazon.ca/s/?keyword=star+wars https://www.amazon.ca/s/?keyword=star+wars&page=2 https://www.amazon.ca/s/?keyword=star+wars&page=3

See the extra information, the page number, stored in the URL as page=2 or page=3


Video list

  1. Using URLs: HTTPS
  2. Using URLs: Paths
  3. Using URLs: Hashes
  4. Using URLs: Query strings
  5. Using URLs: Keyboard shortcuts