Ciao Borja, grazie per i complimenti su BEEfree. Purtroppo non è possibile assicurare la compatibilità su tutti i client di posta / device e al tempo stesso mantenere il peso dell'HTML basso. Abbiamo ragionato a lungo su quale strada seguire e alla fine abbiamo scelto la strada della massima compatibilità. In particolare uno dei client che ci ha costretto ad aumentare il peso del messaggio è Gmail su sistema operativo Android, oltre che Outlook che purtroppo è ancora molto usato sopratutto se lavori nel B2B.
A livello di limiti, il suggerimento è evitare messaggi più grandi di 100KB, perchè oltre quella soglia Gmail tronca il contenuto.

@Nazzareno said:

Ciao Borja, grazie per i complimenti su BEEfree. Purtroppo non è possibile assicurare la compatibilità su tutti i client di posta / device e al tempo stesso mantenere il peso dell'HTML basso. Abbiamo ragionato a lungo su quale strada seguire e alla fine abbiamo scelto la strada della massima compatibilità. In particolare uno dei client che ci ha costretto ad aumentare il peso del messaggio è Gmail su sistema operativo Android, oltre che Outlook che purtroppo è ancora molto usato sopratutto se lavori nel B2B.
A livello di limiti, il suggerimento è evitare messaggi più grandi di 100KB, perchè oltre quella soglia Gmail tronca il contenuto.

Ciao Nazzerro ti ringrazio per l'immediata risposta. Ho conosciuto Beefree dopo aver letto la discussione che hai aperto sul forum

A proposito del peso, sarebbe possibile con Beefree eliminare ad esempio la compatibilità con IE7 o IE8 ? In questo modo potrei risparmiare un po di kb.

PS. Sarebbe bello se su Beefree si potesse impostare anche l'altezza dei blocchi in px

Il problema purtroppo non è sulle versioni vecchie di IE, ma sui client di posta come Gmail mobile, Outlook o Office 365, che non si possono ignorare.
Comunque qui trovi un breve video su come ridurre il peso delle email:
http://help.mailup.com/display/MM/FAQ#FAQ-23

P.S.
Come trucco per riempire spazio puoi usare ad esempio il blocchetto divisore trasparente.

@Nazzareno
ieri ho fatto una bozza su BEEFREE e una volta terminata ho fatto il download dello zip

C'è la possibilità di caricare l'html nell'editor e poter continuare a lavorare la bozza ?

L'ultimo messaggio ti rimane sempre salvato, basta che non cambi browser o non cancelli tutti i dati. Nella home page infatti, al secondo accesso ti troverai questa scritta:
*"Welcome back! Nice to see you again | Continue editing your last message?"
*Che ti permette di ritornare all'ultimo messaggio creato. Se invece devi crearne e salvarne diversi, allora devi passare alla versione PRO: http://beefree.io/pro/.

@Nazzareno said:

L'ultimo messaggio ti rimane sempre salvato, basta che non cambi browser o non cancelli tutti i dati. Nella home page infatti, al secondo accesso ti troverai questa scritta:
*"Welcome back! Nice to see you again | Continue editing your last message?"
*Che ti permette di ritornare all'ultimo messaggio creato. Se invece devi crearne e salvarne diversi, allora devi passare alla versione PRO

Hmm no oggi quando sono andato su Beefree non e' comparsa la scritta

Comunque non e' proprio possibile impostare manualmente l'altezza dei contenuti (o delle strutture)?

Strano, che browser utilizzi? Hai forse qualche impostazione di privacy/contenuti che va a cancellare i cookie alla fine di ogni sessione?
Comunque se clicchi su "more options" vedrai che per ogni oggetto puoi impostare il padding su ogni lato (destra, sinistra, sopra, sotto). Per le strutture (che poi sono le fasce orizzontali) puoi anche specificare altri parametri, sempre cliccando su "more options".

@Nazzareno said:

Strano, che browser utilizzi? Hai forse qualche impostazione di privacy/contenuti che va a cancellare i cookie alla fine di ogni sessione?
Comunque se clicchi su "more options" vedrai che per ogni oggetto puoi impostare il padding su ogni lato (destra, sinistra, sopra, sotto). Per le strutture (che poi sono le fasce orizzontali) puoi anche specificare altri parametri, sempre cliccando su "more options".

