Сайт под iPhone

mobile-friendly2

В последние годы мобильные версии сайтов, которые отображаются на iPhone, становятся все популярнее. Даже на обычные сайты теперь заходят с мобильных устройств чаще, чем когда-либо. Если вы не создаете сайт специально под iPhone, несколько простых действий помогут вам учесть интересы пользователей, посещающих его именно через это устройство.

Несколько советов, которыe помогут адаптировать сайт под iPhone

Для начала стоит измерить расстояние между кнопками меню, благодаря которым осуществляется навигация на сайте; если расстояние слишком мало – тем, кто пользуется устройствами с сенсорным дисплеем будет неудобно. Указательный палец соответствует примерно 40-70 пикселям в ширину – это нужно учитывать, выбирая размер для кнопок и расстояние между ними.

Браузер Mobile Safari позволяет увеличивать и поворачивать страницу, чтобы рассмотреть весь контент, однако вы с легкостью можете сделать сайт, на котором этого делать не придется. Например, если на главной странице вашего сайта слева и справа присутствуют поля, их увидят и посетители с iPhone; однако вы можете заставить Mobile Safari увеличить основной текст страницы автоматически. Собственно говоря, с этого и начинается адаптация сайта под iPhone.

Итак, для начала следует сделать ширину страницы соответствующей ширине мобильного устройства, вставив код

<meta name = "viewport" content = "width = device-width">

 в верхнюю часть HTML-версии страницы:

Чтобы сделать масштаб по умолчанию равным единице, введите:

<meta name = "viewport" content = "initial-scale = 1.0"> 

Чтобы задать масштаб по умолчанию и не дать пользователю возможности выбирать его самостоятельно, введите:

<meta name = "viewport" content = "initial-scale = 2.3, user-scalable = no"> 

Далее, вы можете самостоятельно назначить функции просмотра сайта с помощью следующего JavaScript:

var updateLayout = function() { if (window.innerWidth != currentWidth) { currentWidth = window.innerWidth;

var orient = (currentWidth == 320) ? "profile" : "landscape";

document.body.setAttribute("orient", orient); window.scrollTo(0, 1); } }; iPhone.DomLoad(updateLayout); setInterval(updateLayout, 500); 

А благодаря одной строке кода JavaScript вы можете спрятать панель управления iPhone:

window.scrollTo(0, 1);

Последние шаги

В каком-то смысле сайт под iPhone – это шаг назад: многие его параметры считаются устаревшими, а скорость соединения ниже, чем у обычного стационарного компьютера. Тем не менее, если вы хотите учесть интересы пользователей с iPhone, стоит в обязательном порядке избегать картинок в слишком высоком качестве, не говоря уж о видео, музыке и прочем объемном медиа-контенте. Кроме того, крайне не рекомендуется использовать Flash.

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

Cкачайте приложение на Андроид и будьте в курсе новостей
Интернет-маркетинга всегда!

WebSEOHelp

smp-forum.ru


.
Наверх
закрыть

Консоль отладки Joomla!

Ошибки

Сессия

Результаты профилирования

Использование памяти

Запросы к базе данных