drmedolav: Problem mit Tabelle in eMail Signatur (Outlook 2016)

Hallo, ich bastle seit einiger Zeit an einer Signatur für einen Freund. Leider ist die Darstellung der Signatur beim Empfänger minimal bis total anders.

Ausgangslage: Ich habe von dem Freund tolle Bilder für die Signatur bekommen. Da dieser darin Links (Homepage und Facebook) sowie „mailto“ und „tel“ verwenden will dachte ich mir ich schneide das Bild auseinander und erstelle dann eine Tabelle, wo ich die Weiterleitungen angeben kann.

Ich habe Photoshop benutzt um das Bild zu zerlegen. Photoshop selber bietet ja mit der Export-Funktion auch den Export zu HTML an. Dies habe ich dann auch gemacht und er spuckt mir einen tolle Tabelle mit den Bildern aus. Ich habe noch die Schriftart und Zeilenhöhe für das geschriebene festgelegt und gespeichert. Im Kompozer sieht das ganze recht hübsch aus. Auch im Browser (Firefox, Edge und IE11) ist die Darstellung so wie gewünscht. Sobald ich aber eine E-Mail verschicke (Outlook 2016) ändert sich die Darstellung und ich das ist eher nicht gewollt. Im Mail-Programm von Windows 10 habe ich einen kleinen weißen Steifen (Bild 1). Schaue ich mir die E-Mail online an, dann hackt er mir die ganze Tabelle auseinander (Bild 2). Am Handy wird mir die E-Mail tadellos angezeigt.

Nun meine Frage an euch: Hab ich in meinem HTML-File irgendwas ausgelassen? Etwas eingebaut, womit Outlook nicht zurechtkommt?

Ich bedanke mich schon mal im Voraus für die hoffentlich zahlreichen Antworten.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><title>SignaturChristian</title>



<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head><body leftmargin="0" topmargin="0" bgcolor="#ffffff" marginheight="0" marginwidth="0">

<table id="Tabelle_01" border="0" cellpadding="0" cellspacing="0" height="250" width="626">
	<tbody><tr>
		<td colspan="2" rowspan="1" height="0" nowrap="nowrap" width="262">
      <p style="margin: 0px; padding: 0px; font-family: Calibri; line-height: 80%;"><br><br>
Mit freundlichen Grüßen<br></p>
</td>
		
		<td height="0" width="0"><br>
</td>
	</tr>
	<tr>
		<td colspan="2" height="115" width="626">
			<img src="images/SignaturChristian_01.jpg" alt="" height="115" width="626"></td>
		<td height="115" nowrap="nowrap" width="0"><br>
</td>
	</tr>
	<tr>
		<td rowspan="4" height="135" width="262">
			<img src="images/SignaturChristian_02.jpg" alt="" height="135" width="262"></td>
		<td height="40" width="364">
			<img src="images/SignaturChristian_03.jpg" alt="" height="40" width="364"></td>
		<td height="40" nowrap="nowrap" width="0"><br>
</td>
	</tr>
	<tr>
		<td height="26" width="364">
			<img src="images/SignaturChristian_04.jpg" alt="" height="26" width="364"></td>
		<td height="26" nowrap="nowrap" width="0"><br>
</td>
	</tr>
	<tr>
		<td height="26" width="364">
			<img src="images/SignaturChristian_05.jpg" alt="" height="26" width="364"></td>
		<td height="26" nowrap="nowrap" width="0"><br>
</td>
	</tr>
	<tr>
		<td height="43" width="364">
			<img src="images/SignaturChristian_06.jpg" alt="" height="43" width="364"></td>
		<td height="43" nowrap="nowrap" width="0"><br>
</td>
	</tr>
</tbody></table>
<br>

