css newsletter templates and email

Ας μάθουμε πως να κάνουμε τις σελίδες μας με στιλ. Τα Cascading Style Sheets είναι ο τρόπος για να το επιτύχουμε.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
mgiota
Δημοσιεύσεις: 190
Εγγραφή: 15 Σεπ 2009 13:11
Τοποθεσία: Θεσσαλονίκη
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από mgiota » 23 Νοέμ 2009 00:37

Γεια σας παιδιά,

θέλω την άποψή σας όσον αφορά τα css newsletter templates και την αποστολή τους μέσω email.

Να σας περιγράψω λίγο τι εννοώ. Έχω έτοιμα κάποια εικαστικά που μου έχει δώσει ο γραφίστας και εγώ έστησα το layout με html και css. Αυτά τα εικαστικά στη συνέχεια θέλω να τα ενσωματώσω στον fckeditor, έτσι ώστε όταν ο χρήστης πατάει το κουμπί "Πρότυπα (templates)" του editor να μπορεί να επιλέγει αυτό που επιθυμεί. Αυτή την ενσωμάτωση την έχω ξανακάνει πιο παλιά κάνοντας edit το αρχείο fcktemplates.xml το οποίο βρίσκεται μέσα στο φάκελο fckeditor.

H ερώτησή μου είναι στα css styles που θα χρησιμοποιήσω στο εικαστικό μου και στο αν θα υπάρχει κάποιο πρόβλημα στην αποστολή μέσω email. Παρατήρησα ότι μπορώ να χρησιμοποιήσω μόνο inline styles. Η μήπως τελικά μπορεί να γίνει κ αλλιώς; Σ'ένα ξένο form συζητήθηκε κάτι παρόμοιο:

"You really need to use hard coded inline styles for many things in html email. Some but not all embedded css can work, but in general whereas we try to use web standards in the site, email is a different animal with a whole lot of additional issues based on whether using gmail, outlook or whatever email client and getting predictable visual results in all email clients is very tricky business.".

Γνωρίζει κάποιος κάτι γι'αυτό το ζήτημα, πως να στέλνουμε δηλαδή newsletter templates και αν υπάρχουν περιορισμοί στα css;

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8574
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από Basilakis » 23 Νοέμ 2009 07:38

Ναι για να μπρορέσει να παίξει ένα newsletter layout πρέπει να είναι table based και inline css :)

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από korgr » 23 Νοέμ 2009 09:33

Basilakis έγραψε:πρέπει να είναι table based
:yea:

mgiota
Δημοσιεύσεις: 190
Εγγραφή: 15 Σεπ 2009 13:11
Τοποθεσία: Θεσσαλονίκη
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από mgiota » 23 Νοέμ 2009 11:26

Το layout που μου έδωσε ο γραφίστας έχει rounded πλαίσια και rounded εικόνες. Ενώ φαίνεται ότι είναι στημένο μια χαρά, δοκιμαστικά πήγα να στείλω email και τα πράγματα δεν είναι πολύ αισιόδοξα. Χρησιμοποιώ πολλά divakia με background-images.

Γενικά τι μου προτείνετε το layout να είναι όσο το δυνατό πιο απλό ή μπορούν να γίνουν ακόμα και περίπλοκα πράγματα;

mgiota
Δημοσιεύσεις: 190
Εγγραφή: 15 Σεπ 2009 13:11
Τοποθεσία: Θεσσαλονίκη
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από mgiota » 23 Νοέμ 2009 13:48

Το 'ψαξα λίγο περισσότερο το ζήτημα και βρήκα ένα πολύ καλό άρθρο για css και διάφορους email clients.

http://www.campaignmonitor.com/css/

Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6231
Εγγραφή: 30 Νοέμ 2004 03:09

css newsletter templates and email

Δημοσίευση από fafos » 23 Νοέμ 2009 14:11

H katastash sthn symvatothta ton email clients einai xeiroterh apoti stous browsers... gi'auto oi megales etiareies ta kanoun ola mia eikona kai ta stelnoun stous paralhptes..
Οι πάνες και οι πολιτικοί πρέπει να αλλάζονται συχνά για τον ίδιο λόγο...

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8574
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από Basilakis » 23 Νοέμ 2009 15:12

