これは私の勉強メモです。参考になるかもしれないしならないかもしれません。
<html dir="ltr" lang="ja" prefix="og: https://ogp.me/ns#" itemscope itemtype="https://schema.org/WebPage">
dir="ltr"
https://www.tagindex.com/html_tag/page/html_dir.html
左から右へ
日本語や英語などの場合は、左から右へ記述するので ltr を指定します。
右から左へ
アラビア語やヘブライ語などの場合は、右から左へ記述するので rtl を指定します。
prefix="og: https://ogp.me/ns#"
https://mirai-creators.com/2199/
OGPを設定を行う場合、初めにprefix属性を使用して『OGPを使うための宣言』をします。prefix属性の設定方法をOGPの公式サイトである「The Open Graph protocol」で確認すると、HTML5では「htmlタグ」にprefix属性を設定します。
itemscope itemtype="https://schema.org/WebPage"
https://blog.8bit.co.jp/?p=15323
◆itemscope
プロパティは、マイクロデータの範囲を示します。どんなタグにも記述することが可能です。
常に「 itemscope=”itemscope” 」こちらの形で使用します。itemscopeの中にitemscopeが存在してもOKです。入れ子にできます
先程の山田太郎さんのプロフィールの例だと、sectionの開始タグから閉じタグまでが範囲ですね。
◆itemtype
itemtype プロパティは、マイクロデータのタイプを示します。itemtype は必ず、 itemscope と同じタグに併記されます。設定する値によって、検索エンジンに「このマイクロデータはパンくずです」「このマイクロデータはレシピです」と伝えてくれます。本、ゲーム、レシピ、動画etc..様々な種類の定義があります。
少し変わっているのが、値がURLという点です。
・パンくずの場合：
itemtype=”http://schema.org/breadcrumb”
・本の場合：
itemtype=”http://schema.org/Book”
<meta name="viewport" content="width=device-width, initial-scale=1">
https://gmotech.jp/semlabo/seo/blog/howto-viewport/
viewport（ビューポート）とは、一言でいうと、表示領域のことです。
viewportは、Google推奨のレスポンシブWEBデザイン適用時には、必要不可欠のhtmlタグです。
「width=device-width」を記述することで、表示領域の幅を、PCやスマホなどの端末画面の幅に合わせられます。
また、「initial-scale=1」は初期のズーム倍率を表します。1に設定することで、初めに表示された時の違和感をなくします。
<title>Document</title>
タイトルを入れる
この記事が気に入ったらサポートをしてみませんか？