HTML Meta Tags

HTML, or HyperText Markup Language, is the language that web pages use to display their content. It’s made up of different elements which tell the web browser how to show it’s information. In today’s online world, understanding how websites work is crucial. Here are the only basics you need to know about HTML meta tags!



Metadata

The ‘<meta>’ tag doesn’t cause any output but instead is used to give information about the document.  This information could be a page description, the author, or keywords. Search engines can then use this info to find out where to rank the page in search results. It has no closing tag.

This element is always stored in the <head> tag. It takes the format of ‘<meta value = “attribute”/>’. For example, the attribute ‘content’ and value ‘text’ can specify the name.

<meta name = “keywords” content = “Travel, Photography, Technology, Literature” />

<meta http-equiv = “refresh” content = “10” />

<meta name="author" content="Rachel">

‘Keywords’ tells search engines that the page’s content involves these topics.

‘Refresh’ reloads the page on the user’s browser every 10 seconds.

‘Author’ tells search engines who wrote this particular webpage.



Viewport

You should always set the viewport metadata for every page in order to make the website appear correctly. across all devices. The ‘viewport’ is what users can see, and this varies depending on the size of their screen. For example, the size of a phone screen is a lot smaller than the size of a laptop screen.

The ‘width=device-width’ code defines the width of the page. The ‘initial-scale=1.0’ code defines how far the page should zoom in when it loads.

<meta name="viewport" content="width=device-width, initial-scale=1.0">


Comments

Comments don’t cause any output. Instead, they give information to web developers about the code used.

It always takes the format of ‘<!- – Comment goes here – ->’. Because of this, you cannot use a ‘- -’ inside the comment, or it’ll close. Comments are usually used by developers to explain the reasoning behind certain parts of code.

<!-- This paragraph describes this website -->
<p>  Welcome to Rachel.ie where you’ll find posts about travelling, photography, technology, and literature! </p>

<!-- This is a link to the website --> 
<a href = “https://www.rachel.ie/” target = “_blank” > This is my website </a>

Welcome to Rachel.ie where you’ll find posts about travelling, photography, technology, and literature!

This is my website

Read more about programming here!


Share:

Leave a Reply

Your email address will not be published. Required fields are marked *

|