AEM Edge Delivery サイトでのlang属性の設定
AEM ユニバーサルエディターとEdge Delivery Servicesで多言語サイトを構築する際に、静的HTMLのlang属性を設定します。 このアプローチにより、JavaScriptがクライアントサイドで実行される前に、HTMLの要素にSEOとアクセシビリティに関する正しい言語設定が含まれるようになります。 これを修正するには、メタデータでhtml-langを設定して、Edge Delivery Servicesが静的HTMLで正しいlang属性をレンダリングするようにします。
説明 description
環境
- Adobe Experience Manager as a Cloud Service（AEMaaCS） - Sites
- Edge 配信サービス
- ユニバーサルエディター
問題/症状
- 静的HTML出力には、HTML要素に
lang attributeが含まれていません。 - 多国または多言語のサイトのSEOとアクセシビリティの要件を満たすことが困難になります。
解決策 resolution
この問題を解決するには、次の手順に従います。
- Edge Delivery リポジトリでメタデータ定義ファイルを探します。 これは、
metadata.xlsxやCSV ファイルなどのスプレッドシート、または.aem.pageまたは.aem.liveホストで/metadata.jsonとして公開されたJSON シートです。 - メタデータファイルにロケール固有のマッピングを追加し、URL列にグローバルパターンを使用して、ロケール固有のパス（イタリア語ページの場合は
/it-it/<b>など）に一致させます。 - マッピングごとに、
/it-it/のit-ITなど、URL構造に一致するhtml-langプロパティに適切な言語と地域のコードを指定します。 - Edge Delivery Services サイトで使用されているブランチに変更をコミットしてプッシュします。
- AEMまたはユニバーサルエディターから各ロケールの少なくとも1つのサンプルページを再公開して、更新されたメタデータを考慮します。
- サンプルロケールページの対応するEdge Delivery Services URL （
.aem.pageまたは.aem.live）を開きます。 - View Page Sourceを使用して、HTML要素に正しい
lang attributeが含まれていることを確認します。 . 正しい結果がEdge Delivery Servicesに表示されますが、実稼動ドメインに表示されない場合は、CDN キャッシュをクリアするか、更新されたブランチまたはホストへのドメインマッピングポイントを確認します。
### メモ
- - ほとんどの多国または多言語サイトでは、シンプルさと堅牢さのために、バルクメタデータを使用した
html-langの管理をお勧めします。 ユニバーサルエディター内の個々のページメタデータにHTML-lang フィールドを追加することで、ページごとにより詳細な制御を実現できます。 ただし、この値を正しくレンダリングするには、Edge Delivery Servicesのメタデータでhtml-langとして表示する必要があります。
recommendation-more-help
3d58f420-19b5-47a0-a122-5c9dab55ec7f