Lastig (?) E-mail probleem.

Pagina: 1
Acties:

  • Gamebuster
  • Registratie: Juli 2007
  • Laatst online: 23-10 08:50
Ik zit met het volgende probleem:

Ik wil een e-mail verzenden waarvan ik de broncode in xhtml 1.0 transitional en css 2.0 heb geschreven.
In dit script staan plaatjes waarvan de bron van internet moet komen. (Zie script)
Hoe kan ik dit script verzenden zodat de ontvanger geen script maar gewoon de plaatjes en de tekst zien zonder dat er bijlagen worden verstuurd.

ps.: Ik ben een beginner in webdesign dus wees niet te hard met je mening over mijn e-mail.
Bovendien is deze e-mail nog niet klaar en ziet er dus nog een beetje raar uit. Ga aub. niet lopen klagen of discusseren over de opmaak of de inhoud van de e-mail.

Dit is het resultaat van de 2 onderstaande scripts:
http://www.hinloopen.nl/nieuwsbrief/nieuwsbrief_10.html
Dit is het xhtml script. Het CSS script staat in een quote eronder.
Dit script wordt het beste weergegeven in Programmers Notepad 2 met tab-grote op 2 tekens.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="http://www.hinloopen.nl/nieuwsbrief/style_10_07.css" />
</head>
<body>
<img border="0" src="http://www.hinloopen.nl/nieuwsbrief/mail_logo.png" id="img_mail_logo" alt="Groepsreizen Europa"/>
<a href="http://www.hinloopen.nl/nl799.html" target="_blank"><img border="0" src="http://www.hinloopen.nl/nieuwsbrief/drenthe_100x290.png" id="img_001" alt=""/></a>
<a href="http://www.hinloopen.nl/nl799.html" target="_blank"><img border="0" src="http://www.hinloopen.nl/nieuwsbrief/drenthe_100x285.png" id="img_002" alt=""/></a>
<a href="" target="_blank"><img border="0" src="http://www.hinloopen.nl/nieuwsbrief/rursee_100x290.png" id="img_003" alt=""/></a>
<a href="" target="_blank"><img border="0" src="http://www.hinloopen.nl/nieuwsbrief/rursee_100x285.png" id="img_004" alt=""/></a>
<a href="" target="_blank"><img border="0" src="http://www.hinloopen.nl/nieuwsbrief/_100x290.png" id="img_005" alt=""/></a>
<a href="" target="_blank"><img border="0" src="http://www.hinloopen.nl/nieuwsbrief/_100x285.png" id="img_006" alt=""/></a>
<a href="" target="_blank"><img border="0" src="http://www.hinloopen.nl/nieuwsbrief/_100x290.png" id="img_007" alt=""/></a>
<a href="" target="_blank"><img border="0" src="http://www.hinloopen.nl/nieuwsbrief/_100x285.png" id="img_008" alt=""/></a>
<a href="" target="_blank"><img border="0" src="http://www.hinloopen.nl/nieuwsbrief/_100x290.png" id="img_009" alt=""/></a>
<a href="" target="_blank"><img border="0" src="http://www.hinloopen.nl/nieuwsbrief/_100x285.png" id="img_010" alt=""/></a>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_001" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_002" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_003" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_004" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_005" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_006" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_007" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_008" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_009" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_010" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_011" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_012" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_013" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_014" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_015" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_016" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_017" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_018" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_019" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_020" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_021" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_022" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_023" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_024" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_025" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_026" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_027" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_028" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_029" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_030" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_031" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_032" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_033" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_034" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_035" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_036" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_037" alt=""/>
<img src="http://www.hinloopen.nl/nieuwsbrief/blue_dot.png" id="blue_dot_037" alt=""/>
<table id="quote_001" class="title">
<tr>
<td>
Weet u nog dat u bij ons informeerde naar een groepsaccommodatie?
</td>
</tr>
</table>
<table id="quote_002" class="reg_text">
<tr>
<td>
Wij hebben het genoegen u onze eerste nieuwbrief te presenteren over ons aanbod van groepshuizen in Drenthe, Munsterland en Nederrijn.
De meeste groepshuizen liggen een uurtje rijden vanaf Utrecht. Wij hebben ook prachtige huizen in Sauerland, de Ardennen, de Eifel, Oostenrijk en Spanje.
</td>
</tr>
</table>
<table id="quote_003" class="title">
<tr>
<td>
Dwingeloo, Drenthe: 20-45 pers.
</td>
</tr>
</table>
<table id="quote_004" class="reg_text">
<tr>
<td>
Een uurtje rijden vanaf Utrecht en u bent in de rust en ruimte van natuurgebied Dwingelderveld.
Er zijn diversen recreatiemogelijkheden zoals mountenbiken, paintballen, Wandelen, Kajakken en Rondvluchten.
</td>
</tr>
</table>
<table id="quote_005" class="title">
<tr>
<td>
Groot speel- en recreatieterrein.
</td>
</tr>
</table>
<table id="quote_006" class="reg_text">
<tr>
<td>
Terwijl de kinderen spelen in de tafeltennisruimte of op de sportvelden en kinderspeeltuin kunt u rustig bijpraten met elkaar.
</td>
</tr>
</table>
<table id="quote_007" class="title">
<tr>
<td>
Rursee, Ardennen/Eifel.
</td>
</tr>
</table>
<table id="quote_008" class="reg_text">
<tr>
<td>
De Eifel en de Ardennen waren nog nooit zo opwindend dichtbij als aan de Rursee vlakbij de Nederlands-Duits-Belgische grens.
</td>
</tr>
</table>
<table id="quote_009" class="title">
<tr>
<td>
Titel_04
</td>
</tr>
</table>
<table id="quote_010" class="reg_text">
<tr>
<td>
04 Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst.
</td>
</tr>
</table>
<table id="quote_011" class="title">
<tr>
<td>
Titel_05
</td>
</tr>
</table>
<table id="quote_012" class="reg_text">
<tr>
<td>
05 Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst.
</td>
</tr>
</table>
<table id="quote_013" class="title">
<tr>
<td>
Titel_06
</td>
</tr>
</table>
<table id="quote_014" class="reg_text">
<tr>
<td>
06 Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst.
</td>
</tr>
</table>
<table id="quote_015" class="title">
<tr>
<td>
Titel_07
</td>
</tr>
</table>
<table id="quote_016" class="reg_text">
<tr>
<td>
07 Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst.
</td>
</tr>
</table>
<table id="quote_017" class="title">
<tr>
<td>
Titel_08
</td>
</tr>
</table>
<table id="quote_018" class="reg_text">
<tr>
<td>
08 Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst.
</td>
</tr>
</table>
<table id="quote_019" class="title">
<tr>
<td>
Titel_09
</td>
</tr>
</table>
<table id="quote_020" class="reg_text">
<tr>
<td>
09 Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst.
</td>
</tr>
</table>
<table id="quote_021" class="title">
<tr>
<td>
Titel_10
</td>
</tr>
</table>
<table id="quote_022" class="reg_text">
<tr>
<td>
10 Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst. Hallo, dit is een hele lange tekst.
</td>
</tr>
</table>
</body>
</html>
Het CSS script die het xhtml script gebruikt:
body {font-family:arial;}
table.reg_text {color:#08226b; font-size:75%;}
table.title {color:#FFFFFF; font-weight:bold;}

#img_mail_logo {position:absolute; top:10px; left:10px; height:100px; width:600px;}
#blue_dot_001 {position:absolute; top:110px; left:10px; height:1220px;width:1px;}
#blue_dot_002 {position:absolute; top:110px; left:609px; height:1220px;width:1px;}
#blue_dot_003 {position:absolute; top:1330px; left:10px; height:1px; width:600px;}

#blue_dot_004 {position:absolute; top:115px; left:15px; height:1px; width:590px;}
#blue_dot_005 {position:absolute; top:115px; left:15px; height:110px; width:1px;}
#blue_dot_006 {position:absolute; top:115px; left:604px; height:110px; width:1px;}
#blue_dot_007 {position:absolute; top:225px; left:15px; height:1px; width:590px;}
#blue_dot_008 {position:absolute; top:120px; left:20px; height:20px; width:580px;}
#quote_001 {position:absolute; top:118px; left:25px; width:580px;}
#quote_002 {position:absolute; top:138px; left:25px; width:580px;}

#blue_dot_009 {position:absolute; top:230px; left:15px; height:1px; width:590px;}
#blue_dot_010 {position:absolute; top:230px; left:604px; height:215px; width:1px;}
#blue_dot_011 {position:absolute; top:230px; left:15px; height:215px; width:1px;}
#blue_dot_012 {position:absolute; top:445px; left:15px; height:1px; width:590px;}
#blue_dot_013 {position:absolute; top:235px; left:315px; height:20px; width:285px;}
#blue_dot_014 {position:absolute; top:340px; left:20px; height:20px; width:290px;}
#img_001 {position:absolute; top:235px; left:20px; height:100px; width:290px;}
#img_002 {position:absolute; top:340px; left:315px; height:100px; width:285px;}
#quote_003 {position:absolute; top:233px; left:320px; width:280px;}
#quote_004 {position:absolute; top:253px; left:320px; width:280px;}
#quote_005 {position:absolute; top:338px; left:25px; width:280px;}
#quote_006 {position:absolute; top:358px; left:25px; width:280px;}

#blue_dot_015 {position:absolute; top:450px; left:15px; height:1px; width:590px;}
#blue_dot_016 {position:absolute; top:450px; left:15px; height:215px; width:1px;}
#blue_dot_017 {position:absolute; top:450px; left:604px; height:215px; width:1px;}
#blue_dot_018 {position:absolute; top:665px; left:15px; height:1px; width:590px;}
#blue_dot_019 {position:absolute; top:560px; left:20px; height:20px; width:290px;}
#blue_dot_020 {position:absolute; top:455px; left:315px; height:20px; width:285px;}
#img_003 {position:absolute; top:455px; left:20px; height:100px; width:290px;}
#img_004 {position:absolute; top:560px; left:315px; height:100px; width:285px;}
#quote_007 {position:absolute; top:453px; left:320px; width:280px;}
#quote_008 {position:absolute; top:473px; left:320px; width:280px;}
#quote_009 {position:absolute; top:558px; left:25px; width:280px;}
#quote_010 {position:absolute; top:578px; left:25px; width:280px;}

#blue_dot_021 {position:absolute; top:670px; left:15px; height:1px; width:590px;}
#blue_dot_022 {position:absolute; top:670px; left:15px; height:215px; width:1px;}
#blue_dot_023 {position:absolute; top:670px; left:604px; height:215px; width:1px;}
#blue_dot_024 {position:absolute; top:885px; left:15px; height:1px; width:590px;}
#blue_dot_025 {position:absolute; top:675px; left:315px; height:20px; width:285px;}
#blue_dot_026 {position:absolute; top:780px; left:20px; height:20px; width:290px;}
#img_005 {position:absolute; top:675px; left:20px; height:100px; width:290px;}
#img_006 {position:absolute; top:780px; left:315px; height:100px; width:285px;}
#quote_011 {position:absolute; top:673px; left:320px; width:280px;}
#quote_012 {position:absolute; top:693px; left:320px; width:280px;}
#quote_013 {position:absolute; top:778px; left:25px; width:280px;}
#quote_014 {position:absolute; top:798px; left:25px; width:280px;}

#blue_dot_027 {position:absolute; top:890px; left:15px; height:1px; width:590px;}
#blue_dot_028 {position:absolute; top:890px; left:15px; height:215px; width:1px;}
#blue_dot_029 {position:absolute; top:890px; left:604px; height:215px; width:1px;}
#blue_dot_030 {position:absolute; top:1105px; left:15px; height:1px; width:590px;}
#blue_dot_031 {position:absolute; top:895px; left:315px; height:20px; width:285px;}
#blue_dot_032 {position:absolute; top:1000px; left:20px; height:20px; width:290px;}
#img_007 {position:absolute; top:895px; left:20px; height:100px; width:290px;}
#img_008 {position:absolute; top:1000px; left:315px; height:100px; width:285px;}
#quote_015 {position:absolute; top:893px; left:320px; width:280px;}
#quote_016 {position:absolute; top:913px; left:320px; width:280px;}
#quote_017 {position:absolute; top:998px; left:25px; width:280px;}
#quote_018 {position:absolute; top:1018px; left:25px; width:280px;}

#blue_dot_033 {position:absolute; top:1110px; left:15px; height:1px; width:590px;}
#blue_dot_034 {position:absolute; top:1110px; left:15px; height:215px; width:1px;}
#blue_dot_035 {position:absolute; top:1110px; left:604px; height:215px; width:1px;}
#blue_dot_036 {position:absolute; top:1325px; left:15px; height:1px; width:590px;}
#blue_dot_037 {position:absolute; top:1115px; left:315px; height:20px; width:285px;}
#blue_dot_038 {position:absolute; top:1220px; left:20px; height:20px; width:290px;}
#img_009 {position:absolute; top:1115px; left:20px; height:100px; width:290px;}
#img_010 {position:absolute; top:1220px; left:315px; height:100px; width:285px;}
#quote_019 {position:absolute; top:1113px; left:320px; width:280px;}
#quote_020 {position:absolute; top:1133px; left:320px; width:280px;}
#quote_021 {position:absolute; top:1128px; left:25px; width:280px;}
#quote_022 {position:absolute; top:1238px; left:25px; width:280px;}

Let op: Mijn post bevat meningen, aannames of onwaarheden


  • gambieter
  • Registratie: Oktober 2006
  • Niet online

gambieter

Just me & my cat

Waarom allemaal plaatjes meesturen? Steeds meer emailclients blokkeren die automatisch ivm spam. Je kunt beter je info op een website zetten en de link sturen :)

(ik weet nog minder van xhtml en css, maar wel veel van emails ontvangen ;)

I had a decent lunch, and I'm feeling quite amiable. That's why you're still alive.


  • BtM909
  • Registratie: Juni 2000
  • Niet online

BtM909

Watch out Guys...

Ik zou zeggen, zoek eens in Webdesign, Markup & Clientside Scripting op welke formaat je een email het beste kan versturen ;)

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.


  • Gamebuster
  • Registratie: Juli 2007
  • Laatst online: 23-10 08:50
