Андрей Власов

Вопрос некорректный. Массового явления демонстрации мобильной версии сайта на десктопе нет, есть отдельные сайты, разные версии которых сложно поддерживать — там вообще от десктопной версии отказываются.

В приведенном примере сайта roistat это просто решение конкретного разработчика или недоработка. В коде css можно увидеть, что он добавил кучу стилей под множество ничем не оправданных разрешений, как будто просто экспериментировал и это пошло в релиз.

Есть уже давняя тенденция на mobile first, это да. Еще тенденция: показывать мобильный дизайн на десктопе (точнее универсальный UI, основанный на мобильном), например те же сервисы гугла или мейлру. Но это уже вопрос консистентности системы и приоритетности мобильной версии.

Такого решения пока нет, Adobe XD еще в ранней бете. Но оно обязательно появится в нативном виде https://blogs.adobe.com/creativecloud/collaborativ...

Модальные окна имеют свои плюсы:
— акцентируют внимание на важной информации;
— позволяют вынести информацию, которую сложно встроить на страницу, в отдельное окно, тем самым не портить текущий дизайн.

На экране мобильного или вертикального планшета места еще меньше, и встраивание доп.инфы еще сложнее. Проблема перекрытия данных клавиатурой ввода все равно останется.

Предлагаю просто адаптировать модальные окна:

@media (max-width: 768px) {
    .modal {
        border: 0;
        border-radius: 0; // избавляемся от границ и скруглений
        margin: 0; // отменяем сдвиг направо (margin-left: -280px;) для больших экранов
        position: absolute;
        top: 0; // размещаем сверху
        left: 0; // отменяем центрирование для больших экранов
        width: 100%; // растягиваем на всю ширину экрана
    }
    .modal.fade.in { top: 0; } // фиксим бутстраповский хардкод
}

PS. Системными алертами можно заменить только информационные окна (с текстом и кнопками «Ок», «Отмена»). Но это лишь частный случай.
Пример адаптивной верстки выше я использовал, к примеру, на сайте дата-центра «Технодом» на странице пополнения баланса, где в модальном окне отображается не только дополнительная информация о размере комиссии, но и поле ввода суммы пополнения.