Mobile Safari / iPhone Mail.app Probleme beim HTML-Design: Automatisches Verknüpfen und Formatieren von automatischen Links (Daten, Adressen usw.) verhindern

ich versuche mit der Gestaltung einer HTML-e-mail, dass sollte auch gut Aussehen, wenn es gelesen wird, die auf mobilen Geräten. Meine größten Probleme mit dem iPhone (iOS 4): seine meist Undokumentiert "automatisch verknüpfen" - Funktion wirklich nervt mich.

Autolinking scheint auf

  • Telefonnummern (dies ist der einzige dokumentierte Funktion, als hier erklärt)
  • Adressen
  • Termine

Gibt es eine Dokumentation gibt es, wie

  1. deaktivieren Sie die automatische Verlinkung für Termine und Adressen
  2. "richtig" autolinking über microformats oder etwas ähnliches (also, die Ergebnisse sind besser, als Sie tatsächlich sind mit iOS 4).

Alle Informationen, Tipps oder Hinweise wirklich dankbar, da scheint es nicht zu sein, irgendwelche Informationen zu löschen.

Kommentar zu dem Problem
nach einigen Forschung scheint es, dass diese automatische Erkennung geht so weit zurück wie 1998, wo "apple-Daten-Detektoren" hingewiesen: bit.ly/hmMsAw Kommentarautor: z3cko

InformationsquelleAutor der Frage z3cko | 2011-03-10

  1. 14

    Wurde diese Frage antwortete eine lange Weile zurück in diesem thread Zum deaktivieren der Telefonnummer Verknüpfung in Mobile Safari? aber noch einmal wiederholen, für alle anderen SEO-Besucher wie mich....

    ...nach dem Safari Web
    Content Guide für iPhone    :

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

    InformationsquelleAutor der Antwort Terri Ann

  2. 9

    Ich tatsächlich herausgefunden, trick, dies zu tun. Es ist ziemlich schrecklich, aber es funktioniert. Lesen Sie meinen Beitrag über http://commondream.net/post/8933806735/avoiding-data-detectors-in-ioss-mail-app, aber die Allgemeine Kern ist, dass die Daten-Detektoren nicht zu verknüpfen Inhalte, die bereits einen link in HTML-E-Mails, so kann man wiederum so etwas wie:

    <span>Tuesday</span>

    in:

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

    Es ist schrecklich-code, aber es hält die Daten der Detektoren geschieht mit nur ein paar Nachteile, nämlich hässlich markup und die E-mail-client scrollen zu diesem Punkt, wenn Sie darauf klicken.

    Alle gesagt, finde ich es ziemlich beschränkt, wenn Sie verhindern soll, dass Daten-Detektoren. Ich hatte eine E-Mail aufgeführt, die Wettervorhersagen von Tag der Woche, und fühlte sich wie kein user würde jemals wollen, um zu markieren, dass Sie Ihre Daten in Ihrem Kalender, aber ich würde sagen, Sie sollten nicht deaktivieren Sie die Detektoren, wenn Sie jemals denken, dass Sie könnte tatsächlich nützlich sein.

    InformationsquelleAutor der Antwort commondream

  3. 9

    Für Daten & Adressen, die Sie stören könnten die Daten recognition pattern-matching durch einfügen z.B. einer null-Breite Einheit. E. g., 

    M&#x200b;arch 30, 2013

    Getestet auf iOS-Mail-4.3 und 6.0.

    InformationsquelleAutor der Antwort tribalvibes

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

    Ändern Sie die Farbe, was passt zu Ihrem text, text Dekoration entfernt die Unterstreichung, pointer-events hält es aus betrachtet wird, wie ein link in einem browser

    Dies ist perfekt für HTML-E-Mails auf ios und browser.

    InformationsquelleAutor der Antwort Vincent Tobiaz

  5. 6

    Liefen wir in dieser Ausgabe ebenso. Damit deaktivieren Sie die Formaterkennung von Adressen in Safari auf iOS, wir gewickelt, unsere Adresse in eine <a> tag ohne href - Attribut, und mit einer style Attribut definieren Sie die Farbe, die wir wollten, es zu werden:

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

    Das Ergebnis ist immer noch anklickbar in iOS Safari, aber gerendert wird in die Farbe, die wir uns gewünscht haben.

    In anderen Browsern der link ist nicht anklickbar und da die inline-style-Farbe war die gleiche wie die vorhandenen Texte, hat es nicht anders Aussehen, die den umgebenden text.

    InformationsquelleAutor der Antwort Beau Smith

  6. 3

    Ich glaube nicht, können Sie deaktivieren Sie die automatische Verlinkung für Adressen und Termine, wie Sie auch mit Telefon-Nummern, zumindest ist es nicht in apples offizielle Dokumentation, die Safari HTML Reference.

    Einen hack, um zu versuchen, um zu verhindern, dass die automatische Verknüpfung ist die Nutzung von einigen überflüssigen tags in den Inhalt. Zum Beispiel, anstatt zu schreiben <div>+61 3 777 8888</div> Sie konnte etwas tun, wie <div><foo>+61 3 777</foo> 8888</div>. Es ist nicht sehr elegant, aber es könnte erreichen, was Sie wollen.

    InformationsquelleAutor der Antwort William Niu

  7. 2

    Wenn Sie können mit ihm Weg erhalten, umschließt in single quotes deaktivieren Sie die automatische-Verknüpfung. Dies funktioniert auch für die Betreff-Zeile, wo Sie nicht verwenden können HTML-tricks.

    InformationsquelleAutor der Antwort brainjam

  8. 2

    Ich diese Lösung für auto-links, die müssen gestylt werden

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

    Dann füge ich dies zu meinem Stil-Tags. Ich benutze es in den Körper, da einige clients strip es aus dem Kopf.

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

    Also die applelinks Spanne deckt die ios-Geräte automatisch verknüpfen, und ich werfe in einem grundlegenden Bereich in der Mitte der text-string zu werfen, die Weg von anderen clients, wie gmail. Getestet in Lackmus und arbeitet auf der ganzen Linie.

    Dies funktioniert für jede Art von auto-links.

    InformationsquelleAutor der Antwort zazzyzeph

  9. 2

    Erstellen <a> link-tag, dass nicht alles, was scheint zu sein die beste option für das Datum und die Adresse mindestens:

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

    Können Sie

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

    für Telefonnummern NUR und es wird deaktivieren Sie die Telefon-links für alle; Dies kann nicht das, was Sie tun möchten.

    Wenn Sie nicht dieses meta-tag, können Sie den style mit CSS zu ändern, der link Farbe, wie gewünscht. und verwenden obige code (<a> tag) für Rufnummern, die Sie nicht verknüpfen möchten.

    InformationsquelleAutor der Antwort CodeOverRide

Schreibe einen Kommentar