Mommy, Where Do Websites Come From?

TLDR

#

In the case of zachliebl.com, a book-sized black box with spray paint on the front sitting in Somerville, Massachussetes

In the case of most websites, a pizzabox-sized silver box with minimal decorations sitting in Silicon Valley, California

---

Here is a bit more information.

What do Computers Say to Each Other?

#

Despite how much the World Wide Web has made its way into our work and pleasure, the way it works is still magic to the average Joe. Yet, the amount of engineering and mis-engineering that has built our world’s digital infrastructure is anything but supernatural and stands as a testament to humanity’s ability to overcome the impossible.

In order to access a website, a connection must be established between two computers. In this case, a computer can be a PC, a smartphone, Macbook, or plenty of other things. One of the two computers is called a “server” and it is responsible for “serving” the website to the other computer, known as the client. The person who develops the website, known as the “webmaster,” will publish their updates, blog posts, etc to the server.

When the client first visits a site or hits the refresh button in their browser, they will ask the server to establish something known as a TLS connection. As I will get into shortly, everything that you do online, whether it be sensitive banking transactions or not, is shown directly to tons of computers run by people you do not know, who have any number of intentions. This is an integral design of the Internet, and is both one of its strengths and weaknesses. Anyway, TLS is a method used to decide a secret cryptographic language such that the client and server can understand each other, but if a n’er-do-well reads the message, it will be untranslatable gibberish. This stops your web traffic from being snooped on for the most part and is enough for most people. However, it is not foolproof:

Of course, you can come up with a secret language with your friends such that only they will understand your yodeling. But if you don’t want people to know that you are yodeling in the first place, or if you are trying to hide your face, this encryption does not protect you. For example, this is the premise behind Meta’s product WhatsApp. Your actual messages are encrypted, but when you send them, who you send them to, etc are recorded by Meta and sold to data brokers. This how they make money.

Nevertheless, after the secret TLS language is established, the client will ask the server for a web page. The server will respond with this page, which is represented by a bunch of words in a format called HTML and CSS that your browser can interpret and display. If you press F12 in your browser, you can read the HTML and CSS of the current webpage. If you edit some of this, you can watch the webpage change in front of your very eyes. The server does not know or care about what you do with the webpage once you have it; it only cares about serving the page when asked. An exception may be Javascript.

Javascript is a programming language which is used in web development. It is easy enough for anyone to learn, so if you are considering breaking into the tech field, consider learning it. On most of the websites you visit, interactivity such as forms, animations, and, for my website, searchbars, are made using Javascript. Sometimes this interactivity will need to send data back to the server, such as for a chatbot in a website, but for the most part it just stays on your local computer. Javascript is also the main way that advertisements and malware (aka viruses, trojans, etc) work, so if a webpage is loading slowly or has annoying pop-ups, try running it through 12ft.io and see if there is a difference. 12ft.io will show you websites without Javascript.

---

How do Computers Speak to Each Other?

#

Now that we know why computers ask each other things, the real question is how. Luckily, this is simple to answer, and depends on the fact that every computer is physically connected to each other.

In every computer that can access the internet, there is something known as a NIC (Network Interface Controller). There are many types of NICs, and often computers have more than one. A desktop, for example, normally has a WiFi and an Ethernet NIC. A smartphone may have a WiFi and a 4G or 5G NIC. NICs are responsible for sending and receiving data over a computer network.

A computer network is simply a set of computers which are somehow physically connected to each other or to the same router. You may know of a router as the thing that your ISP (Internet Service Provider) gives you as part of your subscription. Each of these small routers has at least 2 NICs on it: one which connects to the wider Internet, called a WAN (Wide Area Network), and one which connects to a small number of devices, such as the network in your house, called a LAN (Local Area Network). It is called a router because when it receives a message, it forwards that message onto the correct route. For example, if a message is destined for a foreign country, it will route it to the WAN. When the response to that message comes back, it will route it to the device that originally sent it on the LAN.

Typically, each building, such as a house or office building, will have its own computer network. This is a generality, though, as something like an AT&T 5G network will span an entire continent. Most networks are connected to each other, forming a “network of networks,” also called an “internetwork” or the Internet.

They are called networks because, like a fishing net where each fiber connects to many other fibers, each path between routers connects to many other paths, thus making it decentralized. Each path starts and ends at a single computer, called a “node.” For websites, both the server and client are nodes. Remember that a node can be anything, as long as it has a NIC. In fact, I considered running this website off of my Nintendo Switch, which is certainly possible, but I decided against it.

Most computers use an Ethernet jack to connect to the network, which directly sends elecrical signals over the copper inside a cable. A high voltage represents 1 and a low voltage represents 0. These numbers represent a language called binary, which is similar to Morse Code.

