Retina-Display-E-Mail-Signatur

Unser Unternehmen verwendet Gmail als E-Mail-Client, daher bestehen unsere Signaturen aus Text, der im Texteditor bearbeitet werden kann, und Bildern, die auf unserem Server gehostet werden müssen.

CSS ist keine Option.

Irgendeine Idee, wie ich verhindern kann, dass meine E-Mail-Symbole verschwommen angezeigt werden?

Warum ist (Inline-) CSS keine Option?
"CSS ist keine Option." = dann können Sie die Netzhaut nicht direkt anvisieren.
Ich bin mir nicht sicher, warum Sie (Joe Isaacson) sagen, dass Inline-CSS keine Option ist. Ich verwende Google Mail für die Arbeit und für den privaten Gebrauch und beide erlauben HTML und Inline-CSS.
Brauchst du es wirklich? Ich und viele andere, die ich kenne, verwenden nur reine Text-E-Mails. Jede HTML-E-Mail ist zu 99 % Spam. Im Klartext ist jede Bildsignatur nur ein lästiger Anhang.
Sie können dies einfach nicht tun, damit es überall funktioniert. E-Mail-Clients sind scheiße.

Antworten (4)

Verwenden Sie SVG-Bilder.

http://en.wikipedia.org/wiki/Scalable_Vector_Graphics

Bemerkenswert: SVG wird in älteren Versionen von IE (8 und früher) nicht unterstützt. Ich bin mir auch nicht sicher, wie es in beschisseneren E-Mail-Clients gerendert wird.

Vielleicht SVG mit PNG-Fallback, weil alles mit einem Retina-Display wahrscheinlich SVG anzeigen kann.

Eine weitere Option: Verwenden Sie kein Bild in der E-Mail-Signatur. Warum ist es eine Anforderung?

HTML-E-Mails sind eine Hölle auf Erden, die meisten E-Mail-Clients verwenden nicht einmal CSS-Floats oder Hintergrundbilder ... Hier ist ein SVG-Test eines Mannes in HTML-E-Mails (folgen Sie dem Link und klicken Sie dann durch die Pfeile). Es funktionierte nur in Thunderbird, Apple Stuff und Android 4.0 - funktionierte in nichts anderem.
Leider funktioniert SVG nicht mehr in Google Mail , da sie einen Transcoding-Proxy implementiert haben.

Damit ein Bild auf dem Desktop oder in der Retina gleich wiedergegeben wird, müssen Sie dieses Bild in doppelter Größe speichern. Und dafür müssen Sie css verwenden .

Wenn Ihr also 50 x 100 Pixel groß ist, müssen Sie 100 x 200 Pixel haben und Folgendes verwenden:

<img src="icon_blog_100x200.png" style="width:50px; height:100px;" />

Da das Bild aber immer noch verpixelt, wenn der Benutzer zoomt, sollten Sie es wahrscheinlich in doppelter oder dreifacher Größe speichern.

Ja, beim Erstellen von Signaturen mit Google Mail ist Inline-CSS keine Option. Wenn es irgendeine Art von Problemumgehung gibt, lassen Sie es mich bitte wissen.
@JoeIsaacson Sie können Gmail-HTML-Signaturen ( Video ) erstellen. Haben Sie auch diese SO-Frage gesehen ? Überprüfen Sie die erste Antwort.

Verwenden Sie ein Bild in doppelter Größe und verkleinern Sie es im Bild-Tag. dh für ein Logo-GIF mit 200 x 100 Pixel verwenden Sie:

<img src="logo.gif" width="100" height="50">

Der einzige Nachteil ist, dass Nicht-Retina-Benutzer eine größere Datei herunterladen, als sie benötigen.

Folgen Sie Geoff Grahams Anleitung zur SVG-Unterstützung in HTML-E-Mails.
https://css-tricks.com/a-guide-on-svg-support-in-email/

Es erklärt die Verwendung eines SVG (das unter OS X/iOS sowie an vielen anderen Stellen scharf wiedergegeben wird) und eines Fallback-Bildes für E-Mails. Wir haben dies in unsere E-Mail-Signatur übernommen und es war auf ganzer Linie erfolgreich.

Er beschreibt die Verwendung eines SVG und eines Fallbacks

<!-- Image: SVG --> <img class="showy" width="0" height="0" src="my-image.svg"> <!-- Image: JPG --> <img class="no-showy" src="my-image.jpg">

Kombiniert mit dem folgenden CSS

/* Ändere die Größe eines Elements, das eine Breite und Höhe von Null hat, auf volle Größe */
.auffällig {
  Höhe: 100% !Wichtig;
  Breite: 100% !Wichtig;
}

/* Verstecke dies überall, außer für diejenigen, die diesen Code nicht lesen können */
.no-auffällig {
  Anzeige: keine;
}
Können Sie bitte in Ihren eigenen Worten hinzufügen, was zu tun ist? Angenommen, der angegebene Link ist defekt, dann ist Ihre Nur-Link-Antwort nutzlos. Willkommen bei GD.SE!
Retina-Display-E-Mail-Signatur
AntwortenHierDatenschutz-Bestimmungen1y, 0v