newsletter html e css

seremot · da **seremot** » mercoledì 19 ottobre 2011, 17:06

Buongiorno a tutti,
sto realizzando una newsletter per un cliente a cui ho quasi finito il sito e vorrebbe appunto inviare ai suoi contatti per far consocere il sito nuovo.

So che non posso collegare dei fogli di stile, quindi i css devo inserirli tutti nell'html con style="" ma da un po' di newsletetr scaricate dalla rete vedo che tutti usano le vecchie tabelle per impagianre i contenuti e non i div. Come mai? Poi carico le immagini ovviamente sul server e inserisco i percorsi http://www...

Io con il mac sia su mail che su thunderbird le vedo perfettamente, ma il cliente che ha outlook su window le vede tutte sballate, o non vede alcune img usate come background in celle di tabelle... perchè? Sto diventando pazza! Ho provato a farla con i div, un disastro, ho provato a usare le tabelle, ma anche qui si vede male. Il fatto è che io la vedo bene SEMPRE e lei MAI.

Avete qualche consiglio?

Grazie

Paolob · da **Paolob** » giovedì 20 ottobre 2011, 8:57

Ciao,
purtroppo se i vari browser elaborano in modo leggermente diverso l'html, i client di posta lo fanno ancora peggio..

Se vuoi inviare email in HTML devi creare codice veramente semplice, e come hai notato fare anche uso di tabelle, impropriamente, per gestire l'impaginazione.

Ne ho create alcune per dei miei clienti, le recupero e poi ti passo volentieri

seremot · da **seremot** » giovedì 20 ottobre 2011, 10:33

Dici che se uso tabelle limitando al massimo l'uso dei css interni risolvo un po' di problemi? Perchè mi pare che i problemi maggiori siano dati da questi css, ad esempio non vede img di background inserite nelle tabelle con gli stili.
Il mio problema è che non ho outlook (e + precisamente outlook su windows) e mi scoccia continuare a girare il cliente mail che visualizza male, mentre io le vedo benissimo.
Vi metto il link alla mail... ve avete voglia di dare un occhio al codice e magari darmi qualche suggerimento.
http://www.francomariana.com/NEW/newsle ... tter4.html

Grazie

Paolob · da **Paolob** » giovedì 20 ottobre 2011, 13:10

seremot ha scritto:Dici che se uso tabelle limitando al massimo l'uso dei css interni risolvo un po' di problemi? Perchè mi pare che i problemi maggiori siano dati da questi css, ad esempio non vede img di background inserite nelle tabelle con gli stili.
http://www.francomariana.com/NEW/newsle ... tter4.html

Purtroppo le immagini di background, come hai notato non vengono visualizzati in tutti i client di posta.

Per la newsletter che hai realizzato, mi sa che devi rinunciare ad alcune cosine.. tipo i vari background che hai inserito.

Ti incollo un modello base che utilizzo.

Sintassi: html [ Scarica ] [ Nascondi ]

<!DOCTYPE html PUBLIC \"-//W3C//DTD HTML 3.2//EN\">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="Generator" content="Contao Open Source CMS">
<title>Titolo Newsletter</title>
</head>
<body>
<style> a {color:#91786C;}</style>
<table width="100%" cellpadding="10" cellspacing="0" class="backgroundTable" bgcolor='#ffffff' >
        <tr>
                <td valign="top" align="center">
                        <table width="598" cellpadding="0" cellspacing="0">
                                <tr>
                                        <td>
                                            <center>
                                                <a href="http://www.ali-lab.com"><img width="598" height="84" align="center" title="Miositoweb.it" alt="Miositoweb.it" border="0" alt="" src="http://www.miositoweb.it/file/themes/default/newsletter/img-header.jpg"></a>
                                            </center>
                                        </td>
                                </tr>
                        </table>
                        <table width="600" cellpadding="10" cellspacing="0" bgcolor="#FFFFFF">
                                <tr>
                                    <td bgcolor="#FFFFFF" valign="top" style="font-size:12px;color:#000000;line-height:150%;font-family:trebuchet ms;">
                                        <?php echo $this->body; ?>
                                    </td>
                                </tr>
                                <tr>
                                        <td style="background-color:#FFFFff;border-top:1px solid #000000;" valign="top">
                                                <span style="font-size:12px;font-weight:bold;color:#000000;font-family:arial;line-height:110%;">Miositoweb.it</span><br>
                                                <span style="font-size:10px;color:#000000;line-height:100%;font-family:verdana;">
                                                <a href="http://www.ali-lab.com">www.ali-lab.com</a><br /><br />
                                                        Se non desideri più ricevere le utili notizie da Miositoweb.it accedi a <a href="http://www.miositoweb.it/newsletter.html">questa</a> pagina e segui le istruzioni
                                                        <br />
                                                </span>
                                        </td>
                                </tr>
                        </table>
                </td>
        </tr>
</table>
 
 
</body>
</html>

Facendo una ricerca veloce, ho trovato questo articolo molto sintetico che fornisce alcune indicazioni.
http://groundwire.org/support/articles/css-and-email-newsletters

seremot · da **seremot** » giovedì 20 ottobre 2011, 17:33

Mi sa che proverò a semplificare l'impaginazione. Questa mi piaceva perchè riprendeva la home del nuovo sito.

newsletter html e css

newsletter html e css

Re: newsletter html e css

Re: newsletter html e css

Re: newsletter html e css

Re: newsletter html e css

Chi c’è in linea