<head> 

  <meta charset="utf-8">        ★文字コード指定 
  <meta name="viewport" content="width=device-width">       ★viewpoint設定
  <meta property="og:title" content="ページタイトル">     ★OGPタグ
  <meta property="og:type" content="ページの種類">
  <meta property="og:description" content="ページの説明">
  <meta property="og:url" content="ページのURL">
  <meta property="og:image" content="サムネイル画像のURL">
  <meta property="og:site_name" content="サイトの名前">
  <meta property="og:locale" content="ja_JP">

  <link href="CSSファイルのパス" rel="stylesheet" type="text/css">     ★CSS読み込み
  <link rel="icon" href="アイコンのパス" type="image/x-icon">     ★アイコン指定

  <title>ページタイトル</title>      ★ページタイトル
  <script defer src="JSのパス"></script>     ★JS読み込み

</head>

metaタグ

文字コード指定

ページの文字コードを指定します。
「utf-8」を指定すれば大体のケースで問題ありません。

viewpoint設定

ページの幅の初期設定です。
レスポンシブデザインにするには、"width=device-width" として表示端末の幅に合わせる設定にします。

OGPタグ

他のサイトからリンクを貼られた時の表示内容を指定できます。
例えば、X(twitter)カードなどの表示を綺麗にカスタマイズできます。

linkタグ

CSS読み込み

ページで使用するCSSを読み込みます。

アイコン指定

ブラウザのURLバー、ブックマーク時などにアイコンとして使用されます。

その他

ページタイトル

ページのタイトルです。
ブラウザのURLバー、検索時の表示、ブックマーク時などにタイトルが適用されます。

JS読み込み

ページで使用するJavaScriptを読み込みます。
deferを設定すると、ページ読み込みと並行してJavaScriptを読み込み、ページの表示スピードをあげてくれます。

以上です。

ブログのhtml headに書く内容