Чем отличается разработка мобильного сайта от обычного?

Question

Мы собираемся перестроить один веб-сайт, который мы разработали как веб-сайт ASP.NET, для мобильного.Итак, мне интересно, чем разработка мобильного веб-сайта отличается от обычной?

Кроме того, каков наилучший подход для этого, учитывая, что этот мобильный веб-сайт будет просматриваться в основном с iPhone?

Answer 1

Между мобильным устройством и стандартным компьютером есть ряд отличий.

• Экраны намного меньше (меньше пикселей для отображения вашей страницы). Вы должны поместить меньше элементов на каждой странице.
• Они обычно просматриваются в портретном режиме (узкий дисплей - узкая страница). Вы должны планировать использовать полную ширину экрана вместо установки фиксированной ширины страницы, как это делают большинство людей на стандартных веб-страницах.
• Люди используют жесты пальцев для манипулирования страницей вместо мыши (кнопки / ссылки должны быть больше)
• Они могут включать в себя дополнительные функции, такие как географическое местоположение, телефон и т. Д., Которые вы можете включить в свое приложение, чтобы их было проще использовать. Есть несколько библиотек, которые помогут вам использовать их, например jQuery Mobile .
• Пользователи обеспокоены временем автономной работы, плюс ЦП имеет тенденцию работать медленнее. Убедитесь, что анимации и обработка на стороне клиента сведены к минимуму.
• Пользователи обеспокоены использованием данных. Минимум вызовов ajax (не запрашивайте данные у сервера каждые несколько секунд!) И экономное использование графики (лучше использовать html / CSS, чтобы сделать страницу привлекательной).
• Flash не поддерживается на iPhone и не поддерживается на других устройствах. Однако большинство мобильных устройств имеют приличную поддержку HTML5, поэтому вы можете использовать ее вместо этого.

Answer 2

Пользователи на смартфонах используют другой опыт.

В дополнение к ответу Брайана я бы добавил:

• Размеры экранов не изменяются, но прокручиваются, однако прокрутка сторон обычно не выполняется.хороший опыт
• Ориентация экранов может измениться, но применяются те же правила прокрутки
• Потребители используют поведение, подобное поведению приложений, и, как таковое, меньше информации с перемоткой вперед и назад между страницами является обычным явлением и между сайтами
• Потребители обычно имеют проблемы с данными, поэтому необходимо минимизировать трафик данных
• Элементы управления / кнопки / выборки / ввод данных должны быть оптимизированы для жестов рук - например, подумайте, что происходит с всплывающей клавиатурой, чтобы позволитьВвод данных, сколько экрана доступно - могут ли они легко увидеть все свои данные, если это необходимо?

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

Answer 3

Создание контекста для мобильного сайта: есть ли подмножество информации, которая более актуальна для ваших мобильных пользователей?Может быть, на вашем обычном сайте есть приложения, которые не имеют отношения к мобильным устройствам?В любом случае, вы должны создать свой мобильный сайт отдельно в мобильной папке!Затем вы можете использовать субдомен для доступа к нему: например, http://m.mysite.com

. Вы можете использовать комбинацию CSS Media Queries и 51degrees.Mobi для обнаружения функций браузера и отображения правильного размера в зависимости от того, какойтип устройства, которое есть у пользователя.

http://html5boilerplate.com/

http://www.modernizr.com/ (включено в составную часть HTM5)

http://51degrees.codeplex.com/

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

Answer 4

Недавно мы разработали сайт для пользователей iphone, мы используем asp.net/sql для обычного сайта.Но когда вы смотрите на мобильные сайты, у мобильных устройств обычно есть небольшие экраны и некоторые проблемы с оптимизацией времени.

Мы используем jqtouch для разработки мобильных приложений.Плагин JQuery для разработки мобильных веб-приложений на iPhone, Android, iPod Touch и других перспективных устройствах.

Обучающее видео

Начало работы

Answer 5

Боюсь, вы не можете использовать текущее asp-View для мобильных устройств, особенно для iPhone.Существует специальный набор элементов управления для разработки на iphone - componentone .

Если ваше веб-приложение основано на шаблонах MVC или MVP, перемещение будет не сложным.