The Web Is Made Of Strings

In the previous lesson's video, Flatiron School founder Avi Flombaum stated that "the entire web is made of of giant strings of HTML." A "string" as he's using it here is technologist-speak for a series of letters placed one after another. A less-technical synonym for this idea is "text." HTML stands for hypertext markup language and we will learn about it in this section.

The texts sent back and forth on the web are HTML documents. HTML documents are strings that contain both content and markup. Content looks like: hi there and markup looks like <p>. In HTML they are blended together so that the string <p>hi there</p> tells the browser to display the words hi there to the screen in whatever a paragraph, according to the browser, looks like.

Here's another fragment of an HTML document:

<h1>About My Poodle</h1>

<p>I have an adorable black poodle named Byron.</p>

This document has two "elements" an <h1> or "Heading 1" element and a <p> element or "Paragraph" element.

The browser receives, from the server, this HTML document and then uses it to "draw" a non-markup version in your browser. It drops the HTML elements, but uses the specification of the meaning of those elements to structure what it displays on-screen.

A byproduct of a web page being a drawing of an HTML document is that we can see the drawing (or, "rendered page") or, if we're curious, we can see the HTML document that the browser used to build the rendered page. Right-click (control + click on a Mac) anywhere on a webpage, select "View Page Source" and you'll see the HTML document that the browser used to "render" the website.

Let's peek behind the scenes of two of our favorites websites to see how they are built: Wikipedia and StackOverflow.

Seeing the Text Underneath

Wikipedia's homepage:

View source on Wikipedia's homepage:

Stackoverflow's highest voted questions page:

View source on Stackoverflow's highest voted questions page:

Much of that will look like gobbledygook, and that's fine for now, but it's HTML gobbledygook. Now peek behind your two favorite websites. Visit them and view their page source. You will see that behind that product you love are a collection of HTML text, or HTML documents.

Resources

Unlock your future in tech
Learn to code.

Learn about Flatiron School's Mission

With a new take on education that falls somewhere between self-taught prodigy and four-year computer science degree, the Flatiron School promises to turn students with little programming experience into developers.

In the six months since the Manhattan coding school was acquired by WeWork, it has spawned locations in Washington, D.C., Brooklyn, and London. Now, WeWork is opening a fourth Flatiron School location, this time in Houston.

Adam Enbar, Flatiron School's cofounder, believes now is the time to grow. "How the world is changing has impacted working and learning in very similar ways. We think education fundamentally is about one thing: enabling people to pursue a better life."

Learn. Love. Code.
Students come to Flatiron School to change their lives. Join our driven community of career-changers and master the skills you need to become a software engineer or a data scientist.
Find Us