Планирование и создание мобильного сайта для вашего основного сайта [закрыто]

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

Просматривая некоторые примеры мобильных сайтов, мы заметили, что многие сайты, в которых есть WAP, являются просто упрощенными HTML-файлами. http://wap.mlb.com на самом деле не с поддержкой WAP, а простым HTML.

У меня вопрос, WAP думать о прошлом? Если у смартфонов и iPhone есть возможность отображать сайты как есть, нужно ли нам беспокоиться о WML и WAP или будет достаточно урезанной html-версии?

Также вы можете порекомендовать блог или учебник или ответ ниже, как лучше всего проверить наличие мобильных устройств? Нужно ли нам как программисту знать каждый вариант пользовательского агента, чтобы перенаправить его на наш мобильный сайт?

Наконец, вы бы запрограммировали мобильный сайт для браузера iPhone / Touch Safari или просто оставили сайт как есть?

13.08.2008 03:23:55
8 ОТВЕТОВ
РЕШЕНИЕ

Более новые телефоны поставляются с WAP2, который использует HTML Mobile Profile (XHTML MP), который очень похож на обычный HTML. В старых телефонах используется язык беспроводной разметки (WML).

В зависимости от вашей аудитории, я хотел бы рассмотреть возможность создания версии сайта, удобной для мобильных телефонов, с использованием XHTML MP и полностью отказаться от WML. Под мобильным телефоном я понимаю легкую графику, немного JavaScript и простую навигацию.

Чтобы проверить возможности различных ручных телефонов, взгляните на WURFL .

Кроме того, вы можете ознакомиться с рекомендациями по мобильному вебу от w3c.

4
28.08.2008 07:39:01

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

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

Таким образом, конечный вопрос будет о целевом рынке. Вы нацелены на технически подкованную аудиторию, которая, как правило, будет иметь телефоны с полной поддержкой 3G? Вы нацеливаетесь на людей, у которых максимум 2,5G?

0
13.08.2008 03:56:13

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

Несмотря на то, что WAP получает много негативных отзывов, его сила в том, что у вас низкоскоростные соединения с высокой задержкой. Контент WML оптимизируется шлюзом оператора, что значительно сокращает объем передаваемых данных. Если у вас есть айфоны и т. П., В областях с хорошим покрытием 3G вы можете позволить себе более богатый контент, но если вы хотите, чтобы приложение по-прежнему работало хорошо в более труднодоступных местах, WAP имеет большое преимущество.

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

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

Если вы занимаетесь разработкой WAP, ознакомьтесь с WinWAP - браузером WAP на базе Windows.

0
13.08.2008 22:11:55

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

1
18.08.2008 11:28:26

Если вы хотите потратить очень небольшую сумму денег, вы можете найти использованную копию моей книги «Руководство разработчика веб-приложений для Palm OS» на Amazon менее чем за 1 доллар. Хотя конкретные советы о старых устройствах Palm VII больше не применяются, есть несколько разделов, посвященных созданию мобильных веб-сайтов, которые все еще могут применяться. Мой основной совет таков: сначала делайте страницы маленькими с соответствующей информацией, а затем навигационными ссылками; подтолкнуть общий / шаблонный контент на другие страницы; попытаться оптимизировать, чтобы сократить количество времени, которое пользователь проводит на одной странице; и избегайте загрузки большого количества объектов (изображений, файлов JavaScript) для страницы, чтобы уменьшить задержку.

0
18.08.2008 19:59:09

Вот две вещи, которые вы можете сделать, чтобы улучшить поддержку iPhone без особой работы:

Сделайте прокрутку страницы вверх, чтобы скрыть строку URL:

<script type="application/x-javascript">

  if (navigator.userAgent.indexOf('iPhone') != -1) {
    addEventListener("load", function() {
      setTimeout(hideURLbar, 0);
    }, false);
  }

  function hideURLbar() {
    window.scrollTo(0, 1);
  }

</script>

И установите масштабирование для ширины страницы (лучше всего провести тестирование и поиграть с этим, также ищите другие примеры, которые могут использовать user-scalable=true):

<meta name="viewport" content="width=320; user-scalable=false" />
3
30.11.2016 10:48:03

Код: Заставляет валидатор w3 возвращать 11 ошибок, когда я его использую. Вот страница индекса, на которой она была опробована: Вы не будете использовать несколько строк, которые не будут использоваться. Это шаблоны строк.

<!DOCTYPE HTML>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Photography Aerial Commercial Portrait Underwater Wedding Tom Szabo</title>
<meta name="description" content="A Thomas Image professional photography serving Cleveland
Northeast Ohio Chagrin Falls Chardon Kirtland Madison Mentor Painesville Perry and Willoughby">
<meta name="keywords" content="A Thomas Image, professional, photography, cleveland, northeast ohio, chagrin falls, chardon, concord, kirtland, madison, mentor, painesville, perry, willoughby,commercial, marketing, advertising, executive, head shot, portrait, baby, children, family, high school senior, family reunion, underwater, scuba diving, pool party, wedding, bride, groom,">
<meta name="y_key" content="7b00158550200c1c">
<meta name="y_key" content="b5a3e0c1d778ff8a">
<meta name="msvalidate.01" content="7C6C4CEC2EB84051B1DCFEC558B77724" />
<meta name="verify-v1" content="G4nmk0aesZsCjneBo0W6kVlv5NpImVnTfsQ+fXEk1fA=" />
<meta name="viewport" content=”width=320,user-scalable=false”>
0
28.03.2013 17:14:32

На данный момент (2014)

Мы , возможно , не потребуется отдельный сайт для мобильных устройств , вместо этого мы можем пойти на интерфейсными как найти библиотеки Twitter Bootstrap , который использует адаптивный рендеринг таким образом , что сайт подстраивается под размер экрана , будь то Tablet или мобильного устройства или рабочего стола

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

Чтобы узнать больше о Twitter Bootstrap, нажмите здесь

1
17.03.2014 07:37:21