On

If for any reason, you want to start with a blank HTML Page, here is a Template ...


<html>
<head>
<title>Page Title</title>

<!-- Comment is invisible in browser -->

<style>
<!-- Inline CSS -->



</style>


<!-- External  CSS file -->
<link rel="stylesheet" type="text/css" href="style.css">


<script>
<!-- Inline JavaScript -->




</script>


<!-- External  JavaScript file-->
<script src="files/name.js"></script>


</head>
<body>

<!-- Comment is invisible in browser -->




</body>
</html>

 

 

Now here is the extended version with most important Meta Tags



​​<!doctype html>
<html>
<head>
<title>Page Title</title>


<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
 
 
<meta name="description" content="Type Description Here in Max 110 Characters">
<meta name="keywords" content="Keyword 1, Long Keyword 2, Key WORD 3">
 
 
<meta name="language" content="en">
<meta http-equiv="content-language" content="en">
 
 
<meta name="distribution" content="global">
<meta name="rating" content="General">
<meta name="coverage" content="Worldwide">
<meta name="classification" content="Business">
<meta name="author" content="Type Company Name or If human, then Person Name">
<meta name="copyright" content="company name">


<meta name="robots" content="index,follow">
<meta name="revisit-after" content="7 days">
<meta name="MobileOptimized" content="320">
<meta http-equiv="Expires" content="0">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="imagetoolbar" content="no">
<meta http-equiv="x-dns-prefetch-control" content="off">


<meta name="news_keywords" content="World Cup, Brazil 2014, Spain vs Netherlands, soccer, football">


<link rel="alternate" type="application/rss+xml" title="RSS" href="http://feeds.feedburner.com/martini">
<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="https://example.com/feed.atom">


<link rel="shortcut icon" type="image/ico" href="/favicon.ico">
<link rel="fluid-icon" type="image/png" href="/fluid-icon.png">


 
<!-- Comment is invisible in browser -->


<!-- External Font imported from Google -->
<style>
@import url('https://fonts.googleapis.com/css2?family=Merriweather+Sans:ital,wght@0,300..800;1,300..800&display=swap');
</style>


<style>
<!-- Inline CSS -->

html {
margin: 0;
padding: 0;
box-sizing: border-box;
}

<!-- Ubuntu as Local Font -->

@font-face {
  font-family: "Ubuntu";
  src: url('Ubuntu.ttf') format('truetype');
}

html {
font-family: Ubuntu, Tahoma, "Trebuchet MS", sans-serif;
}

body {
  background-color: #FFFFFF;
}

.headline {
  font-family: "Merriweather Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}

</style>


<!-- External  CSS file -->
<link rel="stylesheet" type="text/css" href="style.css">


<script>
<!-- Inline JavaScript -->




</script>


<!-- External  JavaScript file -->
<script src="files/name.js"></script>


</head>
<body>

<!-- Comment is invisible in browser -->



<h1 style="color:violet;text-align:center;">This is a heading</h1>
<p style="color:green;">This is a paragraph.</p>

<div class="headline">
It's a head line
</div>

<img src="url" alt="Your image description goes here">

<p>Other Content</p>

<p align="justify"> ............... </p>

<p align="center"> ............... </p>



<div align="justify"> ............... </div>

<div align="center"> ............... </div>



</body>
</html>