Everything You Need to Know About HTML

Get Our Free Ultimate Guide to Coding for Beginners

Get Our Free Ultimate Guide to Coding for Beginners

Make a plan for learning the tech skills you need to land a new job with this 60+ page FREE ebook!

HTML stands for HyperText Markup Language, a foundational coding language used for building web pages. HTML is an industry standard language that’s guaranteed to be understood by all web browsers (applications like Safari, Firefox, and Google Chrome used on computers, tablets, or smartphones to display with websites). HTML is also a universally accepted standard for making sure search engines like Google, Yahoo, and Bing can find your website based on relevant search terms (i.e.: what you type into the search bar).

In a nutshell, HTML defines the parts of web pages to web browsers that visit them. Those browsers then take a site’s HTML content and translate it into what you see on your device’s screen. Whether your website is the most sophisticated suite of slideshows, videos, and interactive forms, or it’s just one simple page of text, HTML is the language that organizes it all.

Determining which part of the page is a header, which is a footer, where paragraphs belong, where images, graphics, and videos are placed—this is all handled by HTML. And that’s why HTML is one of the most fundamental building blocks needed for developing websites. It’s also why HTML is one of the first languages you should learn if you’re interested in coding.

If you’re new to tech, this might seem like a big undertaking, but don’t panic! Learning HTML is a lot more doable than you might think. 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.

At the same time, even if you aren’t looking to do developer-specific work, adding HTML to your resume can help bump up your salary at any job. However—if you want to be a full-service front-end web developer—you will eventually need to add skills like JavaScript to your repertoire, but HTML is your first stop toward a solid coding foundation.

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 and 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>

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.

Get Our Free Ultimate Guide to Coding for Beginners

Get Our Free Ultimate Guide to Coding for Beginners

Make a plan for learning the tech skills you need to land a new job with this 60+ page FREE ebook!

Want more articles like this?

Sign up to get the most recent tech news, tips and career advice.