Самый простой / лучший способ заставить существующий сайт ASP.NET/jQuery показывать более подходящий пользовательский интерфейс на смартфонах

У меня есть некоторые (большие) веб-приложения ASP.NET, которые люди начинают посещать с помощью смартфонов.

Я ищу способы определить, на каком устройстве они находятся, и внести простые изменения в пользовательский интерфейс, например:

Ой! Ты айфон! Хорошо, давайте просто сожмем заголовок страницы - заголовок, логотипы и прочее - и немного увеличим размер шрифта и кнопок.

Я смотрел на использование ASP.NET или jQuery, чтобы определить, с каким устройством они просматривают, а затем изменить стили на стороне клиента (используя несколько операторов jQuery, добавить дополнительный файл.css или изменить материал). на главной странице, если я действительно должен).

Проблемы:

  1. Как обнаружить? Я думал, что это было легко: разрешение окна браузера. Но все не так просто: у новых смартфонов теперь есть несколько экранов с высоким разрешением, а у нетбуков - довольно низкие. Поэтому, если бы я просто сказал "1024x768 или ниже = смартфон", это неверно идентифицировало бы 7-дюймовые нетбуки с разрешением 800x480 (которые могли бы легко справиться с обычной, не мобильной версией моего сайта). В будущем это только усугубится, поскольку большая их часть или смартфоны догоняют типичное низкое разрешение ноутбука. Нет никакого способа (надежно!) определить физический размер экрана (в сантиметрах или дюймах)?

  2. Как реализовать? Могу ли я применить весь файл таблицы стилей с помощью jQuery? кто-нибудь делал это? Я могу сделать это на стороне сервера, но ограничивает ли это мои возможности обнаружения?

(Если этот точный вопрос был задан ранее, пожалуйста, дайте мне знать, не смог ничего найти).

Источник

1 ответ

Решение

Как обнаружить:

Этот сайт, кажется, имеет всеобъемлющую схему обнаружения: http://detectmobilebrowser.com/

Как реализовать:

(На самом деле не подходит к ситуации OP, подходит только для очень крупных компаний или компаний, предлагающих очень ограниченный мобильный доступ).

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

Некоторые примеры того, как люди размещают мобильные версии:

Источник
Другие вопросы по тегам