Editor X: Реорганизация элементов с использованием DOM-сортировки

3 мин. чтения
Editor X переходит на Wix Studio, нашу новую платформу для агентств и фрилансеров.Подробнее о Wix Studio
Editor X позволяет вам упорядочить элементы по принципу DOM-сортировки в один клик. При использовании сложных инструментов макета, таких как стек, лейаутеры или репитеры, эта опция гарантирует, что посетители смогут читать ваш контент в том же порядке, в котором вы видите его на экране.
Содержание:

Почему DOM-сортировка важна для обеспечения доступности сайта

DOM-сортировка используется некоторыми вспомогательными технологиями, чтобы помочь посетителям найти нужную информацию. Посетители могут использовать программу чтения с экрана или клавишу Tab на клавиатуре для навигации по странице. В любом из описанных случаев DOM-сортировка контролирует порядок чтения.
При отображении контента, где используется несколько разных типов элементов (например, текст, медиа, кнопки), важно убедиться, что DOM-сортировка подобрана правильно. Тогда посетители смогут следовать вашей логической последовательности и четко понимать, о чем ваш сайт.

Автоматическая реорганизация DOM-сортировки

Вы можете автоматически менять порядок DOM-элементов в лейаутере, репитере или стеке. Мы оптимизируем DOM-сортировку, чтобы реализовать визуальное упорядочивание элементов слева направо и сверху вниз.

Чтобы реорганизовать DOM-сортировку:

Прежде чем начать:
Убедитесь, что вы работаете на самом большом из доступных размеров экрана. Эта опция недоступна для небольших размеров экрана.
  1. Нажмите Слои в верхней части Editor X.
  2. Выберите нужный лейаутер, репитер или стек.
  3. Нажмите значок Дополнительные действия .
  4. Выберите пункт Реорганизация DOM.
Проверьте работу сайта:
Используйте расширение для чтения с экрана на опубликованном сайте, чтобы проверить функционирование автоматической DOM-сортировки.

Настройка порядка DOM вручную

Заметили проблемы с порядком в DOM вашей страницы? Вы можете использовать панель «Слои», чтобы вручную расположить секции и элементы внутри.
Чтобы порядок DOM соответствовал визуальному, ваши секции должны быть организованы сверху вниз . Элементы внутри этих секций должны быть расположены наоборот, снизу вверх.

Чтобы настроить порядок DOM вручную:

  1. Нажмите Слои в верхней части Editor X.
  2. Выберите, что вы хотите организовать:
    • Элементы внутри секции: организуйте элементы снизу вверх с помощью перетаскивания.  
    • Секции
      1. Наведите курсор на верхнюю секцию и нажмите значок Дополнительные действия .
      2. Нажмите Переместить.
      3. Выберите На передний план.
      4. Повторите шаги c со всеми другими секциями, двигаясь сверху вниз.

Была ли статья полезна?

|