Как сделать PDA версию сайта (для смартфона, комуникатора, КПК)

Originally published at Записки веб. разработчика e64f. You can comment here or there.

Сейчас потихоньку настают времена, когда многие обзаводятся карманными средствами интернет связи, ведь удобно иметь почту в кармане да еще и браузер.

Так вот насчет браузеров, вернее о сайте (PDA) оптимизированном  для карманного девайса сейчас и поведу речь. Хм. в принципе обычные сайты, почти нормально просматриваются в карманном устройстве, особенно после того как я установил опцию резать страничку на 3 полосы и показывать в 1 столбец, результатом этого стало то, что исчезла необходимость в горизонтальной прокрутке. Так вот отличия по пунктам, которые повысят комфорт.

1) Разрешение экрана у мобильных устройств гораздо меньше, чем у настольного монитора обычно 320 х 240

Из этого следует что …

- картинки должны быть по ширине не больше 240 px

- трехколоночная и даже двух колоночная верстка шаблона страницы не нужна. Долой табличную вестку!

- вестку на DIV -ах тоже долой

- элементы форм ввода должны тоже вписываться в размер экрана, горизонтальная прокрутка это просто ужас

- а как же верстать? да очень просто: Текст, картинка(лучше кстати совсем без картинок, в крайнем случае логотип и все), ссылки - все это с использованием тегов: p, br, h1-h6, a, img, b, i. Никто не запрещает использовать стили и javascript, а оно надо?

2) Кстати насчет javascript, на PDA устройстве никогда не возникнет событие повешенное на наведение курсора на объект

- потому, что  курсора то нету, есть стилус который позиционируется не касаясь экрана, а прикосновение к экрану это уже onclick

 3) Еще насчет javascript, сдается мне не все js-коды  прекрасно работающие  на ПК будут работать на PDA

- где бы раздобыть список работающего хотя бы для пэдэашных IE и Opera?

- есть ведь еще много экзотических браузеров, которые вообще не поддерживают javascript

В последних строках поста отсылаю к статье на буржуйском языке

Make your site mobile friendly 

http://www.thinkvitamin.com/features/css/make-your-site-mobile-friendly