meta要素
（そもそもmeta要素とは＝ブラウザや検索エンジンに対して情報を伝えるため設定するもの。）
head内に必ず入れたいmeta要素
初期設定に含まれていないものもあるため、覚えておく。
<meta charset="UTF-8">
→文字化けを起こさないようにするもの
<meta name="viewport" content="width=device-width, initial-scale=1.0">
→様々なデバイスにおいて、それぞれ対応した大きさで表示されるようにする
（何も指定しない場合、スマホで開いたときPCのデスクトップサイズで表示されてしまう）
<meta name="description" content="">
→content内に入れるのはタイトルの説明。８０〜１００文字程度？
<meta property=”og:〜” content=”” />
→メタOGは、正式にはOpen Graph Protcol（ オープン グラフ プロトコル ）といい、SNSでサイトをシェアする際にWEBページのタイトルやイメージ画像など正しく伝えるため設定する。
基本的には下記の一通りで大丈夫
<meta property="og:url" content="このサイトのUPL" />
<meta property="og:type" content="website" />
<meta property="og:title" content="タイトル" />
<meta property="og:description" content="タイトルの説明" />
<meta property="og:site_name" content="サイトの名前" />
<meta property="og:image" content="サイトのイメージ画像" />
また、OGPを設定する場合必要な宣言がprefix=""で、ほぼ定型ではあるがFacebookを含めるか含めないかで少し変わるため注意
Facebook以外を活用→ <html lang="ja" prefix=”og:https://ogp.me/ns#”>
HTML内に宣言
他にもファビコンやCSS適用もあるが、以上を踏まえて実際に書いたコード
↓↓↓
<html lang="ja" prefix=”og:https://ogp.me/ns#”>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML&CSS課題①について</title>
<meta name="description" content="今年の目標を３つ書く">
<!-- CSS適用 -->
<link rel="stylesheet" href="style.css">
<!-- OGP -->
<meta property="og:url" content="https://HTML&CSS/kadai01/index.himl" />
<meta property="og:type" content="website" />
<meta property="og:title" content="HTML&CSS課題①について" />
<meta property="og:description" content="今年の目標を３つ書く" />
<meta property="og:site_name" content="研修" />
<meta property="og:image" content="" />
<!-- ファビコン -->
<link rel="icon" type="image/png" href="images/favicon.png">
</head>