Создание сайтов » Создаем мобильный сайт

Создание сайтов » Создаем мобильный сайт

Создаем мобильный сайт


Все больше и больше пользователей выходят в web с мобильных устройств и игнорировать таких клиентов  непозволительная роскошь. Перед разработчиком встает вопрос адаптирования сайта для просмотра с наладонников и смартфонов. Рассмотрим основные моменты создания мобильного сайта.

Для начала разработчику нужно определить тип мобильного устройства, с которого пользователь будет просматривать сайт. Используем атрибут media.

Атрибут media: устанавливает устройство вывода, для которого предназначена таблица стилей. Для каждого устройства — от карманного компьютера до принтера можно определить свою собственный стиль, который бы учитывал специфику устройства и подгонял под него вид веб-страницы.

<link rel=”stylesheet” href=”mobil.css” media=”handheld”>

Что необходимо изменить в стиле для мобильных устройств mobil.css:

Компоновку страниц: все колонки необходимо свести в одну; ширина колонки не более 480 точек

Удалить фоновые изображения

Удалить изображения для кнопок и навигации, заменить их текстовыми аналогами

Увеличить шрифт, сделать его более читаемым

Увеличить расстояние между объектами (display: block); для элементов, требующих нажатия добавить padding

Плавающие элементы (float) могут некорректно отображаться в мобильных устройствах. Их следует, по возможности, удалить.

Задать ссылки для номеров телефонов:

<a href=”tel: 19012372156” class=”phone-link”>(901)237 21 56</a>

(номер в ссылке должен начинаться с единицы)

Помните, что технологии и стандарты мобильных устройств и браузеров непрерывно изменяются, посему данная статья имеет срок годности :)

Write a comment

  • Required fields are marked with *.

If you have trouble reading the code, click on the code itself to generate a new random code.
 

© 2010-2012. Перепечатка материалов только со ссылкой на it-folio.ru
Сайт находится под управлением CMS MODx