• Programmazione » HTML » Tutorial HTML

Pagina 2 di 2

Passo 3: Altri accorgimentinecessari

A questo punto bisogna effettuare un po' di test. Ladomanda da porsi sarà: "Come si visualizza lanostra email sui principali client di posta?"

Innanzitutto bisogna provare a visualizzarla sia in Firefoxche in Internet Explorer. Se in entrambi i browsersrisulterà bene impaginata, ci sono buone chances chela mail venga bene interpretata sia da Outlook che da Yahoo!mail che da Google Mail. Effettuato questo primo test bisognaprovare ad inviare la mail creata a diversecaselle email, ciascuna gestita da client differenti(Yahoo! mail, Google Mail ed Hotmail) e vedere se e comeviene ricevuta.

Di seguito ecco altri accorgimenti per aumentare lacompatibilità di una mail con i client di posta:

• può esser utile bloccare la width degli elementi nella mail. Certo, non è la soluzione ideale, dal momento che il lettore potrebbe decidere di ridimensionare la pagina nel momento in cui legge la mail, ma ciò è necessario per aumentare la compatibilità.

• se si verifica una perdita delle spaziature interne alle tabelle, innanzitutto si devono settate le proprietà cellspacing e cellpadding delle tabelle
• se le immagini risultano disposte in modo differente rispetto a come gli abbiamo impostato, molto probabilmente è perchè la tag <img> si trova nidificata all' interno della tag <td>. Per correggere dunque sarà necessario prima chiudere la tag con </td> e poi aprire la <img>
• evitare il più possibile l' utilizzo del JavaScript, che nella maggior parte dei casi è disabilitato sui client email per motivi legati alla sicurezza
• nel caso un' immagine risulti spezzettata tra le varie righe e colonne di una tabella, si può ovviare al problema creando una nuova tabella che contenga al suo interno tutte le altre ed impostarle come immagine di sfondo quella in questione
• ricordarsi di usare sempre l' attributo taget=”_blank” in ogni collegamento ipertestuale, perchè nel caso questo non venisse fatto, ogni link clickato dall' utente non aprirebbe alcun collegamento
• per inserire immagini di sfondo, evitare di ricorrere a codice CSS e piuttosto impostare tale immagine come sfondo della tabella contenente tutte le altre
• le immagini che si inseriscono nella mail devono trovarsi preferibilmente in un' apposita sotto-cartella dello spazio web, e non dovranno mai esser cancellate: molti utenti potrebbero leggere dopo mesi la mail e, se le immagini non sono più online, non riuscirebbero più a visualizzarle
• evitare l' inserimento di immagini da 1x1 pixel, in quanto il loro inserimento è diffusissimo nelle email di spam, e questo farebbe catalogare la nostra mail come tale.
• Per lo stesso motivo, evitare di inserire immagini che occupino l' intero corpo della mail

Già che con gli ultimi due punti siamo entrati inargomento spam, è consigliato effettuare alcuni testper comprendere con quanta facilità la mail possavenir scambiata per una mail-spazzatura. Per far ciòci viene in aiuto SpamCeck, servizio cheanalizza l 'HTML della mail ed elenca quali fattoripotrebbero farla scambiare per spam.

Terminato tutto ciò, ormai sicuri che la resa visivadella mail sia pressochè identica su ciascun client diposta (a tal proposito si consiglia l' utilizzo delservizio BrowserCam,in grado di mostrare come viene visualizzata una mail neiprincipali client email), bisogna pensare ai dettagli dellamail:

• L' indirizzo del mittente deve venire visualizzato?
• Che oggetto inserire?
• Le informazioni sono ben visibili?
• Bisogna integrare ad inizio email alcune righe nelle quali si dice “Hai ricevuto questa mail perchè...Ne caso ci si voglia de-registrare dal servizio...”?

Data una risposta a queste domande, si può procedere.

Passo 4: Accorgimenti per GoogleMail

Dal momento che i servizi di lettura mail direttamente dabrowser, come Google Mail, sono in HTML ed a stretto contattocon la programmazione lato server, si potrebbe pensare chequesti non diano problemi durante l' interpretazione dimail scritte in HTML. Errato. Infatti il suo provider diposta elettronica, prima di inoltrare la mail al client,effettua una prima analisi al codice delle mail, apportandoalcune correzioni che dovrebbero servire a renderlepiù comprensibili.

Come prima cosa il provider elimina tutti i codice CSScontenuti all' interno di ciascuna tags di stile, ele dichiarazioni di font contenute all' interno delle tagtable restituiscono come output scritte di dimensionimaggiori a quelle impostate.

Ecco alcuni trucchi per avere mail migliori suGoogle Mail:

• Definire il colore di sfondo tramite l' attributo bgcolor= di una cella td, evitando di impostarlo tramite codice CSS.
• Stessa cosa per le immagini, da definire all ' interno della cella td.
• Per controllare i margini di una cella td è preferibile l' utilizzo dell' attributo padding.
• Se si vuole che la tabella abbia un contorno, bisogna annidarla all' interno della tag <div>, dal momento che solo in questo caso Google Mail le conferisce contorni ben definiti e visibili.
• Nel caso si vogliano impostare particolari colori ai collegamenti ipertestuali, usare l' attributo color: nella cella td, associandola ad un font particolare.
• Se si notano differenze, a parità di font, tra quanto scritto in un <p> e quanto in un <a>, provare a nidificare la tag <a> nella <p>.
• Google Mail, dotato di un' interfaccia grafica, tende ad accentrare gli elementi delle mail posti sulla destra, in quanto tale porzione di schermo deve essere sfruttata per mostrare l' interfaccia grafica del servizio; ciò provoca uno spostamento centrale di tali elementi. Per questo motivo, accertarsi che i paddings contenuti nelle tags <td> siano impostati a 10px.

Conclusioni

Come si è sicuramente potuto notare gli accorgimentisono molteplici, il creare email in HTML serie comportapazienza, tempo e precisione. Certo, si potrebbe sviare ilproblema creando newsletter in formato testuale, ma lestatistiche rivelano che le email in HTML riscontrano unsuccesso nettamente maggiore. Insomma, munirsi di buonapazienza e...aprire l' editor HTML!