Skip to content

Everything you need to know about HTML elements

Estimated reading time: 5 minutes

HTML (Hyper Text Markup Language) can be used exclusively to build a website. However, website owners and bloggers may be more familiar with HTML in terms of formatting when the site itself is built using CSS or Javascript, but there is some ability to edit HTML as well.

So even if you’re not a coder, and have no intention of building your website, knowing at least some HTML is always handy. That’s because sometimes you might need to manually add changes to your website or blog content through HTML. 

One term to know is HTML elements, which is a term used to describe some of the basic HTML functions.

In a nutshell, HTML elements consist of angle brackets (< and >) which are sometimes known as chevrons. Inside the brackets goes a specific command, and these form a core part of HTML elements. 

While the topic of HTML is impossible to cover in one blog post alone, let’s get started with some of the basics, so that you can edit your blog or pages with confidence. 

Heading Tags <H1> – <H6>

Known as a block-level HTML element, heading tags are a central feature of SEO and page formatting as a whole.

When using a CMS such as WordPress, it’s normally possible to manually select a piece of text and turn it into an H1-H6 heading. But when editing the code specifically, HTML may need to be used. 

<H1> is the title tag of the page and is the most important for SEO purposes. Ideally, the main SEO keyword of the page should be included in the tag. 

Here’s an example of how a heading may look:

<H1> What is SEO and why does your website need it? </H1> 

Crucially, a forward slash (/) was used at the end of the HTML element. This is to contain the H1 to the heading itself, rather than have the whole page turn into one long H1 tag. A forward slash can be used to end any other type of HTML element. 

Paragraphs <p>

The ability to add a paragraph to text is really important, especially since your website formatting can sometimes mean elements (i.e. copy or images) end up too close together. Therefore, paragraphs can add breathing room from one line to the next. 

While <br> will add in a single line break, <p> will add in a paragraph break. 

The end of the paragraph can be marked by adding a forward slash before the ‘p’ command like so: </p>. 

As a common theme throughout, anytime you want to end an HTML element from continuing into the next element, simply add a / as noted above.

Links <a>

As the name suggests, links connect with another part of a page or even another website entirely just by clicking on them

 A basic link structure looks like so: 

<a href=”https://example.com”>Link Text</a>.

Above, you’ll see the place to add in the link, followed by what the link text should say. 

Links are incredibly versatile for any website, and can be used to create:

  • Anchor links
  • Download links
  • Email links
  • External navigation
  • Internal navigation
  • Jump links

Plus, the likes of UTM campaigns can be created just by adding additional HTML to any links. This means your links will then track clicks to show overall campaign performance over time. Therefore, it’s worth studying this particular HTML element, especially if you do any kind of digital marketing for your business. 

Semantic HTML Elements (HTML5)

Elements including: <article>, <aside>, <main>, <nav> and <section> are known as semantic elements. 

Introduced in HTML5, any HTML elements classed as ‘semantic’ provide additional meaning to other parts of the page. In particular, semantic elements enhance SEO while also improving page accessibility. 

Imaginaire – Web design & development Nottingham

We’re only just getting started with all things HTML. So let’s not put an </end> to this conversation if you need any help with your website as a business owner! 

There are endless ways your current website may have been designed or developed. But if you need a little help in gaining traffic, and more importantly conversions then the Imaginaire team are here to help. 

Based in Nottingham, we offer specialist web design and development services to businesses across the UK. 

For any help or advice on HTML elements as part of our web design services, or for improved SEO elsewhere on your website drop us a message or give us a call on 0115 697 1541. 

Rachael is a content executive with Imaginaire. With hands-on experience with all things marketing, she has the knowledge and know-how to explain and advise almost any topic you can think of!

Read these next...

close

Signup to our newsletter and get the latest tips and trends from the world of ecommerce, straight to your inbox