</body>
</html>![Bild 2](https://1drv.ms/i/s!Apu1PoauTsuYjuQyRc7Tsb1VR_d6ZQ "Bild 2")
![Bild 1](https://1drv.ms/i/s!Apu1PoauTsuYjuQzX9cyMg8MRvkq_g "Bild 1")
  1. @@drmedolav

    Da dieser darin Links (Homepage und Facebook) sowie „mailto“ und „tel“ verwenden will dachte ich mir ich schneide das Bild auseinander und erstelle dann eine Tabelle, wo ich die Weiterleitungen angeben kann.

    Warum das denn? Können Mailclients nicht mit verweissensitiven Grafiken umgehen?

    LLAP 🖖

    --
    “The best way to help people learn: answer their coding question an hour later, they’ll have likely figured it out by then.” —Todd Motto
    Selfcode: sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|
    1. Warum das denn? Können Mailclients nicht mit verweissensitiven Grafiken umgehen?

      Du scheinst keine Idee zu haben, was (manche) Mailclients alles nicht können. Sei froh drum! A pain in the a..

    2. Hab ich auch schon versucht. Leider übernimmt Outlook den Imagemap Code nicht.

      Warum das denn? Können Mailclients nicht mit verweissensitiven Grafiken umgehen?

    3. Hallo Gunnar,

      Warum das denn? Können Mailclients nicht mit verweissensitiven Grafiken umgehen?

      Bruhahaha. You made me laugh.

      Wenn im allgemeinen angenommen wird, dass HTML & CSS für Browser ein komplexes Problem ist, dann gilt das für Mail-Clients ungefähr tausend mal mehr.

      GMail z.B. findet es lustig, alle <style> und <script>-Blöcke sowie <link rel="stylesheet"> zu entfernen. Das mit den Scripts verstehe ich ja sogar, aber ersteres führt dazu, dass man in E-Mails nur Inline-Styles in style-Attributen verwenden kann.

      Die Probleme, die mit HTML in E-Mails auftreten, sind vielfältig und… spannend.

      LG,
      CK

      1. @@Christian Kruse

        Die Probleme, die mit HTML in E-Mails auftreten, sind vielfältig

        Ich habe Mark Robbins in Bologna wieder ein Lied davon singen hören – wie letztes Jahr schon in Warschau. Sehenswerter Talk.

        und… spannend.

        Naja, die Spannung liegt im Auge des Betrachters.

        Ich finde es spannender, willige Clients (Browser) von etwas zu überzeugen als unwillige (E-Mail-Clients) zu etwas zu überreden.

        LLAP 🖖

        --
        “The best way to help people learn: answer their coding question an hour later, they’ll have likely figured it out by then.” —Todd Motto
        Selfcode: sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|
        1. Hallo Gunnar,

          und… spannend.

          Naja, die Spannung liegt im Auge des Betrachters.

          Ich finde es spannender, willige Clients (Browser) von etwas zu überzeugen als unwillige (E-Mail-Clients) zu etwas zu überreden.

          Du musst deinen Ironie-Detektor nachjustieren ;-)

          LG,
          CK

          1. @@Christian Kruse

            Du musst deinen Ironie-Detektor nachjustieren ;-)

            :-)

            Es gibt aber Leute wie Mark, die das wirklich spannend finden. Und es ist – ganz ohne Ironie – wirklich spannend, ihm zuzuhören, wie er darüber erzählt.

            LLAP 🖖

            --
            “The best way to help people learn: answer their coding question an hour later, they’ll have likely figured it out by then.” —Todd Motto
            Selfcode: sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|
            1. Hallo Gunnar,

              Es gibt aber Leute wie Mark, die das wirklich spannend finden.

              Klar, es gibt ja auch train und plane spotter. Interesse entwickeln die Leute an den absurdesten Dingen ;-)

              Und es ist – ganz ohne Ironie – wirklich spannend, ihm zuzuhören, wie er darüber erzählt.

              Glaub ich sofort, das gilt ja für so einige Leute. Wenn jemand mit Leidenschaft und/oder Witz über ein Thema referieren kann, dann hört man gerne zu. Das heisst aber nicht, dass ich das Thema ansich spannend oder gar erbaulich finden muss :-)

              LG,
              CK

  2. ich bastle seit einiger Zeit an einer Signatur für einen Freund. Leider ist die Darstellung der Signatur beim Empfänger minimal bis total anders.

    Willkommen in der Hölle. Grundsätzlich ist die Strategie mit Tabellenlayouts und Inline-Styles hierfür schon gut - abseits Mail natürlich nicht.

    Erster Schritt: schau Dir in den Mailclients den Quelltext der Mail an, soweit der Client das hergibt. Auf dem Transportweg können schon eine Menge Überraschungen passieren.