How To

5 lines of basic HTML that everyone should know

5 lines of basic HTML that everyone should know
Miranda Lucas

Miranda Lucas

  • Updated:

We’re more reliant on computers than ever before, whether that’s for work, play, or our latest Netflix binge. That means we should know a little more about how they function, in case anything goes wrong or we just want a better grasp of how things work. If you’re looking to improve your computer knowledge, the following are 5 lines of basic HTML code that you — and everyone you know — should learn.

5 lines of basic HTML that everyone should know


1. Add headings for readability

There are six different heading options to choose from. To create a heading, you pick one of the heading tag options and place it around your text. For example, if you wanted to create a really big heading, you would use the tag <h1>, followed by the text you want to use as a heading, followed by </h1>. As the numbers go up, the size of the heading goes down, so H1 is the largest, H2 is smaller, H3 is smaller than that, etc. Knowing how to use various headings is especially important if you’re a content creator or social media manager, because headings play a big role in search engine optimization (SEO).

2. Text with hyperlinks

Although Microsoft Word and Google Docs makes this look super easy now, the code for a link is slightly more complicated than highlighting your keywords and adding a hyperlink to the text. To add a link to your text with HTML, you’ll want to use the code: <a href=” “> </a>. For example, the code would look something like this: <a href=”[paste URL here]“>[Text you want to be linked]</a>.

3. Break up text with paragraphs

This is a simple but useful tag to know. It will help you to quickly structure your page for readability. Here you’ll use the code: <p> </p>. Insert the text in between, like this: <p> [Text for your paragraph] </p>.

4. Make a bullet point list

Sometimes, you just want to make (and read) a quick, get-to-the-point list. That’s where bullet points come in. To make a list, simply use the code:


<li>[First point]</li>

<li>[Second point]</li>

<li>[Third point]</li>


5. Include images for mass appeal

The most popular blog posts and articles today include images. Although this code is slightly more complicated, the gist of it is: <img src=” ” alt=” ” style=”width:500px;height:600px;”>. (That code will constrain the image to 500 pixels in width ant 600 pixels in height.)

Next, you’ll add links and texts, or alter the size of the image to fit your needs: <img src=”[link to image here]” alt=“[use text to describe image]” style=”width:300px;height:300px;”>. In this case, the width and height numbers would constrain this image to a 300 pixel square.

The “alt” section is used for SEO purposes, making this another great piece of code to know for anyone who works online.

If you’re looking to learn more basic code, consider taking a few online classes with CodeAcademy or Udemy. It’s guaranteed to come in handy no matter your field — as long as you use a computer, that is!

Miranda Lucas

Miranda Lucas

Miranda Lucas is a writer based in Austin, Texas. Since graduating from the University of Michigan, she's written for numerous web-based publications. In her free time, she enjoys running, camping, and learning Spanish. Every year, she asks Santa for a second season of Firefly, but she's starting to think Santa isn't real.

Latest from Miranda Lucas

Editorial Guidelines