HTML レッスン7
メタデータとSEO
検索エンジンやSNSにページ情報を正しく伝えよう
メタデータとは？
メタデータは「データに関するデータ」です。HTMLの<head>内に書き、 ページのタイトル、説明文、文字コード、SNSでの表示設定などをブラウザや検索エンジンに伝えます。 ユーザーには直接見えませんが、検索結果の表示やSNSシェア時の見た目に影響します。
基本のmetaタグ
Monaco + Shiki / Tab でインデント / Ctrl(Cmd)+Enter で再実行
index.htmllazy
39 lines0 issues
Monaco Editor を準備しています
表示領域に入った時点で Monaco と Shiki を初期化します。
preview.local
Live PreviewSEOの基本ポイント
1. titleタグは各ページでユニークに（30-60文字）
2. meta descriptionは120文字程度で内容を要約
3. h1はページに1つ、h2-h6で階層構造を作る
4. imgにはalt属性を必ずつける
5. セマンティックHTMLを使う
6. ページの読み込み速度を意識する
7. OGP設定でSNSシェア時の見た目を整える