Список известных различий между «Safari на iPad» и «Safari на iPhone» - PullRequest
9 голосов
/ 17 ноября 2010

Мой сайт выглядит идеально на iPhone, но выглядит неоптимально на iPad.У меня много проблем с поиском информации о различиях между движком рендеринга webkit / safari на iPad и движком рендеринга webkit / safari на iPad.* как на iPhone, так и на iPad (обратите внимание, что вам придется нажимать «стандартный сайт» внизу страницы, если вас перенаправят на наш мобильный сайт).Основными отличиями являются отсутствующий белый фон и главное навигационное меню с вкладками в верхней части (также небольшая мини-тележка в правом верхнем углу очень далека).

iPhone (выглядит правильно): alt text

iPad (выглядит неправильно): alt text

В чем разница между рендерингом мобильного веб-набора на iPhone и iPad?

Ответы [ 2 ]

7 голосов
/ 20 ноября 2010

iPhone и iPad используют один и тот же механизм рендеринга, WebKit.

Единственными очевидными различиями между этими платформами могут быть:

  • Если размеры шрифтов на сайте указаны в пикселях,более высокое число точек на дюйм дисплея Retina может иметь некоторое влияние на масштабирование текста, но я могу ошибаться.Всегда указывайте размеры шрифта в точках.
  • Размеры экрана у обоих устройств разные.Не с точки зрения пикселей, но с точки зрения физического размера.Это то, что WebKit (или iOS в целом) пытается компенсировать, изменяя размеры шрифтов, чтобы сделать их читаемыми, оставаясь при этом на странице.Это может привести к повторному заполнению документа;вызывая разрывы строк.

В этом случае я не могу предложить ничего другого, кроме проверки макета вашей страницы.Проверка его с помощью инструментов W3C и его правильное тестирование в Simulator и, что более важно, на устройствах.

Из того, что выглядит выше, некоторые CSS-хаки (например, для работы в IE) могут иметь такой эффект, какэтот.Или случайный разрыв строки.

Как правило, вам не следует беспокоиться о различиях между этими двумя платформами или платформами в целом.Используйте чистый CSS и HTML и тестируйте его на всех целевых устройствах, пока он не будет выглядеть правильно.Старайтесь избегать использования CSS / HTML-хаков, чтобы заставить IE6 работать.Это одна из основных причин проблем из моего опыта.

Насколько я знаю, между этими устройствами нет "серьезных" отличий, за исключением их размера экрана (и, возможно, используемой версии WebKit / iOS- скажем, iOS 3.x против iOS 4.2).

Если у вас есть доступ к Xcode, попробуйте взглянуть на сайт из разных версий iOS, чтобы убедиться, что это проблема.

В любом случае.Исправьте ваш HTML и CSS.У проблемы может быть очень простая причина.

3 голосов
/ 21 ноября 2010

Ваш iPad, вероятно, работает под управлением iOS 3.2 (или бета-версии 4.2), в то время как ваш iPhone работает как минимум под iOS 4.0.Это важнее, чем различия между платформами (которых, как предполагается, не должно быть).

Я думаю, что вы ошибаетесь в поисках списка отличий, вы можете перейти к http://trac.webkit.org/ и получите исчерпывающий список исправлений и исправлений ошибок между двумя версиями, но быстрее будет просто использовать обычные методы устранения неполадок CSS (то есть в основном методом проб и ошибок), чтобы выяснить, что вызывает ваш сайтиспортить в iOS 3.2.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...