Статья была полезной?
Конструктор страниц GetCourse позволяет создавать и редактировать страницы сайта с учётом ваших потребностей и на ваш вкус. Но иногда лендинг на мобильных устройствах отображается не так, как вы ожидали.
В такой ситуации, в первую очередь, стоит проверить текст. Возможно, в момент вставки текст «слипся» в крупные блоки из-за неразрывных пробелов. Удаление неразрывных пробелов позволяет корректно отобразить страницу.
Лендинг на GetCourse не адаптируется под мобильные устройства: как исправить
Дополнительно изменить блоки конкретно для мобильных устройств можно с помощью настройки видимости блока.
Видимость на устройствах — блок будет виден (скрыт) в зависимости от разрешения экрана устройства, с которого пользователь зашел на страницу.
Возможные границы:
- меньше 320px
- 320px (iPhone X/XS/6/7/8/SE)
- 410px (iPhone XR/XS Max/6, 7, 8 Plus)
- 760px (iPad)
- 1020px (iPad Pro, обычный iPad горизонтально)
- 1200px (ноутбуки)
- 1600px (большие мониторы)
- более 1600px

Укажем в настройках, что блок доступен только с устройств, где разрешение до 760px, например, iPhone. Если пользователь зайдет на страницу с использованием устройства, где разрешение экрана больше указанного, например, ноутбука или персонального компьютера, блок ему отображен не будет.
Адаптируем тексты
Известно, что при просмотре сайтов с мобильных устройств, пользователи меньше читают, пролистывая длинные тексты.
Поэтому специально для мобильных устройств текст требует проработки, необходимо скрывать менее важный контент, оставляя самое ценное.
И именно с помощью настройки видимости блоков мы меняем контент для разных видов устройств.
Обратите внимание на шрифт для текстов, видимых только на мобильных. Шрифт не должен быть слишком мелкий или большой, контент на сайте должен быть читабельным.
Пользователь не должен предпринимать дополнительных действий, чтобы прочитать текст.
Используйте цепляющие заголовки и фразы.
Дополнительно добавьте изображение или анимированный фрагмент в текст, это поможет задержать внимание пользователя и усилить понимание текста.

Оптимизируем изображения
При создании посадочной страницы мы сделали очень красивую обложку и на персональном компьютере она выглядит отлично. НО! при просмотре с мобильного устройства страница загружается достаточно долго, т.к. использована «тяжелая» картинка, имеющая высокое разрешение и четкость, не каждое устройство и скорость мобильного интернета позволят загрузить изображение моментально. В ожидании загрузки на странице будет «пустое» место.
Чтобы этого избежать, необходимо сделать минимум два блока, один для просмотра на персональном компьютере, второй — для мобильных. Возможен и третий блок — для просмотра с планшетов. И для каждого блока загрузить свое изображение: для персонального компьютера можно использовать изображения более высокого разрешения, для мобильных — более «легкие» изображения, чтобы они загружались у пользователя моментально.


Для проверки отображения сайта на разных устройствах можно использовать сервис adaptivator или режим разработчика вашего браузера.
О дополнительных возможностях ручной адаптации мобильной версии страницы узнайте в следующей статье.
Дополнительные рекомендации к оформлению контента на сайтах можно прочитать по ссылке.
авторизуйтесь
Не нахожу у себя ни точек, ни шестерёнки, ничего.
Ответили в рамках технической поддержки.
Напишите, пожалуйста, в техподдержку https://getcourse.ru/contacts со ссылкой на пример страницы и поясняющим скриншотом.
Подскажите, пжлста, что значит "использовать режим разработчика вашего браузера"? Это как?
Спасибо.
Спасибо за информацию. Вы можете использовать другие сервисы или режим разработчика браузера.
Напишите, пожалуйста, нам в техподдержку https://getcourse.ru/contacts и приложите ссылку на страницу, на которой не получается адаптировать обложку.
Спасибо за обратную связь.
Типограф не предназначен для того, чтобы убирать все неразрывные пробелы. Этот инструмент исправляет форматирование текста в целом: убирает только излишние пробелы, мешающие корректному отображению текста, а также может добавить их там, где необходимо (например, между длинным словом и коротким предлогом).
Если вы хотите убрать все неразрывные пробелы, то пользоваться Типографом не нужно, это делается только вручную. Убирать все неразрывные пробелы именно в тексте - нецелесообразно, корректному отображению страницы на мобильном они могут помешать, находясь в заголовках, поскольку в заголовках шрифт крупный.