Верстка сайту для iPhone або iPad не сильно відрізняється від звичайного процесу, не скажу що вона складніше або легше, але верстальник повинен знати деякі характерні особливості. Детально з особливостями сайтів для iPhone можна ознайомитися в статті «Верстка під iPhone».
Приступимо до процесу верстки сайту для iPhone. Головне, що повинен мати розробник сайту, це можливість вільного тестування свого дітища. Складно створювати сайт для iPhone не маючи такого пристрою під рукою, але все-таки вихід є ...
Вибір емулятора для браузера iPhone (Крок 1)
Пошукавши в інтернеті різні симулятори і емулятори для мобільних пристроїв, натрапив на єдиний функціонуючий сервіс. який зміг показати сайт в тому ж вигляді, що і справжній iPhone лежить під рукою. Проте, у даного сервісу є значні недоліки, такі як відсутність можливості масштабування сайту, а також не повну відповідність браузеру Safari встановленому на мобільному пристрої iPhone.
Якщо ви ще не відкрили Наведений вище сервіс, то переходимо за цим посиланням і дивимося, як виглядає наш сайт.
Я спробував протестувати свій блог і отримав, досить несподіваний для себе варіант, тому що очікував гіршого. Верстка практично не розповзлася, за винятком підвалу сайту, чого не можна сказати про сайті замовника, який містив дуже багато елементів з правилом:
Підготовка PHP коду до тестування iPhone версії сайту (Крок 2)
Внесемо в код формування сторінки розмежування на підключення css стилів, для пристрою iPhone і для простих комп'ютерів. Це завдання можна вирішити, додавши в тег
рядок, яка підключає css файл для пристроїв з шириною екрану не більше 480 px:
