Мобильный браузер для веб-сайта

Question

Надеюсь, кто-то может знать, что я имею в виду, и где я могу найти такое.

Я создаю новый веб-сайт, и в его рамках я буду предлагать мобильный веб-дизайн. Что мне нужно, если это возможно, - это то, что, если пользователь нажмет на один из моих примеров, он загрузит мобильный браузер (а не мобильный сайт в обычном веб-браузере). Больше похоже на эмулятор, который позволит им увидеть рабочие примеры потенциальных сайтов.

Есть ли что-нибудь, что сделает это, или я смотрю на открытие нового окна до заданного размера и отображение сайта внутри него?

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

Я думаю, что я должен подумать о том, чтобы помещать JPEG или PNG, которые они могут прокручивать, чтобы не выставлять код позади самого мобильного сайта ?!

Если есть такой эмулятор или понравившиеся, которые доступны (и не отображают код в фоновом режиме), я был бы более чем счастлив, чтобы он был направлен в правильном направлении!

Благодаря Пол

Answer 1

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

Если это так, рендеринг дизайна в виде файла плоского изображения для предварительного просмотра - ваш лучший выбор, даже если он пожертвует любыми интерактивными аспектами вашего дизайна. Это грубый компромисс.

Я предполагаю, что у вас есть законная причина для скрытия кода. Но если этого еще нет, вы можете спросить себя, что побуждает вас скрыть исходный код в первую очередь. Сеть построена на открытых стандартах и ​​доступности; вам придется пройти через множество искажений, чтобы скрыть статические ресурсы, такие как HTML, CSS и javascript, из браузера. Я понимаю, если вы обеспокоены отрывочным клиентом, использующим вашу работу без оплаты, но это скорее проблема контрактов/юридических вопросов, чем техническая.

При этом вы всегда можете разместить основной контент мобильного сайта (или изображение содержимого, если вы должны скрыть код) в пределах div указанной ширины и высоты, чтобы визуально эмулировать телефон. Оберните его графикой некоторых телефонов, управляйте переполнением с помощью overflow-y: scroll; и overflow-x: hidden;, и у вас есть это.

Web Design Weekly является прекрасным примером этой концепции в действии.

EDIT: мне пришло в голову, что другой вариант, который вы могли бы разумно изучить, - это видео вместо статических изображений. Всегда вариант, если вам нужно wow клиента. Typeform.com - хороший пример того, о чем я говорю.