gambieter schreef op donderdag 04 oktober 2007 @ 00:44:
Waarom allemaal plaatjes meesturen? Steeds meer emailclients blokkeren die automatisch ivm spam. Je kunt beter je info op een website zetten en de link sturen :)

(ik weet nog minder van xhtml en css, maar wel veel van emails ontvangen ;)
Ik kan je een meterslange uitleg geven over die plaatjes, maar deze e-mail is in opdracht van mn vader en krijg er voor betaalt. (600 euro) :)

Ik zoek gewoon een oplossinf hiervoor.

Op dit moment ben ik aan et zoeken op het forum en op google. Ik doe niet niets maar ik heb een klein beetje haast want heb een deadline.

[ Voor 14% gewijzigd door Gamebuster op 04-10-2007 00:51 ]

Let op: Mijn post bevat meningen, aannames of onwaarheden


  • curry684
  • Registratie: Juni 2000
  • Laatst online: 28-11 08:35

curry684

left part of the evil twins

Gamebuster schreef op donderdag 04 oktober 2007 @ 00:42:
Ik zit met het volgende probleem:

Ik wil een e-mail verzenden waarvan ik de broncode in xhtml 1.0 transitional en css 2.0 heb geschreven.
Waarom moeite doen voor XHTML met CSS als je toch tables gebruikt vervolgens?
In dit script staan plaatjes waarvan de bron van internet moet komen. (Zie script)
Hoe kan ik dit script verzenden zodat de ontvanger geen script maar gewoon de plaatjes en de tekst zien zonder dat er bijlagen worden verstuurd.
Niet, geen enkele moderne mailreader download plaatjes van een untrusted source zonder specifieke toestemming van de gebruiker. Kan dus simpelweg niet. Wel kun je <img> tags gebruiken die verwijzen naar plaatjes op internet, dan heb je geen bijlagen maar zijn ze alsnog niet direct zichtbaar.

