Tech 101: What is HTML + Why Should You Learn It?

Ready to pivot to a career in tech as a web developer? Good! Web developers use coding languages to bring websites and mobile applications to life, meaning it’s a job with high demand (AND it pays an average $73k yearly salary). But where do you get started making the transition? At the beginning, of course! And when it comes to web development the beginning is HTML.

In order to explain exactly what HTML is (and how to start learning it), we’ve put together a guide demystifying this foundational tech skill and showing you how easy it is to get started.

Table of Contents

1. What is HTML?
2. Learning HTML
3. HTML Examples
4. How HTML Becomes a Web Page

What is HTML?

HTML: a Basic Definition

TLDR: HTML (HyperText Markup Language) is a coding language used to define parts of web pages or mobile apps to the web browsers that visit them

Sound basic? That’s because it is! HTML is probably THE most basic building block in the web development process, and that’s what makes it so critical to learn. To expand on the definition above:

• HTML tells browsers which part of a webpage is a header, which is a footer, where paragraphs belong, where images, graphics, and videos are placed, etc.
• Browsers take that HTML content and translate it into what you see on your device’s screen.
• HTML is an industry standard language that’s guaranteed to be understood by all web browsers (applications like Safari, Firefox, and Google Chrome),
• HTML is also the universally accepted standard for making websites “findable” by search engines like Google, Yahoo, and Bing based on relevant search terms (i.e.: the search words you type into the search bar).

You won’t get far building a website without structured, searchable webpage, and that’s why HTML is one of the first languages you should learn if you’re interested in coding. But what does learning HTML involve?

(back to top)

Learning HTML—How Long Does it Take and Where to Start

If you’re new to tech, learning HTML might seem like a big undertaking, but don’t panic! Learning HTML is a lot more doable than you might think.

Think Weeks Not Years

The time frame for learning HTML isn’t years, and it isn’t even months:

You can realistically get familiar with HTML in a matter of weeks.

And—after you spend those weeks getting up to speed with HTML (and its sister language CSS, used for defining things like fonts, background colors, and page layout styles)—you’ll be in position to start doing paid work, like building a website, creating a custom email template, or working as a social media manager.

Not looking to do developer-specific work? No problem. It’s still worth spending a couple of months getting aquainted with HTML. Why? Because adding HTML to your resume can help bump up your salary at any job. Meanwhile, if you DO want to be a full-service front-end web developer, you’ll eventually need to add skills like JavaScript to your repertoire, but HTML is your first stop toward a solid coding foundation.

You Can Start Learning Right Now

If you’re ready to learn HTML it’s as easy as starting right now with free online guides like this tutorial from the Mozilla Developers Network (the people behind the Firefox web browser). Then, when you’re ready to take the next step (AND add complimentary skills like CSS and JavaScript), consider a paid, instructor-led class like our Skillcrush Front End Web Developer course. This online class is designed to be completed in just three months by spending an hour a day on the materials.

(back to top)

What Does HTML Look Like?

Although you might not realize it, there’s a good chance you’ve already been exposed to HTML. If you used early personal websites like Myspace where you could customize your page with commands inside <>, you were actually using HTML code. Those bracketed commands are called HTML tags, and they’re a basic component of HTML.

For instance, you know when you visit a website and see a text headline followed by a bunch of paragraphs? The web browser you’re using can tell the difference between a paragraph and a headline because each has its own HTML tag. HTML tags look like this:

<h1>This is a headline</h1>
<p>This is a paragraph.</p>

When you use HTML tags to create something like a headline or a paragraph, you are creating “elements.” Elements are the individual HTML components that make up a HTML document or webpage, defined by those opening tags (<p>) and closing tags (</p>), as well as the information between them (This is a paragraph). A web page’s HTML elements can consist of different types of content and media, including:

In order to place any one type of media on your webpage, you have to use its particular HTML tag. For example, images get <img> tags, videos get <video> tags, and so on.

Elements can also include:

• Meta elements
• Structural elements

Meta elements are HTML elements that users don’t see when they’re visiting a webpage, but give web browsers additional information about the page—things like keywords, the author of the document, the time and date it was last modified, etc. These are mainly used for record keeping on the web developer’s end or for optimizing the website for search engine results, making the site more likely to appear when people Google the site’s keyword topics.

Structural elements are the HTML elements used to organize the content of a web page. Structural elements like <div> and <span> are used to denote block-level content (content that takes up the full width of its “container” or page) versus inline content (content that only takes up the space between its tags), while elements like <header> contain the header content of a page, <footer> contains the footer content, etc.

Finally, attributes are instructions that can be added to HTML tags in order to provide additional information about elements. For example, an HTML element like a paragraph can have an attribute for how it’s aligned (left, center, or right). Attributes are included in the opening tag and made up of the attribute name, an equal sign, and a value in double quotes.

Example: <p = align=”right”>This is my paragraph!</p>

(back to top)

How Does HTML Become a Web Page?

So how does all this HTML stuff go from HTML code to becoming an actual website? It’s a surprisingly straightforward process—HTML code can be written as a plain text HTML document in any basic text editor or word processing program, after which it’s saved as an HTML file with .html at the end. No exotic hardware other than a standard computer is required. Those .html files then become the basis for a website’s individual pages and are put online as a live website through a process called web hosting. Web browsers visiting and viewing your HTML pages are able to translate the tags and text and process them into the final product on visitors’ screens.

Additional programming languages and techniques are required to achieve results beyond static web pages (features like animated graphics, interactive forms, and photo slideshows), but—no matter what—HTML is a key, foundational step in web development.

(back to top)