css3.gr

Όταν ακούτε Newsletter, λογικά σας έρχεται στο μυαλό ένα HTML email, με πληροφορίες που τις περισσότερες φορές δεν σας ενδιαφέρουν. Ο βασικός σκοπός ενός Newsletter είναι στην πραγματικότητα να φέρεις τον αναγνώστη στη ιστοσελίδα και όχι την ιστοσελίδα στον αναγνώστη. Παρακάτω θα προσπαθήσω να σας δώσω μια ολοκληρωμένη εικόνα για τον κόσμο των Newsletter, μιλώντας για:

1. Απλό κείμενο ή HTML
2. Συμβουλές για τη δημιουργία HTML Email
3. Συμβατότητα με Email Clients & Standards
4. Τρόποι αποστολής Newsletter
5. Γλιτώστε το Spam
6. Συμπέρασμα
7. Περισσότερο διάβασμα

Απλό κείμενο ή HTML

Η πρώτη απόφαση που πρέπει να πάρουμε όταν θα ξεκινήσουμε να δημιουργούμε ένα Email είναι αν αυτό θα αποτελείται από απλό κείμενο ή από HTML.

Το email με απλό κείμενο δεν αντιμετωπίζει προβλήματα συμβατότητας και είναι ιδανικό για σύντομα μηνύματα και ενημερώσεις. Όπως είναι για παράδειγμα οι εγγραφές, μικρά νέα του site και οτιδήποτε δεν έχει ανάγκη για πιο σύνθετη παρουσίαση της πληροφορίας. Όμως όταν θέλουμε να δημιουργήσουμε ένα Newsletter τότε τα πράγματα είναι διαφορετικά. Ένα Newsletter συνήθως έχει πλούσιο περιεχόμενο, με κείμενα, διαφημίσεις, εικόνες κλπ. Κάτι που με απλό κείμενο δεν θα μπορούσε να επιτευχθεί. Όμως ακόμα και όταν δημιουργούμε ένα HTML email είναι απαραίτητο να παρέχουμε την πληροφορία και με απλό κείμενο σε περίπτωση που ο παραλήπτης δεν μπορεί να το διαβάσει. Αλλά αυτό θα το αναλύσουμε και παρακάτω.

Συμβουλές για τη δημιουργία HTML Email

Η λέξη HTML δεν σημαίνει ότι μπορούμε να γράψουμε το markup και το CSS όπως θα κάναμε σε μια κανονική ιστοσελίδα. Υπάρχουν πάρα πολλοί περιορισμοί οι οποίοι αλλάζουν τους κανόνες της συγγραφής της HTML. Παρακάτω κάποιοι βασικοί κανόνες:

Το πλάτος πρέπει να είναι μικρό

Ένα καλό μέγεθος για το πλάτος ενός HTML Email είναι τα 600 pixel. Σκεφθείτε πού θα διαβάστει το email αυτό. Λογικά στο Preview κάποιου Email Client (Outlook), στο Gmail κλπ. Αυτό σημαίνει ότι πρέπει το πλάτος να είναι αρκετά μικρό έτσι ώστε να μπορεί να διαβαστεί όλο το email ή μεγάλο μέρος του δίχως να χρειαστεί να χρησιμοποιήσει το οριζόντιο scrollbar.

Προσοχή με τις εικόνες

Όπως είπαμε και πιο πάνω το HTML Email μπορεί να είναι πολύ πιο ευχάριστο επειδή μπορεί να περιέχει εικόνες. Όμως σε μερικούς clients όπως το Gmail για λόγους ασφαλείας οι εικόνες δεν ανοίγουν αμέσως, αλλά πρώτα ζητούν την άδειά σας. Αυτό σημαίνει ότι αν έχετε πολλές εικόνες ο χρήστης θα λάβει ένα αρκετά άσχημο και αδιάβαστο email και πολλές φορές θα διαλέξει να το σβήσει ή ακόμα χειρότερα να το ρίξει στα Spam.

Μερικοί τρόποι για να αντιμετωπίσουμε αυτό το πρόβλημα είναι:

• Nα έχουμε περιγραφικά alt tags στις εικόνες.
• Να είναι περιορισμένες σε αριθμό μιας και το email πρέπει να έχει κυρίως ενημερωτικό χαρακτήρα.
• Να σχεδιάσουμε το email με τρόπο που θα δίνει το μήνυμα που θέλουμε ακόμα και αν οι εικόνες είναι απενεργοποιημένες. Με λίγα λόγια να μην υπάρχει πολύ σημαντικό περιεχόμενο σε μορφή εικόνας. (register link).

Header και Footer

Το περιεχόμενο του Header και του Footer παίζουν σημαντικό ρόλο για την εικόνα του Newsletter και κατ’ επέκταση της εταιρείας σας. Πρέπει να περιέχουν τα εξής:

• Διαγραφή από τη λίστα (Unsubscribe link). (Footer)
• Link για ανάγνωση του Email στον Browser σε περίπτωση που δεν διαβάζεται μέσα από τον Email Client. (Header)
• Link σε σημαντικές πληροφορίες σχετικά με την εταιρία σας όπως νομικά κείμενα, πληροφορίες για το λόγο που λαμβάνετε αυτό το email κ.ά. (Footer)

Άλλοι Κανόνες

• Δεν χρησιμοποιούμε Javascript.
• Όλα τα link πρέπει να είναι absolute. (”http://www.example.gr”">http://www.example.gr” index.html και όχι “/index.html”)
• Δεν χρησιμοποιούμε Flash.
• Το CSS πρέπει να βρίσκεται inline.
• To Layout πρέπει να αποτελείται από Tables.
• Όλα τα κείμενα και τα Links είναι καλό να περιέχουν style.

Συμβατότητα με Email Clients & Standards

Δυστυχώς η σχέση των Email Clients με το HTML/CSS είναι πολύ χειρότερη απ’ ό,τι αυτή των Browser. Γι αυτό το λόγο η δημιουργία κάποιων Standards είναι απαραίτητη για να ξέρουμε τι μπορούμε να χρησιμοποιήσουμε, και τι όχι, κερδίζοντας πολύτιμο χρόνο από τις δοκιμές.

Το Email Standards Project ανέλαβε την πρωτοβουλία να συνεργαστεί με τους Email Clients για να βελτιώσει την κατάσταση. Πραγματοποίησαν το acid test, το οποίο δοκίμασε τον τρόπο που οι περισσότεροι Email Clients κάνουν render το CSS. Δυστυχώς τα αποτελέσματα είναι πολύ άσχημα για δύο πολύ δημοφιλείς Clients, το Gmail και το Outlook 2007. Αρκούν αυτοί οι δύο για να κρατάνε πολύ πίσω τα Standards.

Επίσης αν και δεν έχει πολύ νόημα να το αναφέρω, θα το κάνω. Υπάρχει HTML Email Validator για να δοκιμάσετε τον κώδικά σας. Όμως είναι Beta από το 2005 και δεν το συνιστώ.

Ο μόνος τρόπος να είστε τελικά σίγουροι ότι το HTML email σας θα φαίνεται σε όλους τους Clients με αξιοπρεπή τρόπο είναι να τους δοκιμάσετε όλους, ή τουλάχιστον τους σημαντικότερους και εννοείται να ακολουθείτε κατά γράμμα τα υπάρχοντα Standards.

Τρόποι αποστολής Newsletter

Τώρα ερχόμαστε σε ένα άλλο σημαντικό θέμα. Πώς θα στείλετε μαζικά τα email σας, πώς θα διαχειριστείτε τους εγγεγραμμένους χρήστες, την καμπάνια σας, τα στατιστικά κλπ. Δεν θα εμβαθύνω πολύ. Θα προτείνω 3 διαφορετικές λύσεις που καλύπτουν τις περισσότερες περιπτώσεις.

Το θετικό με τις self-hosted πλατφόρμες είναι ότι έχετε τον πλήρη έλεγχο των δεδομένων σας και είναι στο χέρι σας να τις επεκτείνετε και να τις φέρετε στα μέτρα σας. Το αρνητικό είναι ότι στους περισσότερους Shared Servers υπάρχει όριο στα email ανά ώρα (1000 συνήθως).

poMMo Project

Το poMMo είναι μια εφαρμογή σε PHP για να στέλνετε μαζικά email και να διαχειρίζεστε τις mailing lists σας.

PHPlist

To PHPlist είναι άλλη μια εφαρμογή σε PHP και προσφέρει όλα τα αναγκαία εργαλεία για να διαχειριστείτε τις email καμπάνιες σας.

Dada Mail

Το Dada Mail είναι άλλη μια εφαρμογή για μαζικά email γραμμένη σε Perl/SGI με δωρεάν και Pro έκδοση.

Thunderbird

Θα αναφέρω το Thunderbird επειδή δίνει την δυνατότητα να στείλετε HTML emails και βολεύει στη διαδικασία της δοκιμής του Template σας. Είναι εύκολο και γρήγορο να στέλνετε Email χωρίς να μπλέκεστε με κάποιο από τα παραπάνω συστήματα διαχείρισης. Ούτε καν να περάσει από το μυαλό σας να το χρησιμοποιήσετε για καμπάνια.

Campaign Monitor

Tο Campaign Monitor είναι η καλύτερη επιλογή σε όλα τα επίπεδα. Το μόνο αρνητικό είναι ότι δεν είναι δωρεάν. Χρεώνει ανά email. Προσφέρει τα πάντα από διαχείριση newsletter και mailing lists μέχρι αναλυτικά στατιστικά και έτοιμα templates. Επίσης παρέχει τη δυνατότητα να γίνετε resellers και αν έχετε τη διάθεση να μάθετε περισσότερα για Newsletter παρέχει πολύ αξιόλογα άρθρα με πληροφορίες και Tutorials.

MailChimp

Παρόμοιο με το Campaign Monitor, το MailChimp δίνει πάρα πολλές δυνατότητες και απλοποιεί πολύ τη διαδικασία. Διαφέρουν κυρίως στον τρόπο χρέωσης.

Wordpress και FeedBurner

Το αγαπητό Wordpress χρησιμοποιώντας τη δύναμη του χαμαιλέοντα μπορεί και μετατρέπεται σε Newsletter Manager. Αν σας ενδιαφέρει κάτι τέτοιο, διαβάστε το tutorial “Build a WordBurner Email Newsletter Manager using WordPress and FeedBurner” από το nettuts.com.

Γλιτώστε το Spam

Το χειρότερο για μια ιστοσελίδα που βασίζεται πολύ στα Newsletter της είναι να μπουν οι mail server της στη μαύρη λίστα Spam. Ειδικά στο Hotmail είναι δύσκολο να τη γλιτώσετε. Συνήθως την πατάει και η ίδια η Microsoft. Υπάρχουν διάφορες λύσεις. Η πιο αποτελεσματική είναι να χρησιμοποιείσετε το Campaign Μonitor — ή μια παρόμοια υπηρεσία — το οποίο υπόσχεται ότι τα email δεν πρόκειται να βρεθούν σε spam φάκελο.

Συμπέρασμα

Τα HTML emails είναι μπελάς για κάθε Developer. Θέλουν μεγάλη προσοχή κατά το σχεδιασμό και πολλές δοκιμές. Είναι καλό μέσα σε ένα HTML email να κρατάμε τα πράγματα απλά. Λίγες φωτογραφίες, περισσότερο κείμενο και σκοπό να οδηγήσουμε τον αναγνώστη στη σελίδα μας.

Από εκεί και πέρα ανάλογα με τις ανάγκες της κάθε εταιρίας μπορούν να γίνουν και οι αντίστοιχες επιλογές σε λογισμικό διαχείρισης και αποστολή των Newsletter. Το παρόν άρθρο είχε σαν σκοπό να ξεκαθαρίσει το τοπίο σχετικά με όλη τη διαδικασία της δημιουργίας και της αποστολής Newsletter και να παραπέμψει σε περισσότερο υλικό όσους θέλουν να γίνουν γκουρού.

Πηγές και περισσότερο διάβασμα

• HTML e-mails και πως πρέπει να σχεδιάζονται - Tsevdos.com
• Email campaign, email marketing και άλλα φρούτα - Webz.gr
• E-mail is not a platform for design - Zeldman.com
• Email Newsletter Usability - Nielsen Norman Group Report
• How To Code HTML Email Newsletters - Reachcustomersonline.com
• HTML Email Guide - Anandgraves.com
• MailChimp.com Resource Center
• CampaignMonitor Resources