mgiota έγραψε:Το layout που μου έδωσε ο γραφίστας έχει rounded πλαίσια και rounded εικόνες. Ενώ φαίνεται ότι είναι στημένο μια χαρά, δοκιμαστικά πήγα να στείλω email και τα πράγματα δεν είναι πολύ αισιόδοξα. Χρησιμοποιώ πολλά divakia με background-images.
Κάποτε κάναμε layouts Με Images στις γονίες, κομένες στα 10χ10 για να μπορούμε να έχουμε ένα rounded corner στον πίνακα.... Τα έχουμε περάσει, πριν σκάσουν μύτη τα -moz-radious-corner. Μπορεί να γίνει οπότε και το rounded design που σου έδωσε ο γραφίστας...

Στις μέρες μας όμως δυστυχώς, μαθαίνετε τα divs και τα CSS και δεν ξέρετε βασικά κομάτια της HTML (όχι της XHTML :P)

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από korgr » 23 Νοέμ 2009 15:20

Basilakis έγραψε: Κάποτε κάναμε layouts Με Images στις γονίες, κομένες στα 10χ10 για να μπορούμε να έχουμε ένα rounded corner στον πίνακα....
Εγω το καποτε το σερνω μαζι μου :P
http://www.papcars.gr/index.php

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8574
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από Basilakis » 23 Νοέμ 2009 15:27

Αυτά είναι... και εμείς καθόμαστε και παιδευόμαστε με θετικά και αρνιτικά margin / paddings με radious για 15 διαφορετικούς browsers!

mgiota
Δημοσιεύσεις: 190
Εγγραφή: 15 Σεπ 2009 13:11
Τοποθεσία: Θεσσαλονίκη
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από mgiota » 23 Νοέμ 2009 15:28

το εκανα το rounded corner design με <ul><li>. Το -moz-radious-corner δεν το έχω χρησιμοποιήσει γιατί εξάλλου δεν έχω πολύ καιρό που ασχολούμαι με το web design/development.

Στην ουσία χρησιμοποιήσα 3 li, το πρώτο ήταν μία εικόνα, στην ουσία το πάνω μέρος του rounded, το δεύτορο li είχε ένα background color και το 3ο li ήταν επίσης μια εικόνα το κάτω μέρος του rounded. Έτσι σχηματίστηκε μια χαρά αυτό που ήθελα, αλλά το πρόβλημα ήταν όταν πήγα να το στείλω με email. Φαινόταν σπασμένο και χωρισμένο στα 3. Γι'αυτό επειδή πρέπει να το τελειώνω σήμερα τα έκανα ορθογώνια τα πλαίσια και θα το ξανακοιτάξω όταν θα έχω περισσότερο χρόνο.

Σ'ευχαριστώ πάντως.

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8574
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από Basilakis » 23 Νοέμ 2009 15:30

Φενόταν σπασμένο γιατί στα li δεν όρισες τα μεγέθη του στο ύψος και άλλαζε..

η σωστή λύση είναι να τα βάλεις αυτά μεσα σε ένα table για να μπορεί να κρατάει το ύψος του.

mgiota
Δημοσιεύσεις: 190
Εγγραφή: 15 Σεπ 2009 13:11
Τοποθεσία: Θεσσαλονίκη
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από mgiota » 23 Νοέμ 2009 15:33

ok σίγουρα θα το δοκιμάσω για να τα μάθω και σωστά.

Thanks

mgiota
Δημοσιεύσεις: 190
Εγγραφή: 15 Σεπ 2009 13:11
Τοποθεσία: Θεσσαλονίκη
Επικοινωνία:

css newsletter templates and email

Δημοσίευση από mgiota » 24 Νοέμ 2009 11:34

Μου προέκυψαν ακόμα 2 απορίες.

Έκανα το newsletter template, όλα μια χαρά και δοκίμασα να το στείλω σε διάφορους email clients. Στο gmail πηγαίνει κανονικά στα εισερχόμενα στο hotmail όμως πηγαίνει στην ανεπιθύμητη αλληλογραφία. Που οφείλεται αυτο;


Επίσης ποιο μέγεθος γραμματοσειράς είναι καταλληλότερο για email; Σ'ενα αγγλικό άρθρο βρήκα ότι κατάλληλο είναι Arial 12. Και 'γω χρησιμοποιώ Arial γραμματοσειρά και 12px, μου φαίνονται όμως λίγο μικρά.

Απάντηση

Επιστροφή στο “CSS - Cascading Style Sheets”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 1 επισκέπτης