Скрытие элемента из верстки

Чтобы полностью скрыть элемент из верстки, используется параметр Видимость (Visibility). Он позволяет не только визуально скрыть элемент на сайте, но и удалить его из кода страницы.

Зачем скрывать элемент из верстки

Полное скрытие элемента полезно в следующих случаях:

  • На сайте есть незаконченные большие блоки с изображениями, которые увеличивают вес страницы и замедляют загрузку.
  • Тексты на сайте еще не доработаны, есть черновики, которые не должны попадать в поисковые системы.
  • Сайт в процессе разработки, и вы экспериментируете со скриптами с помощью виджета Embed. Если код не доработан и содержит ошибки, то он будет мешать работе сайта.

Как настроить видимость элемента

Чтобы скрыть элемент:

  1. Выберите элемент в редакторе дизайна.
  2. В Настройках на правой панели найдите раздел Видимость (Visibility).

Раздел Видимость на вкладке Настройки

  1. Выберите значение Скрыть (Hidden).

После скрытия элемента:

  • Элемент останется в списке слоев и у него появится иконка «глаз», перечеркнутый двумя линиями.
  • Сверху холста появится панель с кнопкой «Отобразить элемент».

Иконка в слоях у скрытого элемента и панель над холстом

Чем отличаются параметры Видимость (Visibility) и Отображение (Display)

Отображение (Display: None) — элемент не отображается на странице, но остается в коде. Параметр можно установить на вкладке Дизайн в разделе Авто-лейаут.

  • учитывается при загрузке сайта
  • может попасть в индекс поисковых систем
  • скрипты продолжают выполняться

Параметр Отображение на вкладке Дизайн

На панели слоев элемент помечается иконкой «глаз», перечеркнутый линией.

Иконка у элемента с Display: None

Видимость (Visibility: Hidden) — элемент полностью удаляется из кода страницы. Параметр можно установить на вкладке Настройки в разделе Видимость.

  • не влияет на скорость загрузки
  • не индексируется поисковыми системами
  • не запускает добавленный в него код

Параметр Видимость на вкладке Настройки

На панели слоев элемент помечается иконкой «глаз», перечеркнутый двумя линиями.

Иконка у элемента с Visibility: Hidden

Чем полезна функция Видимость

  • Сайт работает быстрее за счет уменьшения веса страницы.
  • Поисковая оптимизация становится чище — скрытые заготовки не индексируются.
  • В процессе разработки можно оставлять черновики и незаконченные блоки — они не будут мешать.