10 HTML Tricks Every Website Owner Should Know

If you run a website, you may have opened up the “Text” or “Code” view of a WordPress page or post and seen a sprawling mess of angle brackets and slashes. Well never fear, because today we’ll dispel some of the mystique around the internet’s oldest programming language… HTML.

Here are 10 simple HTML basics every website owner or publisher should get familiar with. They’re useful, beginner-friendly, and can help you fix or fine-tune your content without needing to call your developer.

1. Always Close Your Tags – The first important concept to understand is that most HTML elements require both an opening tag like <p> and a closing tag like </p>. Forgetting to close tags is one of the easiest ways to break your formatting. Every closing tag will be identical to its opening tag, but just with a backslash before it.

2. Headings – Heading tags are a great way to structure your content clearly. Think of it like creating a Word document: <h1> should be your main page title, followed by <h2> and <h3> for subheadings. This helps with both readability and SEO. <h1>My Page Title</h1>

3. Paragraphs – When you’re writing text content, most UIs like WordPress or Wix will format your text for you. But it’s useful to know that each paragraph ought to be wrapped in a paragraph <p> tag. This ensures proper spacing and clean formatting across all devices. <p>My paragraph text</p>

4. Links – This is a very useful one! Everyone needs to create hyperlinks at some point. To do it takes a few steps, but the basic syntax is to use the anchor <a> tag. The <a> denotes the opening of a link. We then use the attribute href=”” to put our link inside. Finally, we add our desired link text between the opening and closing tags. <a href=”www.examplelink.com”>Visit my link</a>

5. Bold and Italic – You can easily style your text to be italic or bold by using these handy tags. Use <strong> to make text bold, and <em> to italicise. <i>This text will be italic</i> and <strong>This text will be bold</strong>

6. Line Breaks – Adding line breaks in your text is very useful when dealing with larger portions of text. The line break <br> tag creates a line break without starting a new paragraph. It doesn’t need a closing tag. <p>My text<br>
on a new line</p>

7. Lists – Bullet points <ul> and numbered lists <ol> are created with list item tags <li>. These are fantastic when you need to structure your content as lists. Start by opening your list with either a <ul> or <ol> tag. Then use an opening <li> and closing </li> tag for every single item. Finally, close your list with a closing <ul> or <ol> tag. <ul><li>My first list item</li><li>My second list item</li></ul>

8. Divs – Divs are invisible boxes which are primarily used to group content together and control a layout. You won’t use them often for writing content, but it’s helpful to know what they are when you are looking through your code. <div><p>My content grouped inside an invisible box</p></div>

9. Use Readable Formatting – This is more of a tip, but when writing HTML, it’s important to know that browsers won’t actually understand gaps and spacing unless you use CSS or line breaks <br>. This might seem like a bug, but it’s actually a feature; it allows you to write HTML in a way that is readable to us humans. So if you give HTML a go, make sure you add each element on a new line, providing appropriate spacing so you can read it easily later.

10. Keep It Simple – Lastly, don’t overuse HTML tags or over-style your content. Clean, simple structure goes a long way to keeping your site looking professional and loading well. And never try this for the first time on your live site! It’s always best to test it on a dummy page first until you are sure of how it works.

Learning these basics can save you time, help you troubleshoot formatting issues, and give you more confidence managing your site. You don’t need to be a coder, just knowing some of the structure behind your content gives you a huge advantage when managing your site, and it’s not hard to get started!

If you do want to learn some more about HTML, or any other languages, there are plenty of free resources online to aid you. We recommend Codeacademy – as they have an activity focused teaching method where you can write code in their UI as you learn it.