Проблемы с дизайном Mobile Safari/iPhone Mail.app: предотвращение автозапуска и стилизации авто-ссылок (даты, адреса и т.д.).

Я пытаюсь создать HTML-письмо, которое также должно выглядеть хорошо, когда оно читается на мобильных устройствах. Мои самые большие проблемы связаны с iPhone (iOS 4): в большинстве случаев недокументированная функция "автосвязывания" меня очень беспокоит.

Кажется, что Autolinking появляется на

  • номера телефонов (это единственная зарегистрированная функция, так как объясняется здесь)
  • адрес
  • даты

Есть ли какая-либо документация о том, как

  • отключить автоматическую привязку для дат и адресов
  • "исправить" автозапуск через микроформаты или что-то подобное (поэтому результаты лучше, чем на самом деле с iOS 4)

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

ОТВЕТЫ

Ответ 2

Я действительно придумал трюк, чтобы сделать это. Это довольно ужасно, но это работает. Вы можете прочитать мой пост об этом в http://commondream.net/post/8933806735/avoiding-data-detectors-in-ioss-mail-app, но общий смысл заключается в том, что детекторы данных не будут связывать контент, который уже является ссылкой в HTML-письма, поэтому вы можете сделать что-то вроде:

<span>Tuesday</span>

в

<a href="#tuesday" id="tuesday" 
    style="color: #000; text-decoration: none;">Tuesday</a>

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

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

Ответ 3

Для дат и адресов вы можете нарушить сопоставление шаблонов распознавания данных, вставив, например, объект с нулевой шириной. Например,

M&#x200b;arch 30, 2013

Протестировано в iOS Mail 4.3 и 6.0.

Ответ 4

<a href="#" style="color: #666666; text-decoration: none;pointer-events: none;">Boca Raton, FL 33487</a>

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

Это идеально подходит для электронных писем HTML на ios и в браузере.

Ответ 5

Мы столкнулись с этой проблемой. Чтобы отключить обнаружение формата адресов в Safari в iOS, мы завернули наш адрес в тег <a> без атрибута href и с атрибутом style, определяющим цвет, который мы хотели бы это сделать:

<a style="color: #c0c0c0;">Square, Inc., 901 Mission Street, San Francisco, CA 94103</a>

Результат по-прежнему доступен для кликов в iOS Safari, но отображается в желаемом цвете.

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

Ответ 6

Я не думаю, что вы можете отключить автоматическую привязку для адресов и дат, например, по номерам телефонов, по крайней мере, это не в официальной документации Apple, Ссылка HTML Safari.

Взлом, чтобы попытаться предотвратить автоматическую привязку, заключается в использовании некоторых избыточных тегов в контенте. Например, вместо записи <div>+61 3 777 8888</div> вы можете сделать что-то вроде <div><foo>+61 3 777</foo> 8888</div>. Он не очень элегантный, но он может достичь того, чего вы хотите.

Ответ 7

Если вам это удастся, включение в одинарные кавычки приведет к отключению автоматической привязки. Это также работает для темы, где вы не можете использовать трюки HTML.

Ответ 8

Я использую это решение для автоматических ссылок, которые нужно стилизовать

<span class="applelinksWhite">or call 1-666-12<span>3-456</span>7</span>

Затем я добавляю это в свой тег стиля. Я использую его в теле, так как некоторые клиенты снимают его с головы.

.applelinksWhite a {color:#ffffff !important; text-decoration:none;}

Таким образом, диапазон applelinks охватывает автоматическую привязку устройств ios, и я бросаю основной промежуток в середине текстовой строки, чтобы сбросить других клиентов, таких как gmail. Протестировано в Litmus и работает через борт.

Это работает для любых типов ссылок.

Ответ 9

Создание тега ссылки <a>, который ничего не делает, по-видимому, является лучшим вариантом для даты и адреса:

<a href="javascript: void(0)" style="cursor:text; text-decoration:none; color:#333333;">July 18, 2014</a>

Вы можете использовать

<meta name="format-detection" content="telephone=no">

для телефонных номеров ТОЛЬКО, и он отключит телефонные ссылки для всех; Возможно, это не то, что вы хотите сделать.

Если вы не используете этот метатег, вы можете использовать стиль CSS для изменения цвета ссылки. и используйте код выше (тег <a>) для номеров телефонов, которые вы не хотите связывать.