firefox ultima versione e non credo di aver qualche modalità privacy attivata...

Comunque mi spieghi come poter inserire una sorta di header con immagine a sinistra e testo a destra ma sulla "stessa linea" ?
purtroppo ogni volta che ridimensiono la pagina.html la scritta scivola sotto l'immagine

Ho inserito la terza struttura a partire dall'alto ma niente ogni volta si spezza su due linee

l'immagine ha una larghezza di 90px mentre la scritta è un font di 48px

Gli HTML finali generati da questi editor sono pesanti perchè sono necessari tantissimi trucchi per rendere l'email ben compatibile con Gmail mobile o con Outlook 2016 (per citare due dei più problematici).

Anche con mosaico.io puoi creare un template e scaricarti l'html generato per poi utilizzarlo come credi: considera però che questi html subiscono anche un "CSS inlining" nella loro fase finale, quindi i CSS vengono messi su ciascun tag invece che usare i tag style e /style sempre per via di chi (come Gmail) cancella tali tag. Se fai delle modifiche che includono l'inserimento di alcuni di questi tag devi preoccuparti tu di inserire i CSS inline come avrebbe fatto l'editor.

Potrai trovare sicuramente dei template più semplici e leggeri cominciando a sacrificare la "responsività" su Gmail mobile e il funzionamento su Outlook 2007...2016 per Windows.

@bago said:

Gli HTML finali generati da questi editor sono pesanti perchè sono necessari tantissimi trucchi per rendere l'email ben compatibile con Gmail mobile o con Outlook 2016 (per citare due dei più problematici).

Anche con mosaico.io puoi creare un template e scaricarti l'html generato per poi utilizzarlo come credi: considera però che questi html subiscono anche un "CSS inlining" nella loro fase finale, quindi i CSS vengono messi su ciascun tag invece che usare i tag style e /style sempre per via di chi (come Gmail) cancella tali tag. Se fai delle modifiche che includono l'inserimento di alcuni di questi tag devi preoccuparti tu di inserire i CSS inline come avrebbe fatto l'editor.

Potrai trovare sicuramente dei template più semplici e leggeri cominciando a sacrificare la "responsività" su Gmail mobile e il funzionamento su Outlook 2007...2016 per Windows.

Ciao Bago,
se una mail inizia a dare problemi se pesante oltre 100kb allora posso stare tranquillo e non sacrificare la responsivita'.

Comunque avrei due domande:

1. io che utilizzero un modello creato da un editor "esterno" ogni quanto dovrei controllare se nuovi client di posta elettronica hanno fatto nuove modifiche rendendo obsoleto il mio modello ?

2. i link non devono superare una certa lunghezza ? e come faccio se voglio tracciarli con analytics e per forza di cose diventano piu' lunghi?
   Il limite e' anche sulle anchor text ?

1. Difficile a dirsi. Purtroppo la tecnica "ibrida" usata sia da Mosaico che da Bee è una tecnica piuttosto recente e potrebbe essere resa obsoleta in qualunque momento se uscisse una nuova versione di Outlook o una nuova versione di Gmail molto incompatibile con la precedente. Se domani Apple decidesse di cambiare il client di base dell'iPhone allora tutti i template probabilmente diventerebbero obsoleti.. solo l'Apple sa se esiste un piano per farlo e quando potrebbe avvenire (dubito che lo faranno, ma è per farti capire).

2. Non mi risultano problemi con link lunghi.

@bago said:

1. Difficile a dirsi. Purtroppo la tecnica "ibrida" usata sia da Mosaico che da Bee è una tecnica piuttosto recente e potrebbe essere resa obsoleta in qualunque momento se uscisse una nuova versione di Outlook o una nuova versione di Gmail molto incompatibile con la precedente. Se domani Apple decidesse di cambiare il client di base dell'iPhone allora tutti i template probabilmente diventerebbero obsoleti.. solo l'Apple sa se esiste un piano per farlo e quando potrebbe avvenire (dubito che lo faranno, ma è per farti capire).

2. Non mi risultano problemi con link lunghi.