Obviously, a smartphone or laptop still works without any cables, so they use radio waves instead of electrical pulses. There are multiple ways to encode data in radio waves, but a popular one is to offset the timing of the peaks of the radio wave phases. A 180 degree offset is a 1 and no offset is a 0. The important bit is that the wireless NIC has antennae attached to it, which will send and receive radio waves. For WiFi, the NIC communicates with a local wireless access point (WAP), which is often built into a router. For 3G, 4G, 5G etc it sends signals to a cellular tower. Once these reach the WAP or cellular tower’s NIC, they are converted back into electrical signals representing binary.

Well, how does the binary message get further than that? If the two nodes are directly connected via the same cable or WiFi connection, then the best path is obvious. However, nodes are often thousands of miles apart, so this method is rarely available. The solution is to use an ISP (Internet Service Provider).

An ISP is simply an entity, normally a utility company, which physically connects multiple networks. Often they do this with cables that previously served as phone infrastructure, called coaxial cables. In other areas, it is common for the ISP to use fiber optic cables, which more reliable than copper cables. Furthermore, rural areas may use a satellite connection, where radio waves are sent from the local building to a satellite and then relayed to the ISP’s office. No matter how it gets there, all your messages and those of other customers will be physically funneled to a router at your ISP’s office.

Sometimes, smaller ISPs will actually be customers of larger ISPs, so they funnel their traffic up to the larger ISP’s router. However, all nodes are somehow attached to a router, so after all this hot potato-esque forwarding of the message, it will eventually reach the target. The target will create a response to the message and send it on a journey back to the first node.

---

A Sense of Scale

#

The Internet is truly a massive machine. It is one thing to read about how complicated it is, but it is another to see it quantified in a picture.

Although any computer can be a server, most servers are specialized devices which cram as much compute power into as small a space as possible, so that managing them easier. These servers are normally stored in a datacenter, which is a warehouse that is specially built to supply large amounts of electricity and cool air to large amounts of computers. Datacenters are also highly secured and often accompanied by armed guards.

Keeping with the theme of webservers, I went on SuperMicro’s website to configure a high-end webserver which would fit in a datacenter. SuperMicro is one of the more popular server computer vendors. Here is a product I quickly found, the SuperMicro “Hyper A+ Server AS -1125HS-TNR” (Yes that is the real name):

If this was actually in service, it would have a lid on the top, in which case it would look like a 3 foot x 17 inch x 1.7 inch sized 50 pound metal box. It is so long because the other two dimensions must be standardized to fit in a 19 inch server rack, so if it wants to be bigger it has to be longer. This server is 1U (1 rack unit) tall, and a standard rack may have space for 42U of computers. In case it isn’t clear, the server has rails on the sides and can slide out like a drawer:

Here are some Dell servers in a partially-filled rack in an office or school:

Here is an example of some racks with SuperMicro servers in a datacenter:

Every one of those metal rings in the picture above represent the left or right of a 1U server. In this picture I counted about 65 servers, though there are obviously a lot more out of frame. Assuming that these are all the same configuration as that SuperMicro server:

That would be nearly $5 Million USD worth of equipment in the photo. This is before considering warranty or software costs. This is price was after I added a license for Windows 2022 Datacenter:

Yes, that is over $38k USD for a Windows license. If you look closely, this system has 2 64-core CPUs for a total of 128 cores. More cores generally means a faster computer. For comparison, a high-quality, brand new laptop in early 2024 will have 6 cores.

To take advantage of this, professional software is often licensed per-core. This is because big companies that can afford many cores are likely to be able to afford expensive software licenses. In this instance, I had to select 5 24-core licenses and 2 4-core licenses to reach 128.

If we get back to routing, the data has to get between routers somehow, even if they are on different continents. To do this, hundreds of optical fiber cables are laid on the floors of the world’s oceans. These cables are split into hundreds of individual 62-mile (100 km) segments and are connected with repeaters on each end. The longest of these cables is SEA-ME-WE 3, which, in a single run, touches Germany, Korea, and Australia. It is 24,000 miles (39,000 km) long. Here are some workers unspooling a cable:

Remember that these cables run through international waters and that a cut at any section of it will render the entire thing useless. This point is of special interest to governments around the world who fear of an intentional sever during wartime.

Speaking of the ocean, Microsoft sees potential in putting their datacenters there. Computers, especially fast ones, generate a lot of heat. One of the main costs for traditional datacenters is keeping the servers cool with air conditioning. In densely-populated tech hub cities, paying for land is also a major cost. Microsoft has a solution to this. It has run successful experiments in putting servers inside of capsules on the ocean floor. These capsules are connected to land-based datacenters via a cable. By being underwater, Microsoft does not have to compete with traditional businesses or homeowners for land. The cold ocean floor keeps the capsule at a comfortable temperature. The servers have their settings configured remotely, which is standard for the computer industry. In this way, Microsoft could rent a small building on the shoreline and have dozens of these pods laying at the bottom of San Francisco Bay.