Tipps für Darstellungsprobleme unter iOS 10

Gerade haben wir unsere Newsletter-Schablonen für hochauflösende Bildschirme optimiert, da tauchen mit dem Release von iOS 10 die nächsten Probleme auf. Newsletter werden auf dem iPhone plötzlich auf Bildschirmhöhe verkleinert. Oder die mobile Version hat einen kleinen Rand, der im Design gar nicht vorgesehen ist. Yvonne Perdelwitz von postina.net mit Tipps, wie man Darstellungsprobleme auf dem iPhone nach dem Release von iOS10 ohne viel Aufwand umschiffen kann.

iOS 10Kaum hat man alle Templates auf Vordermann gebracht, steht die nächste Herausforderung an. Mit dem Release von iOS 10 hat Apple Mitte September dem neuen Betriebssystem einige Autojustierungseigenschaften mitgegeben, die so manchen Newsletter „alt“ aussehen lassen.

Mailings werden plötzlich auf Bildschirmhöhe verkleinert und dadurch natürlich komplett unleserlich. Abhilfe schafft es, im Head der E-Mail viewport mit viewport auszutauschen.

Danach bleibt noch das Problem, dass in der mobilen Version einiger Mailings plötzlich ein Rand neben dem Newsletter angezeigt wird (padding), der so nicht im Ursprungsdesign vorgesehen ist. Hier hilft es, im HTML- und Body-Tag ein padding:0 zu setzen und gleichzeitig die media classes prozentual abzubilden, also z.B. table[class=“320″] {width: 100% !important;} statt {width: 320px !important;}.

Auch Apple hat mittlerweile reagiert. So empfiehlt der Apple Mail Entwickler James Magahern das auto-scaling mit folgendem Befehl apple metakomplett zu deaktivieren.

Mehr zum Thema:
litmus.com/blog/9-things-you-need-to-know-about-email-in-ios-10
github.com/hteumeuleu/email-bugs/issues/18#issue-161415347

Wir halten Sie bei neuen Entwicklungen im E-Mail und Online Marketing mit Artikeln in unserer Fachwissen-Rubrik auf dem Laufenden.

Der RSS-Feed für Kommentare zu diesem Artikel. Die TrackBack URI dieses Artikel.

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.