Perfetto
Grazie Bago

Ragazzi è possibile utilizzare come valori di width i punti percentuali (%) ?
E il **float **?

@Nazzareno
In un mio precedente post ti ho chiesto se su BEEFREE fosse possibile avere un header con un immagine (sinistra) e del testo (a destra) sulla stessa "riga".
Ho provato varie modifiche ma nulla...
L'unica soluzione credo sia intervenire direttamente sul codice è modificare alcune cose di questi due div :

1. eliminare l'istruzione che aggiunge ai due div la classe .col (che ha come proprietà una width: 100% !important)

2. inserire nello style del div immagine **float:left; width: 40%;

**3) inserire nello style del div testo float:left; width: 60%;

In questo modo funzionerebbe... ma tu che dici ? me lo sconsigli ?

Il float è uno di quegli attributi che non funzionano su molti clienti. Quindi puoi usarlo solo se sai cosa fai e sai cosa succede sui client che non lo supportano.
Per i width, idem.. tutto è possibile.. se hai voglia di spendere giornate a creare un template da zero e testarlo allora puoi farlo, altrimenti ti conviene prendere un template fatto da chi ci ha perso le giornate e cercare di non toccarlo (se non sai quello che fai lo rompi quasi sicuramente).

Riguardo alla domanda che fai su BeeFree posso già risponderti io (poi Nazzareno confermerà) che è una pessima idea e che così facendo rompi sicuramente il funzionamento su alcuni client.
Con Beefree puoi creare un blocco con immagine e testo "orizzontali" senza problemi, da quello che mi risulta: perchè cerchi di farlo via codice?

@bago said:

Il float è uno di quegli attributi che non funzionano su molti clienti. Quindi puoi usarlo solo se sai cosa fai e sai cosa succede sui client che non lo supportano.
Per i width, idem.. tutto è possibile.. se hai voglia di spendere giornate a creare un template da zero e testarlo allora puoi farlo, altrimenti ti conviene prendere un template fatto da chi ci ha perso le giornate e cercare di non toccarlo (se non sai quello che fai lo rompi quasi sicuramente).

Riguardo alla domanda che fai su BeeFree posso già risponderti io (poi Nazzareno confermerà) che è una pessima idea e che così facendo rompi sicuramente il funzionamento su alcuni client.
Con Beefree puoi creare un blocco con immagine e testo "orizzontali" senza problemi, da quello che mi risulta: perchè cerchi di farlo via codice?

Provo a farlo via codice perche su Beefree non mi funziona

Ho selezionato il terzo tipo di struttura (dall'alto) e messo a sinistra l'immagine (80px di altezza e larghezza) e poi a destra la scritta (una parola con font Georgia e size 36px).
Ma se ridimensiono e la larghezza della finestra e' inferiore a 500px l'header si spezza in due con ciascun div che ha una larghezza di 100%.
Quindi avro la scritta sotto l'immagine

Quello è proprio l'effetto voluto per fare in modo che si veda bene su smartphone. Si chiama "Responsive".

E io quello che sto cercando di capire e' se ci sia una struttura con due div e la larghezze in percentuale.

In questo modo e' responsive e comunque l'header non si spezza in due

Comunque questo problema posso facilmente aggirarlo creando un'unica immagine che inglobi anche la scritta...
Il problema ora è un altro:

ho l'esisgenza di creare una tabella (a due colonne) come potrei fare ? su beefree non mi sembra ci sia la possibilità di inserire tabelle

Raga potete dirmi se questo tipo di tabella possa andare bene ?

https: //jsfiddle.net/s7n7exst/

Ti sei messo in una impresa che secondo me è più grande di te Fare un template email non è come fare una pagina web che bene o male si vede.

Nel codice vedo dei problemi sui commenti condizionali... e poi cosa significa "possa andare bene"? Dipende da quali sono i client sui quali vuoi compatibilità.

Con Litmus o Email On Acid puoi avere uno strumento che ti fa vedere velocemente come il tuo HTML si vedrà su vari client di posta, ma la cosa migliore sarebbe provarli, almeno i principali: chi sviluppa template di solito ha decine di dispositivi reali sui quali testare il template per verificare che tutto funzioni come deve.