2024年6月11日にリリース予定の WooCommerce 9.0 では、CSS などでカスタマイズしている方にとって大きな変更があります。
特にデザインのカスタマイズをしているサイトは注意が必要です。ただし、CSS の構築方法によっては問題がない場合もありますので、内容を確認し、対応が必要かどうかをしっかり確認してください。
デザインが崩れる可能性が高い場合は、必ずステージングサイトを用意して対応することをお勧めします。必要があれば、弊社の以下のサービスをご検討ください。
この記事は「Developer Advisory: HTML Tag Update in Block Templates for WooCommerce 9.0 (Albert Juhé Lluveras • May 17, 2024)」という記事の日本語訳です。
ここから=====
概要
WooCommerce 9.0 では、2024年6月11日にリリース予定で、いくつかのブロックテンプレートのメインHTMLタグを <div> から <main> に変更し、アクセシビリティを向上させる予定です。
更新されるテンプレート
以下のテンプレートが更新されます：
- archive-product.html
- product-search-results.html
- single-product.html
- taxonomy-product_attribute.html
- taxonomy-product_cat.html
- taxonomy-product_tag.html
- blockified/archive-product.html
- blockified/product-search-results.html
- blockified/single-product.html
- blockified/taxonomy-product_attribute.html
- blockified/taxonomy-product_cat.html
- blockified/taxonomy-product_tag.html
この変更の理由
アクセシビリティの向上
<main> タグはページの中心コンテンツを定義し、スクリーンリーダーなどの支援技術に対してより良いサポートを提供します。この変更により、これらの技術に依存するユーザーのナビゲーションが向上し、当社のアクセシビリティへの取り組みと一致します。
必要な対応
カスタムテーマの場合
カスタムテンプレートの更新: 影響を受けるテンプレートをカスタマイズしている場合、これらのアクセシビリティ向上を利用するために <main> を使用するように更新することをお勧めします。
カスタムCSSの場合
セレクタの変更: カスタム CSS が div.wp-block-group をターゲットにしている場合、main.wp-block-groupに更新するか、スタイルが WooCommerce 9.0 のアップグレードで壊れないようにより一般的なセレクタ（.wp-block-group など）を使用してください。
グローバルスタイル: 将来のアップデートとの互換性を確保するために、カスタム CSS よりもグローバルスタイルを使用することを強くお勧めします。
ベストプラクティス
特定のネスティングを避ける: ブロックが移動または更新された場合に壊れる可能性があるため、特定のブロックネスティングに依存する CSS セレクタを記述しないでください。
グローバルスタイルを使用: 他のプラグインやテーマとの競合を最小限に抑え、テンプレートの更新と互換性を維持するためにグローバルスタイルを採用してください。
次のステップ
モニタリングとサポート
私たちはフィードバックを綿密に監視し、問題に迅速に対処します。支援が必要な場合や問題が発生した場合は、サポートチャンネルまたは Twitter の @DevelopWoo までご連絡ください。
フィードバックと質問
質問やフィードバックについては、サポートチャンネルでご連絡いただくか、Twitter の @DevelopWoo でご連絡ください。
結論
これらの改善を実施するにあたり、ご協力とご理解を賜りありがとうございます。私たちの目標は、アクセシビリティを向上させながら、すべてのユーザーにシームレスな体験を提供することです。ご支援ありがとうございます。