Wix Studio エディタ：DOM 順序を操作する

この記事内

文書オブジェクトモデル（DOM）は、サイトページの構造化方法を参照し、要素のタブと読み込み順序を決定します。サイトの DOM 順序を整理することで、アクセシビリティとパフォーマンスが向上し、訪問者により良い体験を提供することができます。

参考：

サイトでスタックやフレックスボックスなどのより複雑なレイアウトツールを使用している場合は、DOM 順序で要素を整理することが特に重要になります。

DOM 順序は、ページ上の要素の読み込み、読み取り、タブの順序を決定します。これは、サイトの以下の情報に影響を与える可能性があることを意味します：

アクセシビリティ：サイト訪問者の中には、Tab キーやスクリーンリーダーなどの支援技術を使用してサイトを移動する方もいます。サイトの DOM は、スクリーンリーダーが読み上げる順序と、タブの順序を決定します。DOM とアクセシビリティに関する詳細はこちら

パフォーマンス：DOM は、サイトに読み込まれる要素の順序を決定します。そのため、DOM 順序を要素の視覚的な順序と一致させると、論理的な読み込み体験が促進されます。DOM とパフォーマンスに関する詳細はこちら

そのため、サイト訪問者に最高のエクスペリエンスを提供するためには、論理的な DOM 順序が重要となります。たとえば、最初にサイトメニュー、次にヘッダーの残りの要素、そしてページタイトル、ページコンテンツなどの順で訪問者が移動できるようにします。

DOM 自動順序整理は、ページ上の要素の視覚的な順序（左から右、上から下）に基づいて行われます。要素を追加、配置、サイズ変更すると自動的に DOM 順序が再配置されるため、最適化された状態が維持されます。

作業中のサイトの DOM 順序に問題がある場合は、サイト全体で無効にすることができます。特定の要素に問題がある場合、個々のセクションとコンテナ、およびセクション内のグリッドセルで無効にすることが可能です。

オプションを選択して、DOM 自動順序整理を無効にする方法を確認してください：

サイト全体

セクション・コンテナ

セクション内のグリッドセル

スティッキーな要素やセクションを操作する場合：

DOM 順序に影響を与えることなく、最前面にスティッキーなセクションまたは要素を配置することができます。

DOM 自動順序整理をオフにした後、要素の視覚的な順序（左から右、上から下）に合わせて DOM 順序を手動で変更することができます。