Om alles overigens samen te vatten: vergeet voor HTML emails direct alles wat je ooit hebt geleerd over net HTML+CSS schrijven: geen enkele mailreader zal ernaar omkijken. In de praktijk ben je voor emails het beste af met HTML 3.2 in tig tables, dan werkt het tenminste overal enigszins vergelijkbaar. Moet ik helaas als XHTML/CSS purist op basis van praktijkkennis zeggen.

voor 600 euro mag je me overigens wel mailen/DM'en met details, wil ik het wel door een professioneel bedrijf laten uitvoeren en krijg je er nog provisie op ook, plus dat het dan niet bij 80% van de ontvangers in het spamfilter eindigt :D

[ Voor 8% gewijzigd door curry684 op 04-10-2007 00:55 ]

Professionele website nodig?


  • Gamebuster
  • Registratie: Juli 2007
  • Laatst online: 23-10 08:50
Waarom moeite doen voor XHTML met CSS als je toch tables gebruikt vervolgens?
Omdat de layout telkens veranderd en ik dit makkelijker vind werken omdat de pagina overal hetzelfde word weergegeven. (zover ik weet)
Met normale table's zonder CSS gooit ie er witranden tussen en word de pagina anders weergegeven in IE dan in Firefox.
Hoe dan ook; ik ben een beginner. :P
Wel kun je <img> tags gebruiken die verwijzen naar plaatjes op internet, dan heb je geen bijlagen maar zijn ze alsnog niet direct zichtbaar.
Deed ik toch? <img src="http://www.hinloopen.nl/nieuwsbrief/blabla.png"/> staat er; die linkt toch door naar internet? Ik weet dat ze dan niet dircet zichtbaar zijn bij sommigen, maar dat hebben ze dan met iedere mail.
Om alles overigens samen te vatten: vergeet voor HTML emails direct alles wat je ooit hebt geleerd over net HTML+CSS schrijven: geen enkele mailreader zal ernaar omkijken. In de praktijk ben je voor emails het beste af met HTML 3.2 in tig tables, dan werkt het tenminste overal enigszins vergelijkbaar. Moet ik helaas als XHTML/CSS purist op basis van praktijkkennis zeggen.
Bedoel je dat xhtml+CSS in e-mail niet (goed) werkt?

Nog ff voor de duidelijkheid: Ik wil een e-mail met plaatjes verzenden zonder bijlagen. Hij moet dus de plaatjes van internet plukken. De mail word naar 1000-2000 e-mail adressen verstuurt. De mensen die de mail ontvangen hebben meestal slechts weinig verstand van pc's en kunnen net hun mail openen. Mijn opdracht was een mail te versturen met plaatjes naar al die mail adressen zonder bijlagen.
Mijn oplossing ging uit naar xhtml, maar andere mogelijken mogen ook. Zolang het maar aan de voorwaarden voldoet.

[ Voor 76% gewijzigd door Gamebuster op 04-10-2007 01:12 ]

Let op: Mijn post bevat meningen, aannames of onwaarheden

Pagina: 1