HTML is an initialism that stands for “Hyper Text Markup Language,” and is itself the language that all web browsers use to display structured content. In fact, this web page that you’re reading right now is written in HTML!
HTML is an interpreted language, which means that it does not need to be compiled into computer-specific language before it can be used—the web browser simply reads the file with the HTML code in it, interprets it, and displays it immediately. That makes it a very useful language for beginners to learn, because it removes the extra step of compiling before it is usable.
Here’s an example of some of the most common pieces of HTML code: formatting.
1 2 3 4 5 6 7 <p> Hello! </p> <p> This is <strong>HTML code</strong> that can be interpreted by <em>any web browser</em>! </p>
Being a “markup language”, HTML is structured using what are called “tags” that encapsulate the content that is going to be formatted a certain way, causing the content to be “marked up”. The formatted content starts with an “opening tag,” which is a command wrapped in just angle braces
>, and ends with a “closing tag,” which is the same command as the opening tag with a forward slash
/ before it inside of the angle braces.
Above, we see a
<p> tag, which creates a paragraph with consistent spacing around the content contained within. And inside of the
<p> tag, there are also
<em> tags, which make the encapsulated text bold and italicized (emphasized), respectively.
Pretty straightforward, right?
With HTML, you can also display images, provide links to other web pages, or anything else you’ve seen a website display!
1 2 3 4 5 6 7 8 <!-- The <a> displays a clickable link that sends --> <!-- you to the specified "href" --> <a href="https://www.google.com">A link to Google</a> <!-- The <img> tag displays the image specified in --> <!-- its "src" attribute and will display the text in --> <!-- the "alt" attribute if the image can't load --> <img src="http://example.com/image.jpg" alt="An example image" />
<a> tag above is where part of HTML’s name comes from. It is commonly called a hyperlink because it connects you to other content, but the
<a> tag and its
href content tell the whole story: it is an anchor to the specified hypertext reference. The text that the
<a> tag encapsulates becomes the text that will be clickable and send users to the
href when clicked.
<img> tag above, you’ll notice a few other things about HTML that help extend its usefulness: attributes. Attributes are extra information that HTML tags can use to do its job better. Some of them, as with the
src attribute in
<img> tags, are required, but others, like the
alt tag, are not.
You may also have noticed that instead of ending with a
</img> tag, it simply ends with
/>. This is because some HTML tags are themselves content rather than containing it. Other examples are
<br />, which inserts a line break and forces text to start from the next line, and
<hr />, which inserts a horizontal rule (line) to help break up text content.
There is a lot more that you can do with HTML, and the basics are very easy to learn. But HTML is most effective when used in conjunction with another programming language called “CSS”, which is where you can give pieces of HTML specific styles so your content can have a unique look.
One of the links below is a free introductory course to learning HTML and CSS together that I’d highly recommend. If you’re going to be doing anything regarding content on the internet, HTML and CSS are extremely useful tools that you should learn how to use!