HTML, the building block of the web, is the very first computer language any aspiring web developer or designer will study. The best part is that it’s not very hard once you learn how to read it, which really isn’t terribly difficult either. So let’s get started, shall we?
The first thing to learn about HTML (besides that it stands for Hyper Text Markup Language) is that it is built using plain text and markup tags, or more commonly, just tags. The tags describe the plain text and are enclosed in angle brackets (like these: < >). The tags also usually come in pairs, like <strong> and </strong>, which surround the text they are describing. The first tag is called the start tag or opening tag, and the closing tag, which begins with a forward slash, is called the end tag or closing tag.
Ok, that was a lot all at once. Let’s try an example.
<strong>This text is bold.</strong>
The code above will render the following sentence: This text is bold.
In this case, “This text is bold.” is the plain text, while the surrounding <strong> and </strong> tags are describing the text. Once you understand the basic structure of HTML, <tag>plain text</tag>, you’re almost good to go on creating your first HTML document! All you need to do is learn all the myriad tags themselves.
<p>This is a paragraph.</p>
Probably one of the most common HTML tags, the p tag indicates that the enclosed text should render as a paragraph. Depending on the CSS styling (which we introduced in our previous post, Web Basics: What are HTML and CSS?) the paragraph will be rendered in the main body font size, and probably have a medium margin beneath it to visually separate it from the subsequent paragraph. The browser knows to render it that way because of the HTML p tags surrounding it.
<h1>This is an H1 header.</h1>
That code will render like this:
This is an H1 header.
Unlike the paragraph, the header will render in a larger font, and sometimes even an accent font (again, depending on the CSS). The h1 tag is only one of the many possible header tags (usually there aren’t more than 6). They are numbered like this:
And so on. Now that you’ve got the basics, you’re ready to break out on your own! We recommend the W3 Schools HTML tutorials to learn all the most common tags. You’ll be a code in no time!